プロフィール
れもも(@lamoneido)と申します。
2021/12〜本業休職をきっかけにweb制作の学習を始めました。先日デイトラweb制作コースの卒業制作を終えました。
これからshopifyコースも控えています＾＾
学習を始めた時から「今日は何を何時間やった」という記録を残していたので、今回はその記録を振り返って学習記録にまとめていこうかなと思います。
今回が振り返り１発目ということですが、これから1週間ずつ振り返りの記事を出していこうと思います。
※ちなみにこの記事では、当時記録していた学習記録もそのまま公開しています。
・第1弾：【独学の記録】勉強0日目〜7日目で学んだこと Progateとドットインストール始めました ←今回の記事
・第2弾：【独学の記録】勉強8日目〜14日目で学んだこと 模写コーディングたくさんやりました
・第3弾：【独学の記録】勉強15日目〜21日目で学んだこと デイトラ入会を決意しました！
・第4弾：【デイトラ学習記録】勉強22日目〜28日目 爆速でデイトラWEB制作コース中級編突入！
・第5弾：【デイトラ学習記録】勉強29日〜35日目 Sass学習・デザインカンプからのコーディング
web制作学習はなんで始めたの？
本業を休職したことをきっかけでweb制作学習を始めました。休職した理由は今は置いときまして、2021年12月1日から会社を休み始め、この時はweb制作をやろうなんて1ミリも思っていなく、ましてやプログラミングやホームページ制作のことも全く知らない状態でした。
会社を休む直前まで本業のことで精一杯だったのでプログラミングやりたいとか考えたこともなかったですね。
きっかけは、会社を休み始めた瞬間に「自分、会社に復帰できなかったらどうなっちゃうんだろう」っとゆう不安・焦りから何かやれること見つけないと自分ヤバいかもと思ったことでした。
焦っているにも関わらずベットの上でダラダラ見ていたyoutubeの広告でプログラミングのことをたくさん耳にし、プログラミングって自分にできるのかな？って考え始めました。
すぐさま「プログラミング 初心者」とGoogle先生で調べたところProgateが初心者にはオススメと書いてあったのでとりあえずiPhoneでProgateのアプリをダウンロードしました。
これが2021年12月1日の出来事であり、web制作学習の始まりでした。
会社を休んだ途端、自分て会社辞めたら何にも出来ない人なんだなって、この時はすごく不安になりましたね、、、
web制作 学習の記録
ということでProgateをダウンロードしたれももは、無料版のままHTMLから学習を始めました。
ちなみに0日目〜7日目の1週間で学習に費やした時間は44.5時間でした。
学習0日目〜7日目（学習：１週間目）
当時記録していた資料見づらいので下表にまとめ直ました！笑
| 日付 | 学習内容 | 学習時間 | 合計時間 |
|---|---|---|---|
| 12/1 | ・Progate：HTML/CSS初級1周 | 2.0h | 2.0h |
| 12/2 | ・Creator Quest：chapter1〜10(HTML) | 4.5h | 4.5h |
| 12/3 | ・Creator Quest：chapter11～23(HTML) | 6.5h | 6.5h |
| 12/4 | ・休み（父親とサッカー観戦へ） | 0 | 0 |
| 12/5 | ・Creator Quest：chapter1～3(CSS) ・Progate：HTML/CSS初級1周（復習） ・Progate：HTML/CSS中級1周 ・Progate：HTML/CSS初級道場レッスン | 1.0h 1.5h 2.5h 2.5h | 7.5h |
| 12/6 | ・Progate：HTML/CSS中級道場レッスン ・Progate：HTML/CSS上級＆上級道場レッスン ・Progate：Flexbox編 ・模写コーディング | 6.5h 1.5h 0.5h 4.0h | 12.5h |
| 12/7 | ・ドットインストール(HTML/CSS基礎文法、フォーム編) ・ドットインストール(CSSセレクタ編、flexbox編) ・模写コーディング「Profile」 | 5.0h 2.0h 4.5h | 11.5h |
という感じで、かなりやりこんでいますねw 自分でも引いております！笑
一日12時間半はちょっと気持ち悪いですよね。。。
12/1（学習：1日目）
この日はProgareのアプリをダウンロードして、スマホでHTML/CSS初級を１周しました。
アプリでやったことある方はわかると思うんですけど、アプリ版は文字を打たずに「<h1>」とか「</h1>」のタグがボタンになっているのでポチポチ押していくだけで進められるので結構スイスイ進められました。
この日の感想としては、「めっちゃ簡単じゃん！簡単逆に不安なんだけど？Progateって簡単すぎるのかな？」という感じでした。
本当にこんな簡単でいいのかな？と心配になったので2日目は他の教材に取り組んでいます。
この時はまだProgateに課金する勇気がまだなかったってゆうのもありましたね。
12/2、12/3、12/4（学習：2〜4日目）
Progateが簡単すぎて不安を感じたれももはCreator Questという無料で動画解説+教材までサイトに用意してあるサイトを発見しこれで学習をしてみました。
この解説動画がわかりやすくて面白くて、2日かけて全動画を全てみました！笑
Progate初級を１周していたからってゆうのもあると思いますが、解説が本当にわかりやすくてHTML/CSSの基礎中の基礎はこのCreator Questで身についたと言ってもいいくらいです。
進め方が面白くて、まずHTMLだけを一気に解説するんですよね(chapter1〜23)。CSSにはあまり触れずにHTMLだけでサイトを作っていきます。なのでHTMLを細かく説明してくれるので超初心者の人には個人的におすすめなサイトです！
ただし12/5の記録を見るとCSS編chapter1〜3までやってこのサイトでの学習終わっているじゃないですか？なんとここで教材更新がストップしているんですねww
はい、ということで12/5〜またProgateに戻ります！
次の日は父親とサッカー観戦に行ってましたので勉強お休みしましたm(_ _)m
12/5（学習：5日目）
Creator Questを全部制覇したれももはProgate初級を再び復習して、Progateに課金することを決意し、中級編→初級道場レッスンと一気に進めていきました。
Creator Questでかなり基礎力はついた自信があったのでこの辺りは難なく進められました。
自信がついてきてモチベーションがかなり上がっていたのでこの辺りの勉強時間がエグいですね、、、笑
初めてオンライン教材に課金するのは少し緊張しましたね〜。
12/6（学習：6日目）
Progateを引き続き進めていき、中級道場レッスン→上級→上級道場レッスン→Flexbox編まで一気に進めこの日でHTML/CSS編が無事完了しました！
ここまで学習するともうサイトの見た目くらいだったら作れちゃうよね？と思って模写コーディングを始めました。
おそらくご存知の方も多いと思いますが、模写コーディングおすすめの練習素材を紹介しているサイトがあって、入門〜上級まで用意されているんですが、まず入門からやってみました。
やり方としては、画像素材はサイトからダウンロードできるのでそれを使用し、余白やフォントの種類・サイズはGoogle拡張機能を使って調べながらHTML/CSSを書いていました。
12/7（学習：7日目）
この日は前日から取り組んでいた模写コーディングを完成させました。少し上手くいかないところもありながらもなんとか自力でできたので、すごい自信になりました！
そして模写コーディングをやっていた際に、HTML/CSSに関して理解が曖昧なところやProgateで出てきた事しか自分はまだできないんだと気づき、この日からドットインストールでの学習を始め、すぐに有料版に切り替えてガンガン進めていきました！
学習１週間でサイトの見た目だけ自力でできるようになるなんて本当に感動でした！
まとめ
以上がれももの1週間の学習記録でした。
こうやって記録してみると結構頑張ったなと感じるものですね。ただ、これだけ進められたのは休職して時間を大量に確保できたからに尽きます。
質より量でカバーするタイプなのでこのスタイルが功を奏している感じで良かったです。
学んだこと
Progate
- HTML/CSS 初級＆初級道場レッスン
- HTML/CSS 中級＆中級道場レッスン
- HTML/CSS 上級＆上級道場レッスン
- Flexbox編
ドットインストール
- HTML基礎文法編
- HTMLフォーム部品編
- CSS基礎文法編
- CSSセレクター編
- HTMLフレックスボックス編
Creator Quest
- HTML chapter1〜23
- CSS chapter1〜3
模写コーディング
・下記サイト 入門編
→模写コーディング練習サイトまとめ
この記録が皆さんの参考になればと思います。気になることがあれば是非コメントなどお待ちしております。
それでは次回は14日目まで(学習2週間)の記録を書きますのでそちらもご覧ください。
コメント