どうも、サムライくんです。
本日はプログラミング初心者が必ずやるべき
最強の勉強法写経の効果をぐっとアップさせる学習方法をご紹介します！
今回の記事は、
プログラミング初心者で少しでも効率的にスキルアップしたい方
こんな方にピッタリの記事です。
そもそもなんで写経がオススメなの？と気になる方はオススメ理由をまとめた記事もあるのでそちらも是非確認を！
学習手順
効果的な学習方法をご紹介する前に、写経を始める手順を1つ1つご紹介します。
写経するサイトを選ぶ
まずは、なんと言ってもこれです。
下記写したいサイトを決めない限り先に進めないので当然ですが笑
このサイトを決めるときに、まずはデザインがシンプルなサイトにするのがおすすめです。
あまり凝ったサイトだといくら写経とはいえ躓く回数が増えて
もどかしい思いする方もいると思うので2-3サイト写経するまではシンプルなのを選びましょう。
僕の場合は、
色んなデザインの大きさが一緒であったり、
色がシンプルであったりとかホントに簡単そうだな〜というイメージで選んでます。
コードを見ながら書き写しながらこまめに動作確認
写経したいサイトが見つかったら次はコードの書き写しに入りましょう！
まずはサイトのコードを開いてそれを上から順番に書き写していきます。
全部コードを書ききってから、動作確認！ではなく
こまめに動作確認することをおすすめします。
どのくらいの頻度で動作確認するかというと学習初期の場合は
HTMLなら<div>タグごと、
CSSならプロパティごとに動作確認するのがいいと思います。
一気に書いて動作確認だと間違えた箇所がどこなのか見つけるのに苦労します。
最初は少し書いたら動作確認と牛歩で構わないのでゆっくり確実に進めましょう！
間違っている箇所を答え見ながら修正
手順2で書きながら動作確認しましょう。とお伝えしましたが
それに紐付いて間違っている箇所見つけたらその都度修正しましょう。
写経していると、パソコンの画面と数十分にらめっこしているけど
どこが間違っているかわからない・・・ってときが必ずきます。
上手くいかない動作が複数あるときは、まず修正したい動作1つ決めます。
そのあとに
答えをコピペ →
正しい動作を確認 →
少しずつコードを削除して直したい動作に関係する部分を見つける。
この手順に沿っていけば時間はかかりますが、間違っている部分が正確にわかるのでおすすめです。
効果を高める学習法
ここまで写経の手順をお伝えしましたが、ここからはその写経の効果的なやり方をご紹介します。
サイトを眺めて共通の部分を探す
いきなりコード書き始めようとしている
あなた！ちょっとまった！！！
いきなりコード書く前にまずはそのサイトをじっくり眺めましょう。
ですがただ眺めていてもだめです。
サイトの中で共通している部分を見つけましょう。
・文字のフォントが共通している部分
・文字の色が共通している部分
・画像やブロックの幅が同じ部分
・余白が同じ部分
などなど、サイトには少なからず共通している部分が存在します。
その共通している部分をまずは見つけましょう。
まずは、ここまででOK
こっから先更に学習効果を高めたい人は、
その共通部分に対してどういったclassやidをつけているのか一旦自分で想像してみましょう。
それから写経に入ると、自分の考え方とプロの考え方の差を実感できるので
「なるほどな〜」と勉強になるタイミングが格段に増えます
サイトを眺めて頭の中でブロック分けをする
眺めながらもう1つ考えて頂きたいことがあります。
それは、このサイトをブロック分けするとどう分けられるかを想像してください。
サイトには、<header><main><footer>などいくつかのブロックに分かれてます。
イメージとしては、
動物のどっからどこが頭で、胴体で、下半身なのか。
もっというと、胴体でもどこまでが胸でどこがお腹なのか想像するイメージです。
このイメージの癖をつけていると
実際にサイト作り始めるときにどっから作ろうかな〜とか悩まず作ることできるので
作業効率が大幅にUPします！
書いているコードの意味を想像しながら書き写す
最後がこれです。
書き写しながら、「書いているコードの意味を想像する」これです。
もうホントこれ超大事。
特に、学習初期はHTMLで知らないタグやCSSでは知らないプロパティが山程出てきます。それを右から左へ書き写すだけでも有意義ですが、そのタグやプロパティがどんな動作をするか想像しながら書くと学習スピードがめちゃくちゃ早くなります。
自分の考えと実際の動作を答え合わせしながら書くイメージです。
これって実は数学とかの勉強法に似てるんです。
数学って問題が解けるかどうか=解き方（考え方）がわかるかどうかで決まりますよね？
プログラミングもそれと一緒です。
その動作をさせるコードが分かるかどうか。これにつきます。
この知識を丸暗記するのもありっちゃありですが、
実際に自分で想像しながら都度答え合わせしていくほうが頭に残りやすいですし
正しい動作も見た状態で頭に残るので自分のスキルになりやすいです。
以上が効果が格段にアップする写経方法なので是非真似てみてください！
