以前Ruby on Railsを3ヶ月学んだ。(正確には2ヶ月目くらいでなんとなく嫌になってきた。)
AppのViewをやっているときは見えるから面白いと思ったが、コントローラーやモデルの話になると、なんとなくわかったようなわからないような、正直眠たいような気分だった。
さらにはコマンドがそもそも理解できておらず、Unixコマンドを覚える必要もとのアドバイスを受ける。余計に興味度合いがあがらない。
簡単な日記アプリ(どうやら超初心者が最初に作るのに最低限のスキルを合わせて使えるので適切とのこと)も作ってみたところで、学習を終了することにした。
もうプログラミングを学ぶのはやめようかと思ったが、画面には興味があったので、その後はかろうじてHTMLとCSSに切り替えて学習を継続。プログラミングとは言えないけど、まあいいか、興味あることをやってみる。
今にも挫けそうだった私だが、あっという間の3ヶ月、とても楽しく学び、結果、10ページくらいのホームページの画面は1日くらいでざっくり作れるようになった。もちろん基礎レベルではあるが。
新しいことを学習するとき、今は本当にいろんな選択肢がある。
ひとつの選択肢として、私がやったHTML, CSSの学習プロセスを綴っておこうと思う。
目次
- 1. Bootstrapの中のExamplesをまずは徹底的に真似して作る
- 2. 当然つまずく。なぜそうなるか?を”プロ”に聞く
- 3. Bootstrapだけではできない内容を理解し始める
- 4. 問題を自己解決できる方法を学ぶ
- 5. なんども繰り返す
- 最後に。
1. Bootstrapの中のExamplesをまずは徹底的に真似して作る
BootstrapとはもともとTwitter社が開発したCSSのフレームワーク。要は見た目の良い画面を作るためのCSSを理解していなくても、テンプレートがたくさんあるのでそれをコピーして使えるというもの。
私はExampleの上から順番にやっていきました。ここで使われているコンポーネントは何かな?と考えて、それをBootstrapのなかであるかを探して、コピーしてみる、の繰り返し。
コードの意味わからなくても良いんです。ひたすらコピー。Example10個くらい、まずはひたすらやってみる。
2. 当然つまずく。なぜそうなるか?を”プロ”に聞く
これ大事。ここまで10個やってきているので(もちろん完成していない)、聞きたいことが山盛りある。
とても親切なエンジニアの友達がいればまとめて聞いちゃえると思いますが、もしいなければ(遠慮するなら)、わからないことを解決してくれるマンツーマンのインストラクターを単発で雇ってみる。
クラウドワークスとかで依頼出したら、少し高めの設定にすれば、レベルの高い人はすぐに見つかる。誰を選ぶかはある程度提案をみて、カンを働かす。
ここで大事なのは、いくら聞くことが初歩的なことであれ、ちょっとできるくらいの人ではなく、その分野に精通している人を選ぶことである。なので、私はプロと呼ぶ。「私はまだまだなので。この程度のこと聞くのに申し訳ない。」と遠慮する必要はない。
私がつまづいてた多くは、そもそも「閉じタグがないです」「classが理解できてないです」「もうちょっと綺麗に書く習慣つけたほうが自分でもチェックしやすいですよ」「全部Bootstrapでコピーするのは限界あります。」
さすがプロにまとめて教えてもらえると、自分で調べるより圧倒的に効率良い。メモメモ。
3. Bootstrapだけではできない内容を理解し始める
背景色の素敵な色、どうやって変えるのか?幅キュってするにはContainer以外になにすれば良い?画像入れたいんですけど、幅変えたいんですけど、なども聞いてみた。
ようやく、なるほどBootstrapコピーではできないこと、自分でCSS書かないといけないことの差分が見えてきた。
学習は差分が明確になるほど、学ぶことが具体的になり、吸収率が上がると思っている。ここに来てはじめて、HTMLの基礎、CSSの基礎、なるものを読もうという気になった。
参考にググって2−3記事だけ読んでみた。marginやpadding、flexやgridの使い方がよりわかるようになった。
4. 問題を自己解決できる方法を学ぶ
なんでも1から手ほどきを受けようとすると、無駄が多い。
その道に詳しい人も、お金を払ってもらっているならまだしも、ボランティアで全部教えようとする人はいない。もしくは嫌がられる。
この段階になると、問題そのものをプロに聞き、答えを得るのは卒業して、もし今の問題を私が一人で解決しようとしたら、どうしたら良いですか?と聞く。
検証ツールの使い方、それでもわからない時は、サーチするキーワードの試しかた、など問題そのものではなく、そのプロセスに目を向けて学習する。
そう、自己解決できること=再現性が高まる、なので、とても大事。
5. なんども繰り返す
わかった気になって終わらない。全部もう一度一人でやってみる。
可能であれば、実務であったり、何か人に渡すものであったり、自分の中だけで完結しないアウトプットが求められるものが、強制力があって良い。
そうすると、聞いた気になっていても、やっているうちにだいたい数個の穴が出てくる。教えてもらって自分でできた気になっていたが、本来の理解ができていなかった部分である。
そこで誰かに聞くのも一案だが、その場合私は自分で調べてみる。
調べてみてたどり着かなかったポイントがあれば、ここまで行ったが、この先が行けなかった、というところをプロに聞く。
ここまでやっておくと、一通りの型が、再現性ある形で自分の中に入る実感ができた。
最後に
これは私のやり方であって、”荒治療”的。人によっては合わないこともあると思う。
もちろん、スクールなどに通って、もしくは独学で本を読んで、いちから体系的に学ぶことを一切否定しない。
また、HTMLやCSSのように画面で見えるからこそできるやり方だとも思う。
ただ、自分で限界までやる+プロの力を借りる、のセットは、実務力をあげたい、一人でできる自信が欲しい、という人には、試してみても良い最短の学習法ではないかと思う。
コメント