見出し画像

（スキカレ３ケ月目・６月１日～８日）４８歳女スキルなしがスキルカレッジを受講して転職するまでの話

転職猫

この記事はこういうことを書いてます

４８歳これといったスキルなしがビジネススキル講座のスキルカレッジで自己分析の仕方やプログラミングを学んで転職を目指す物語である！

このブログのゴール1年後に転職すること。
しなければこのブログは永遠に完結しない？



2024年6月1日（土）から６月８日（土）まででやったこと



・コース名：Ｗｅｂサイト制作_ver.１.0
・レッスン名：HTMLとCSS・
ヒントだけでWEｂページを実装しよう、
　チャットアプリのレイアウト作成
・やったこと：サイドバーヘッダーのレイアウト作成

学習時間


合計：１５時間２０分
１日　約１時間　30分くらい

【６月１日の記録】


気づいたこと
side-box内に子要素が2つある。
子要素が両端に寄り、等間隔になるspace-betweenを使って配置されている。
難しかったこと・悩んだこと
全てのクラスをdivにしていた。
必要のないmenuクラスを作り、CSSを編集していた。
知らなかったプロパティspace-betweenが出てきたが、
実際に存在していた。
flex-endを使用しても効果がなかったのは、space-betweenが原因だった。
hrefのスペルミス（hlef）に気づかなかった。
その他考えたこと
難しく考えすぎる傾向がある。
基本を身につけていないため、その都度復習が必要。
CSSの追記を間に入れていたが、一般的なやり方ではなかった。
AI先生に聞いてみると、関連するスタイルは近くに集めるべきと学んだ。
記述が長くなると、戻るのが手間だからだと思われる。
2時間があっという間に過ぎてしまい、1つも問題を解決できなかった。
このペースで6月中に終わるのか不安がある。

【６月２日の記録】


気づいたこと
親要素に display: flex; を指定することで、
子要素を横並びにできる。
margin-right: を使って要素の右側に余白を作れる。
a をセレクタとして指定すると、
クラスに関係なくすべての a 要素に適用される。

