どうも、Webデザイナーのわすいです。
今回は、未経験からコーディングを学ぶ効率の良い勉強方法についてのお話です。
知識ゼロからコーディングを始める際の勉強の流れを、経験談も交えながらご紹介します。
▼こんな方におすすめ
- これからコーディングを学びたいと思っている
- コーディングを勉強したいが何から始めていいかわからない…
- 未経験でも実力が身につくコーディングの勉強方法が知りたい
在宅ワークという働き方も定着してきたなか、技術を身に着けたいという方も増えている気がします。
これからコーディングを学びたい！という方の参考に、少しでもなれば嬉しく思います。
もっともっといろんな働き方が実現されて、適した環境でお仕事ができる人が増えればいいな。
そもそもコーディングとは？HTMLとCSSについて
コーディングとは、その名の通りコードを書くということ。
Web制作におけるコーディングとは、主にHTMLやCSSといったコンピュータ用の言語を使って、デザインをWeb上に表示させるためにコード化することを言います。
HTMLは構造をつくる役割（骨組み）を、CSSは配置や装飾（見た目）の部分を担います。
主に、このHTMLとCSSという言語を学ぶことが、コーディングを勉強するということになります。
初心者が独学で効率的に学ぶ流れ【私の経験談】
私は会社に勤めながら、だいたい1ヶ月くらいで基礎的なコーディングをマスターしました。
時間にすると20時間～30時間くらい。
次のような流れで勉強しました。
▼勉強の流れ
ステップ１
本を1冊マスターして体系的な基礎知識を身につける
ステップ２
模写コーディングで実際に手を動かしながら実践力を身につける
ステップ３
つくりたいものをゼロからコーディングしながら応用力を身につける
当時の私はWebデザイナーをしていて、コーディングと全く無関係ではありませんでしたが、知識はほぼゼロからのスタートでした。
なので勉強期間としては、未経験で会社に勤めながら（残業あり）でも、最短1週間から長くて数ヶ月もあれば十分に基礎を固められるんじゃないかと思います。
完璧にマスターするのを目指すのではなく、まずはじめに体系的な基礎知識を身につけたら、あとの細かい技術は実際にやりながら学んでゆくのが、効率良く勉強するポイントです。
コーディングの勉強方法を詳しく解説
ここからは、それぞれのステップについてもう少し詳しくご紹介していきます。
ステップ1：本で体系的な基礎知識を身につける
まずは、気に入った本を1冊マスターして、基礎知識を習得します。
本はサンプル付きのもの（本を読み進めながら、実際に手を動かして学べる）がおすすめです。
▼ステップ１のポイント
ここでのポイントは、覚えようとするのではなく概観をつかむことです。
最初は本の通り進めて、コーディングがどんなものなのか、その感覚をつかんでゆきましょう！
ちなみに
なぜ本から入るのが良いのかというと、基礎の基礎から実践まで情報が網羅的にまとまっていて、抜けもれなく体系的な知識が得られるからです。
（それから、月額1000円の動画講座やオンライン授業を半年受けるとかより、2000円そこそこのよくまとまった本を1冊マスターする方が圧倒的にお得です）
▼最初の1冊におすすめの書籍
独学ということでなければ、基礎事項が網羅されている動画や、オンライン授業もアリだと思います。
予算のある方や独学ではくじけてしまいそうな方、本が苦手な場合などは試してみるのも良いかもしれません。
▼確実にマスターしたい方におすすめ
プログラミングのオンラインスクールCodeCamp
ステップ2：模写コーディングで実践力を身につける
ステップ１で、コーディングの概要や基本的な文法を習得したら、今度は実践力を磨くステージに進みます。
おすすめの方法は、模写コーディング。
模写コーディングとは、既存のサイトのデザインを見ながら、それそっくりに自分でコーディングしてゆく作業を言います。
▼ステップ２のポイント
ここでの目標は、個別のデザインに対応できる実践力を高めることです。
模写コーディングをすることで、デザインを見てコーディングを行うという、実際のお仕事と同じかたちを経験しておくというのもポイントです。
どうしてもわからない場合は、既存のサイトに答えがあるので、逐一学びながら実践力を磨きます。
ステップ3：ゼロからコーディングして応用力を身につける
模写コーディングがスムーズにできるくらいになってきたら、最後はお手本（既存のサイト）無しでコーディングをしながら、応用力を磨きます。
これまで学んできたことを、どこでどう使うか適切な判断をしながら、よりきれいなコード（正しい文法・繰り返しが少ない・わかりやすい etc.）の組み方を意識します。
自分の思い描いた通りに、あるいはデザインだけを見ながらコーディングをする、というのが主な方法。
クライアントから変更があった際を想定して、一度組んだソースをいじったりするのも効果的です。
▼ステップ３のポイント
ここでの目標は、クライアントの要望に応えられるようになること。
ポイントは、わからないことがあっても大丈夫だということ。
わからなかったり、忘れたりしたことは、調べながらコーディングを進めます。
すべて覚えてはいなくても、調べながら最適な方法でコードが組めるかどうかが大切です。
ソースをちょいちょいといじって更新をクリックすれば、画面が思いえがいていた通りに変わる。
この嬉しさを分かち合いましょう。
まずはお気に入りの1冊を見つけよう
以上、未経験から独学で効率良くコーディングをマスターするための勉強方法でした。
もちろんやり方はいろいろあると思いますので、流れを押さえつつご自分に最適な方法にアレンジしてみてください。
まずは、お気に入りの1冊を見つけるところから。
はじめの一歩、応援しています。
▼最初の1冊におすすめの書籍
Amazonで詳細を見る
Amazonで詳細を見る
Amazonで詳細を見る
これを読んだ人におすすめの記事
▼今からWebデザインを学ぼうと思ったら？私が最初に読んだ本
【厳選】Webデザイン初心者が独学で勉強するのにおすすめの本6選
コメント