20210222・23・24_アウトプット（レスポンシブ対応・フィードバック改善・READMEの仕上げ）

アウトプット画像

2/22行ったこと

レスポンシブ対応・フィードバックを受けての改善…4時間
👉6割進んだ😍

2/23行ったこと

レスポンシブ対応・フィードバックを受けての改善…7時間30分
👉アプリが一旦できた😍
READMEの修正...4時間 👉文章の部分が9割できた。

2/24行ったこと

READMEの修正…5時間
👉文章の残り1割と、画像等の添付。完成した😍
企業に応募

新しい発見

cssについて

cssについて、カンマとスペースの違いがわかった。カンマは同じように他の要素にも適用となり、スペースはその配下の要素に反映されると理解。

CSSの複数セレクター表記に、「,で区切る」「半角スペースで区切る」「C... - Yahoo!知恵袋

少し古い記事だが、意味がわかりやすかった。

A , B {～} A要素とB要素に「～」が反映。
A B {～} A要素の中のB要素に「～」が反映。
A.B {～} class="B"が付いたA要素のみに「～」が反映。
A .B {～} A要素の中の「class="B"が付いた要素」のみに「～」が反映。
A B.C {～} A要素の中の「class="C"が付いたB要素」のみに「～」が反映。

フィードバックを受けての改善について

すぐに直せる部分をまずは修正しようと思った。

今回直したこと

習慣カウントページと、セルフコンパッションのページがサイズを縮小した際、大幅に崩れる。
イフゼンルールの文字数制限が12文字だと足りない。20文字くらいだと嬉しい。
スマホサイズで見たときにエラー文が小さい。
ランディングページは、”４つの機能”と書いてあるのでその下の説明もナンバリングした方が見やすい。

新しい発見だったこと

remとemの違い。

どちらも相対的に文字サイズを指定できる単位であるが、emは親要素からの相対的な大きさ、remは（予め全体の文字サイズを決めて）そのアプリケーションで決めたフォントサイズからの相対的な大きさであることを知った。

マークダウン記法の目次の付け方について

どうやったらREADMEが見やすくなるのか考えたり調べていたところ、目次を付けられることを知った。

目次側

# 目次
1. [アプリケーションの概要](#anchor1) 
1. [なぜこのアプリケーションを作ろうと思ったのか](#anchor2) 
1. [アプリケーションの機能一覧](#anchor3)

そのリンク先側

 <a id="anchor1"></a>

# [1.アプリケーションの概要](#anchor1)

上記にて反映ができた！
また反映できているか確認する際に、はてなブログが使える😂（笑）
（マークダウンのところに貼り付けして、プレビュー）

感想

数ヶ月前まではマイグレーションファイルについて、upのまま削除しちゃったり、rollbackの処理方法を見ないとわからなかったり、シークエルプロにある”これはなんだ？”と（マイグレーションファイルを）削除してしまうこともあったり、いっぱい失敗をしてきたが、大分スムーズに変更できるようになったことを実感した😂
どうやったらREADMEについて分かりやすく伝えられるだろうかというのをとにかく考えた。マインドマップで思考を整理してから構成する方法はかなり自分にあっていてよかった☺️
ずっとブログを続けてきて、アウトプットによる頭への定着や、間違いに気付けるメリットのほか、マークダウン記法に対する抵抗や、スピードアップできたことも大きな恩恵だとREADMEを書いていて感じたことだった。

ここまでの学習時間について

8月1日から勉強を始めて、6ヶ月と23日（計207日）が経過。

学んだ内容	時間
HTML	26時間15分
CSS	69時間00分
Ruby	46時間10分
GitHub	3時間00分
Heroku	6時間00分
JavaScript	44時間30分
Ruby on Rails	1218時間20分
SQL	8時間15分
セキュリティ対策	7時間00分
予備知識	5時間20分
AWS	34時間10分
合計	1476時間15分