難しかったこと・やっていた余計なこと
クラスごとに文字色を設定してしまった。
背景色を消すにはCSSの記述を削除するだけだった。
セレクタの意味が分からなかった。
<h2 class="current-group"> に余計な href をつけていた。
main-header の余白を margin で設定していたが、
実際には padding だった。
current-group クラスで余白を作ろうとしていたが、
親要素で設定すべきだった。
a { を何度も作ってしまった。

その他の考え
難しく考えすぎる傾向がある。
セレクタの定義をAIに質問し、理解を深めた。
各操作にはルールがあり、それを理解することが重要。
実力は作業量に比例するので、経験を積むことが大事。
padding は背景を含めた余白である。
flex-direction を使えば要素を縦書きにできる。

転職サイトでよさそうな求人を見つけたものの、
以下の点で自信を持てずにいる

  1. 現在のスキルレベルでは自信を持てない。

  2. 「プログラミングできる」と言っても、

  3. 実際には実務で役立つレベルに達していない。

  4. あいさつ程度の日本語しか話せないのに、
    専門的な通訳の仕事に挑戦する状態と同じように感じる。

【６月３日の記録】


気づいたこと
HTMLのコメントアウト方法を思い出した。
justify-content: space-between; の影響で
表示が崩れていることに気づいた。

難しかったこと・悩んだこと
justify-content: space-between; によって
要素が横に広がっている原因は理解できたが、
修正方法がわからない。

その他考えたこと
前半は起床後の集中力を活かして問題解決を試みたが、
うまくいかなかった。
自分の未熟さに失望したが、
5月の学習成果を振り返ると、
ゆっくりと確実に成長していることがわかる。
あきらめずに努力を続けることが大切。

【６月４日の記録】

気づいたこと
あまり深く考えずに解答を見た。
justify-content: space-between; で
要素が横に広がっているのは、
そもそもHTMLでの親要素設定の問題だった。

難しかったこと・やっていた余計なこと
構造を理解していない。
思い込みで間違い続けた。
不要な場所に flex-direction: column; をつけようとしていた。

その他、考えたこと
問題の原因は自分が思っていたところと異なっていた。
初歩的なことが原因だった。
焦りが原因でミスをしていると感じる。
朝の時間不足と早く終わらせたい焦りがある。
焦っても解決にはつながらないと認識。

【６月５日の記録】

気づいたこと
おかしい操作をしていたことに気づいた。
自分が何かおかしいことをしているのに
気づいていなかったことに気づいた。

難しかったこと・余計なこと
<div class="header-leftbox">Member:</div> の位置が間違っている。
テキスト "Member" は適切な場所に配置するべき。
勝手に終了している部分がある。
<ul class="member-lists"> の終了タグを忘れていた。

その他、考えたこと
万策尽きたと思っても、
実際には全く尽きていないことに気づいた。
多分、以前の記述をそのまま持ってきたために
間違った可能性がある。

【６月６日の記録】

ポジティブな気づき
自分が誤った操作をしていたことに気づいた。
誤ったことをしているのに
気づいていなかったことに再度気づいた。
header-leftbox の親要素設定を
再考する必要があると感じた。
member-list に display: flex; を付与したら
要素が横並びになった。
HTMLのコメントアウトは <!-- --> であり、
ビックリマークを手書きするとおかしくなることを学んだ。

難しかったこと・やっていた余計なこと
flex-direction: column; でタテ書きにしようと考えていたが、
実際には必要なかった。
AIの指示通りにした結果、
無駄な操作をしてしまった。
li のクラス名を list にしていたが、
実際は member が正しいと気づいた。
コピペを多用した結果、ミスに気づかずにいた。
Editボタンの編集で、
「a 要素にボタン用のクラスを付与しましょう」
の部分で行き詰まった。

 その他、考えたこと
変な操作をして迷走することが多い。
解答を見て間違いに気づく度に大きなショックを受けてしまう。
朝に少しだけHTMLをやろうとして、
深みにハマり、他の作業時間がなくなる。
夜にやろうとすると睡魔に襲われる。
これは時間の使い方の問題であり、
どこかにスキマ時間を見つけるべきだと感じた。

【６月７日の記録】

ポジティブな気づき
おかしい操作をしていたことに気づいた。
おかしいことをしているのに
気づいていないことに気づいた（3日目）。
HTMLを確認し、終了タグに問題があると感じた。

難しかったこと・やっていた余計なこと
Editボタンの枠線の色設定を個別に行っていた。
a 要素にボタン用のクラスを付与する際の
記述に問題があった。
スペルミスがあり、href が正しい。
a 要素にリンクが正しくついていなかった。

その他、考えたこと
スペルミスのまま画面公開していて恥ずかしかった。
毎回間違いに気づくたびに大きなショックを受ける。
AIにコードの不備を質問したが、一時的にエラーが発生した。
もしかしたらAIも簡単な質問に呆れたのかもしれないと感じた。

【６月８日の記録】

ポジティブな気づき
コピペが原因で操作ミスが起きるので、
復習しながらノートにまとめて入力するようにした。
input 要素には終了タグがないことに気づいた。
value は送信ボタンのテキストを設定するプロパティである。
submit は送信ボタンの設定を意味し、summit ではない。

難しかったこと・やっていた余計なこと
input が何か、他のプロパティがどう動くのか理解していない。
「type」を正しく書けず、何度も「tpe」としてしまう。
input に終了タグがない理由がわからなかったが、
AIに質問して理解した（input は空要素である）
input-text と submit-btn の高さが違ったままにしていた。
input-text に margin を設定し、必死に調整していた。
submit-btn 内のコロンにエラーメッセージが出たが、
コピペし直すとエラーが消えた。
各子要素に同じ高さ設定を行ったが、
いつもと逆のやり方になった。

その他、考えたこと
手入力するとスペルミス、
コピペすると変な記述になる問題。
input-text と submit-btn の体裁を
なんとか記述できた。
以前なら submit のテキストを placeholder にしていたが、
今回は value に正しく設定した。
余白を時計回りに意識し、
レイアウトが崩れた原因が親要素にあると見抜いた。
2時間かけても解決できず、
答えを見たら全く見当違いの記述をしていた。
ノートに整理しながらコードを書いたのは良かったが、
時間をかけすぎないようにする。
2時間で解けなければ解答を見て検証をしっかりやることにする。
記述は直さず、明日の朝もう一度挑戦することにした。


６月第１週目のまとめ

Webページを作成する際にやりがちな主な原因とは？

  1. 難しく考えすぎる: 複雑に考えすぎてシンプルな解決策を見逃してしまう。

  2. 単純なスペルミス: タグやプロパティのスペルミスがエラーの原因となる。

  3. プロパティの理解不足

  4. コピペ後の修正不足

  5. コードの誤記: 明らかにおかしいコードを書いているのに気づいていない。

  6. 時間の使い方の問題: 効率的に時間を使えず、無駄に時間を費やしている。

これからのアクション


1. 時間を区切って問題を解く:  まず、一定の時間を決めて問題を解く。
2. 間違った問題や理解が不足している部分を確認する。問題を解いた後、間違った部分や理解が不足している部分を確認する。間違えた問題を特定し、その原因を分析する。
3. 復習する: - 間違えた問題を再度解き直す。繰り返し取り組むことで、同じミスを防ぎ、知識を定着させる。


この記事が気に入ったらサポートをしてみませんか？