20210208・9_アウトプット(オリジナルアプリ/志望動機作成)

アウトプット画像

2/8 行ったこと 1時間(コードを書いている部分のみカウント)
  • 志望動機の作成…4時間15分
    👉7割くらい進んだ。

  • ラジオボタンcss…1時間
    👉何故反映されないのか???

  • 履歴書・職務経歴書・最終課題説明文…1時間
    👉やっとできた!!!


2/9 行ったこと 3時間10分
  • ラジオボタンcss…2時間30分
    👉原因は、idとfor属性の不一致だった!

  • アウトプット…40分



新しい発見について

ラジオボタンcssについて

enumを使って実装していたラジオボタン についてcssが上手く反映されず苦労した。

結論(勉強になった事)

  • 解決法の結論は「input[type=radio]要素のid属性とlabel要素のfor属性を一致させる!!!」だった😂

  • ラジオボタン の装飾方法として、以下のポイントがあると理解。

(1)inputのid属性とlabelのfor属性の名前を一致させて、labelのfor属性を選択するとid属性も選択されるようリンク付を行う。
(2)その上でid属性にあたる部分はdisplay: noneにして隠す。
(3)labelタグ内にボタンを置くスペースを作り、擬似要素でボタンを生成する。

今回は(1)が上手く行っておらず、反映されていなかった!

実際のコード

↓(ブラウザから検証キーで確認)ここが原因だった。 ラジオボタン cssが当たらない原因

↓ここを修正。 コードの修正。

反映できた!(ビューも整えた☺️)

完成!!!ラジオボタン

参考にした記事

↓これを取り入れたいと思った💡しかし、コピペしてクラス名など変更するも適用されない。なぜ?と苦慮😣。

copypet.jp


↓この記事から、labelタグ内にボタンを置くスペースを作り、その中に擬似要素を入れるのか!と仕組みを理解できた。

ginneko-atelier.com


↓この記事から、「inputのid属性とlabelのfor属性が一致していない!!😲」と気付き、反映できた🎉😂

thr3a.hatenablog.com




感想

  • やっと履歴書と最終課題説明文が完成した!志望動機もあと少し。ゆめみさんに何故入りたいのか言語化すればするほどやっぱり魅力的で、本当に入りたい。

  • 履歴書を書くために、昔の履歴書(1社目と、現在の公務員に提出した時の)を振り返っていたんだけれど「成長したい」「誰かの役に立ちたい」ということが両方書いてあって、ずっと根底ではそう思って生き続けているんだなあとふと感じた😂多分これからもその性格は変わらないんだと思う😂

  • 昔は事務の仕事からスタートだったけれど、それぞれの職場において試行錯誤して仕事してきて、事業者とイベントを作り上げたり、職場の人間関係を改善できるように工夫したり、できることもだんだん増えていったなと感じた。転職する機会がなければこんなふうに振り返る機会もなかったと思うと良い機会である。(振り返りって大事)

  • オリジナルアプリ一歩ずつ進んでいる。一つ一つ集中して完成させていこう。

  • 昨日よく寝たおかげで調子が良かった。やっぱり睡眠って大事😭!!!




覚書(12/29計画の見直し)

(1)やるべきこと (2)やりたいこと (3)やれること

(1)やるべきこと

  • 卒業要件の完成

(2)やりたいこと

(3)やれること

メンタル:楽しみながら、ゲーム感覚でいく🎮😎

時間で区切り(達成すればよし)
  • 1日 15分以上勉強する
追加実装のミニアプリを作り、引き出しを増やす
優先順位 内容(機能) 締め切り 達成度
1 AWS S3 12/18 完了(フリマアプリ)に実装)
2 AWS EC2 12/24 完了(フリマアプリに実装)
3 ウィザード形式 12/27 完了
4 SNS認証 12/28 完了
5 複数条件検索 12/29 完了
6 タグ付 12/31 完了
7 画像プレビュー 1/2 完了※フォーク
8 複数枚写真OK 1/4 完了※7に追加実装
9 コメント機能(即時更新) 1/8 完了
10 クレカ登録 1/10 完了
11 パンくず 1/14 完了
12 日本語エラー 1/18 完了



身に付ける力(直近)

  • PHP7

  • Docker


身に付ける力(ゆくゆく・覚書)

  • ドメイン駆動開発

  • 環境構築

  • 環境変数などのOS知識

  • バージョン対応力

  • データベースをインポートする力・エクスポートする

  • GitHubActions×OpenAPIGenerator(APICilent)