今回は前回記事「【初心者向け】完全未経験者が3ヶ月でエンジニアになる方法 前編」のつづきのお話です。
目次
今回の記事で話すこと
- 簡単なもので良いから自分の作りたいものを考えて実際に作ってみる
- 「うまく動かない」→「調べて解決」→「うまく動かない」→「調べて解決」… を繰り返して、調べる力(問題解決能力)を身につける
- 3ヶ月のなかの各学習フェーズ(Webの場合)
作りたいものを実際に作ってみる
30~40%理解したら作りたいものを考えて作り始める
前回の「基礎を学習する」で勉強した知識を使って実際に作りたいものを作り始めます。
このとき30~40%くらいなんとなく理解してるかなと思ってるくらいで見切り発車して大丈夫です。
むしろ学習サイトのチュートリアルや、本を最後までやってから作り始めようとすると最初の頃に学んだことを忘れてしまい、忘れたところを勉強するの繰り返しになり中々作り始めることが出来ません。
英会話を例にしましょう。
英語の基礎学習とは英単語と基本5文系(文法)の勉強になります。
ほとんどの人は中学・高校と6年間英語を学んできました。しかし周りで英語をペラペラ話せる人はそこまで多くはないのかなと思います。
（「How are you?」「I’m fine thank you. And you?」は完璧かと思いますw）
リーディングとライティングはなんとなく出来るけどスピーキングは苦手というのは、
基礎学習はやってきたけど英語で話すという実践をあまりやってこなかったからです。
プログラミングも英語と同じように「言語」であるので、実際に使わないとスラスラと使えるようになりません。
日本語でも辞書や広辞苑に載っている言葉を全て頭の中に入っていなくても、問題なく日常会話は出来ますよね？
また、知らない単語が出てきたとしても辞書やGoogleを使って言葉の意味を都度調べれば良いだけです。
- コードを書く = コンピューターと日常会話をする
- 英会話は実際に普段から話さないと出来ないのと同じように、プログラムも普段から書く必要がある
トライ&エラーを繰り返して1つずつ出来ることを増やす
学習特に目的も持たずに勉強してもゴールがないため達成感がなく挫折しがちです。
そのために作りたいのを決めることで目標が定まり、その目標を実現するためにどんなことをやる必要があるのか小さなステップに落とし込むことが出来ます。
一例を上げると下記の通りになります。
- Webページのイメージをラフな絵でノートに書き出す
- HTMLでおみくじ筒とボタンをWebページ上に配置する
- CSSを使ってWebページをノートに書き出したラフ絵に近づける
- ボタンを押したらでおみくじ筒が振るアニメーションを行う（JavaScript、CSS）
- おみくじ筒を振り終わったら結果を出す(JavaScript)
このように小さなステップに分けたらあとはそれを実行するだけです。
現在どこまで進んでいるのかも把握出来るのと、1つずつステップを達成することで小さな成功体験から喜びを感じ挫折する確率をぐっと下げることが出来ます。
小さなステップに分けた中でも基礎学習ではやってこなかったことも当然出てきます。
上記の例の中だと④の「ボタンを押したらでおみくじ筒が振るアニメーションを行う」は基礎学習で出てこないと思います。
実際の開発ではこういうことはよくあり、ここで重要なのは検索能力になります。
この検索能力もプログラミングと同様に場数を増やすことで向上していきます。
今回の場合アニメーション方法を検索したので以下のように検索することになりそうです。
- 「アニメーション Web 方法」
- 「JavaScript アニメーション やり方」
- 「CSS アニメーション 実装」
実際に上記内容で検索すると色々アニメーションの実装方法に関する記事が見つかるかと思います。
検索で見つかったページを参考にして、
「これで実現できるかも」→「思ったのと違った」→「これはどうだろうか」→「今回はこれで行こう」
のプロセスを何度も繰り返して1つずつ知識が蓄えられていき出来ることが増えていきます。
「学習サイトのチュートリアルをこなす」、「本を最初から最後までこなす」だけではこのスキルは身につきません。
そしてこの検索能力こそが実際にプログラミングをする上でとても重要になってきます。
- 目標（作りたいもの）を決めて、目標を実現するために作業を小さなステップに分ける
- わからないことが出てきたら、うまく言葉を組み合わせて目的の記事を見つけ出す(検索能力)
- 検索能力もプログラミングをする上で重要なスキルとなる
- トライ&エラーを繰り返すことで知識が積み重なり出来ることが増えていく
3ヶ月のなかの各学習フェーズ(Webの場合)
1ヶ月目の内容
- 1週目: HTML、CSSの概要を理解する
- 2~3週目: JavaScriptの基礎を学習する
- 4週目: JavaScriptでHTMLの内容を変更できるようになる
フロントエンド技術を身につけるための勉強をします。
実際に作りたいものを作れるようになるために最低限の知識をこの1ヶ月で身につけます。
HTML、CSSは以下のポイント下記のとおりです。
- HTMLタグにはどんなものがあるのかざっくり把握する(div, a, imgなど)
- HTMLタグの中に書くid、 classでどんなことが出来るか理解する(CSSとの連携)
- CSSでどんなことが出来るか理解する(ヘッダーやメニューなどの配置や色・サイズの変更など)
- Webページでよく見るレイアウト（ヘッダー、メニュー、メインコンテンツ、サイドバー）をHTMLとCSSを使って実際に作ってみる(以下の画像)
JavaScriptの場合は以下のようになります。
- 以下の「最初に覚える基礎文法」を学習する
- JavaScriptを使ってHTML、CSSと連携する方法を学習する
- 実際にHTMLとJavaScriptを連携してみる（ボタンをクリックしたら背景色を変えるなど）
- 変数
- 型(数値、文字列など)
- 関数
- 条件分岐
- ループ処理
2ヶ月目の内容
- 1~2週目: 作りたいものを考えて、実際に作る(1つ目)
- 3~4週目:作りたいものを考えて、実際に作る(2つ目)
1ヶ月目で学習した知識を使って実際にWebアプリケーションを作ります。
先程の例でもあげた「おみくじアプリ」などは比較的かんたんに作りやすいので、まずはここから作り始めると良いでしょう。
その際はさきほどのまとめた小さなステップが役に立つかと思います。
- Webページのイメージをラフな絵でノートに書き出す
- HTMLでおみくじ筒とボタンをWebページ上に配置する
- CSSを使ってWebページをノートに書き出したラフ絵に近づける
- ボタンを押したらでおみくじ筒が振るアニメーションを行う（JavaScript、CSS）
- おみくじ筒を振り終わったら結果を出す(JavaScript)
わからないところは検索しながら対応していき、検索能力の向上もしていく段階です。
上記の例では1~2週目に1つ、3~4週目に1つとありますが、
1週間で1つ作れてしまったら3個、4個と作ってしまって全く構わないです。
数をこなした分だけWebサービスを作る力が身につきますし、検索能力も断然付きます。
3ヶ月目の内容
- 1~2週目: Webフレームワークを学ぶ
- 3週目: データベースを学ぶ
- 4週目: 掲示板サイトを作ってみる
3ヶ月目は1~2ヶ月目と比べると一気に難易度が上がりますが、JavaScriptにもだいぶ慣れてきているので十分乗り越えるだけの力は既に持っています。
1~2週目の「Webフレームワークを学ぶ」とありますが、これはもちろんサーバーサイド側のプログラミング言語を知っている前提になります。
Webフレームワークという言葉を初めて聞いた方のために説明しますと、
Webサービスというのはどのサービスも以下のような機能を兼ね備えています。
- ユーザーの新規作成
- データ投稿（ブログ記事、Twitter、Facebookの投稿など）
- ユーザーのリクエストに応じて対応するデータを返す
これらの機能をまとめたものをWebフレームワークといいます。
みんなが使いたい機能をそれぞれが作るのは非効率ですし、みんな共通のものを利用したほうが、
なにか問題に直面したときも、それは既に別の誰かが解決していることが多いのでインターネットで探せば解決しやすいのです。
サーバーサイドの言語で有名なところはPHPやRubyがありますが、今ではJavaScriptもサーバーサイド言語として一般的になってきました。
余談ですが、ぼく自身フリーランスの受託案件としてサーバーサイドをJavaScriptを使っています。
ここで言いたいのはJavaScriptを覚えればフロントエンドもバックエンドも開発が出来るようになる。
つまりフルスタックエンジニアになれるということです。
JavaScriptで有名なフレームワークだと「Express」というものがあります。
おそらくこのWebフレームワークを学ぶ段階で壁にぶち当たることが一気に増えることでしょう。
今まで身につけたJavaScriptの知識だけでなく、メンターに質問するなども駆使することで乗り越えられます。
もちろんぼくに質問してもらうでも全然OKです！
「お問い合わせ」より質問してもらえたらと思います^^
3週目には「データベース」を学び、データベースでどんなことが出来るのか理解します。
データベースは主に「MySQL」というものを学べば良いと思います。
ここまで培ってきた検索能力とメンターを活用して最低限の機能は1週間で十分覚えられます。
- MySQLの使い方
- データの保存方法
- データの検索方法
- データの更新方法
- データの削除方法
そして最後の週にWebフレームワーク・データベース・1~2ヶ月目で学んだフロントエンドの知識をフル動員して、
「投稿」・「閲覧」・「編集」・「削除」ができるシンプルな簡易掲示板を作ってみましょう。
Webページの見た目はこだわらなくて良くて、あくまでもここではWebフレームワーク・データベースを使ったWebアプリケーションを作れるようになることが目的です。
簡易掲示板が作れるようになったら基本的なWebサービスを一人で作れるようになったことになります。
- 1ヶ月目はフロントエンドの基礎を学習する
- 2ヶ月目はフロントエンド知識だけで出来る簡単なWebアプリケーションを作る
- 3ヶ月目はバックエンドの基本を学習して簡単な掲示板サービスを作ってみる
まとめ
前回記事「【初心者向け】完全未経験者が3ヶ月でエンジニアになる方法 前編」に引き続き、今回の後編ではWebサービスが作れるようになるまでの学習方法を話していきました。
目標を作り、それを小さなステップに分解して1つずつ解決していくことでエンジニアスキルが身につくことがわかったかなと思います。
もう少し具体的に知りたい場合は、コメント欄にコメントしていただくか「LINE」よりご連絡をいただけたらと思います。
LINE登録で無料特典を受け取る
次のような方向けに、学習をサポートするコンテンツを無料プレゼントしています。
- Webエンジニアになりたいけど何から学習を始めれば良いかわからない
- 今まで独学で頑張ってきたけど、独学に限界を感じてきた
- プログラミングは出来るけど、大きめのコードが書けない
「プレゼント詳細が知りたい」「プレゼントを受け取りたい」といった方は、以下のボタンをクリックして詳細ページをご確認ください。
