プログラミング学習ロードマップ【3ヶ月で月5万は可能です】

こんにちは！かずさです。
まずは読んでくださりありがとうございます😊
今回、こんな方に向けてこのnoteを書きました。

・プログラミングを勉強しようと思っているけど、どうやって勉強すればいいの？いったいどこから手をつければいいんだろう？
・まだプログラミングの右も左もわかんないけど、なる早で稼げるようになりたいなぁ。
・基礎は理解したけどなかなか稼げないな…

こういったお悩みを今回解決します。
（ちなみにこれらは全て3ヶ月前の僕の悩みですw）

本noteのテーマ
【 3ヶ月で月5万稼ぐに特化したプログラミング学習ロードマップ 】

世の中に溢れているただの「プログラミング学習のロードマップ」ではありません。”稼ぎ方”をガッツリ盛り込んだものに仕上げました。
なぜ稼ぎ方に重きを置いたかというと、”稼げないとすぐ辞めちゃうから”です。ここは綺麗ごと抜きでいきましょう。正直、稼げないとしんどくないですか？恐らく納得していただけたはずです。
少なくとも僕は稼げないとすぐ挫折しますw それに加えて、僕の知り合いでプログラミングを辞めてしまった人は全員収益が0円です。厳しいですが、これが現実です。

その人たちの共通点は、「コードは書けるけど、稼ぎ方を理解していない」ということです。もちろん頭では分かっているのでしょうが、稼ぎ方の重要性をちゃんと理解して実際に行動している人はいなかったと思います。もちろん、最初は誰でも収益0円ですが、このしんどい時期はなるべく短くしたいですよね。なので「3ヶ月で月5万稼ぐ」ことをテーマにこのnoteを書きました。実際に僕が3ヶ月で月5万円稼げるようになったので、信頼性もあります。

プログラミングはやってるうちにどんどん楽しくなるし、何よりかっこいいじゃないですかw いつもスタバでコードを書いてる人を見て、「チクショー。俺も早くああなりてぇぇ」って思ってましたw 今は少しだけドヤ顔できます🙈
理由は人それぞれですが、プログラミングに1ミリでも興味があるから今このnoteを読んでくださっていのだと思います。なので一緒にスキルを磨いてどんどん稼いでいきましょう！

もう一度だけこのnoteを読んで欲しいと思っている方をまとめました。

・これからプログラミングを勉強しようと思っている人
・1人で稼げるスキルをつけたい人（もちろん場所と時間に縛られない）
・すでにプログラミングの基礎は理解しているけど稼ぎ方がわからない人
（おまけ　スタバでドヤ顔したーいって人もw）

準備OKですね？早速参りましょう！

※プログラミングというとシステムやアプリの開発を思い浮かべる方も多いと思いますが、それらのほとんどは複数人での仕事になり、かつ僕の専門外ということで今回はそこの内容は割愛させていただきます。
比較的早く1人で稼げるようになる「Web制作」について紹介していくので、そこだけご了承ください。

⚪︎稼ぐ5STEP（挫折の原因がわかります）

当たり前ですが、コードを書くだけでは稼ぐことができません。稼げない人はコードが書けるだけで終わってしまいます。なので、まずはお金が発生する流れを見ていきましょう。

1. 提案する
2. 受注が決まる
3. コードを書く
4. 納品する
5. お金が入る
（納品前にお金が入る場合もあります）

「何当たり前のこと言ってんだコイツ」と思ったかも知れませんが、稼げない人は基本的にこの流れを忘れています。ほとんどの人が「コードを書く」ことだけを考えていて、その前にある「仕事をとる」ための行動をしません。仕事を取れないと当然収益は0です。ここはプログラミングの挫折の原因の1番大きな部分です。
なので、学習手順だけでなく、「最初に仕事を取らないと収益0」ということをしっかりと押さえましょう。

⚪︎学習手順の3STEP

次に学習手順を見ていきましょう。僕も含めて、大体の人が遠回りをしてきました。せっかくこのnoteを読んでくださっているあなたには、絶対に遠回りはしてほしくないです。なのでここからガッツリ手順を説明していきます！

⓪目標設定
まずはっきりとした目標を決めましょう。さきほど挫折の原因のほとんどは「稼げない」ことだと言いましたが、目標がないのも挫折の大きな原因です。
なぜかというと、はっきりとした目標がないといつまで経っても目標を達成できているかわからないからです。例えば「かっこいいサイトを作る」というフワフワした目標だと、どんな基準でかっこいいのかがわかりません。なので目標を達成できているのかが曖昧になり、飽きて挫折してしまいます。
なので、目標は必ず数字を使って期限も明確に決めましょう。例えば、「3ヶ月後に月5万稼ぐ」というのは収入や期限を数字で示しているのでわかりやすく、挫折しづらい目標です。その他にも、「Appleのサイト1ページを3ヶ月後までに作る」みたいな目標でもいいと思います。
とにかく大事なのは

・数字を入れる
・自分がワクワクする

この2つです。「月5万稼げるようになったら生活に余裕ができる！」「Appleのサイト作れたら最高にカッコいい！」こんな感じで自分がワクワクする具体的な目標をまず決めましょう。もちろん、人によって目標は違います。

①環境準備
PCはMacBookがおすすめですが、Web制作ではスペックやOSは特に気にしないで大丈夫です。
あとは「環境構築がむずかしくて挫折した」という話をよく聞きますが、Web制作では無料のテキストエディタを1つダウンロードしたら終了なので、ここの心配はまったくいりません。テキストエディタは「コードが書けるメモアプリ」だとイメージしていただければOKです。おすすめはVScodeとAtomです。
どちらも有名で安全ですが、1番メジャーなのはMicrosoftが提供しているVisual Studio Code(vscode)です。僕はググったときに最初に出てきたのがAtomだったのでAtomを使っています。
正直どれを使っても大差はないので、とりあえずVScodeを使っておけば安パイです。
一応リンクを貼っておきます。

・Visual Studio Code：https://code.visualstudio.com/
・Atom：https://atom.io/

②言語選び
次に、勉強する知識（言語）を見ていきましょう。
3ヶ月で5万円稼げるようになるために必要なプログラミング言語は以下の3つです。
（正確に言うとプログラミング言語ではありませんが、本質的には同じなので気にしなくてOKです。）

⒈HTMLとCSS
HTML：全てのWebサイトの基本
CSS：HTMLで作っていったサイトの見た目を整える
ざっくり言うと、HTMLで文字やリンクを表示して、CSSで配置や文字色などの見た目をいじるイメージです。
※HTMLとCSSは、Webサービスなどを作る上でも必須の言語となるので、まずはここから勉強するのが鉄板です。

⒉jQuery
jQuery：Webサイトに動きをつける
例えばWebサイト上での写真のスライドショーなんかは大体このjQueryによって作られています。
「jQueryはオワコン」みたいなことがよく言われていますが、Web制作の現場ではまだまだ使われているので、そこの心配はいりません。
ガッツリ使えなくても大丈夫ですが、最低限のレベルでは使えるように勉強していきましょう。

⒊WordPress
WordPress：コードを書かずにサイトを作って運営するための仕組み
プログラミング初心者でもサイトを構築・運営できるので、ブログなどのよく更新されるサイトで使用されています。
「プログラミングなのにコードを書かないの？」と思われたかもしれません。しかし、元はPHPというプログラミング言語でできているので、デザインなどを変更する際にコードを書くことになります。加えて、全世界の30％のサイトはWordPressで作られているので、案件数も非常に多いです。PHPの知識も必要になりますが、PHPがさわれなくてもブログ開設などの案件を受けることができます。WordPressが使えるだけで自分の単価も大きく上がるので、必ず勉強しておきましょう。

「え、こんなにあるのかよ。やっぱり難しそうだからやめるか。」と思ったかも知れませんが、ぶっちゃけそこまで難しくはないです。
今は横文字が多くて困っているかもしれませんが、次に紹介する学習方法の通りにやっていけばこのレベルはすぐにできるようになるのでご安心ください。

③基礎学習
前のパートでは、最短で月5万稼げるようになるために必要な言語について見てきました。ここからは、その言語をどうやって学んでいくと効率がいいのか、確認していきましょう。

基礎学習でおすすめなのは以下の3つのサイトです。

⒈Progate
⒉ドットインストール
⒊Udemy

※書籍はおすすめできません。なぜなら、情報が古くなりがち・動きがなくわかりづらいからです。書籍よりも動画などで学ぶ方が圧倒的に効率もいいしお手頃です。
書籍は1冊3000円前後、Progateとドットインストールは基本無料です。

Progate（https://prog-8.com/）
スライドを見る→コードを書くという形式
すぐにアウトプットして知識を定着できる
基本無料（追加機能は月1000円ですが、それで受けられる恩恵は軽く10万円超えます。小学生でも払える額なので、ここは迷わず投資しましょう。）

Progateはとにかく入り口として最高の教材です。スライドでまず学んでいくのですが、それがとてもわかりやすい上にすぐにアウトプットできるので知識が定着しやすいです。

ただ、初心者向けなので、Progateでの勉強で実務レベルまでもっていくのは難しいです。Progateを使う注意点として、「Progateを何周もしてもあまり意味はない」ことを覚えておいてください。たくさんやってもいいのですが、Progateで実案件がこなせるようにはならないし、他のサイトで勉強をしたり実際に自分でサイトを作ったりする方が10倍くらい効率的です。また、Progateでたくさんの言語を少しづつつまんで勉強している人がよくいますが、これも実案件には繋がらず収益は0のままなのでやめておきましょう。

Web制作で稼ぐためには、ProgateをHTMLとCSS→jQueryの順番で一気に勉強するのが1番効率的です。
※理解度は30％でもいいのでどんどん先に進んでいきましょう。（その理由は後ほど）

⒉ドットインストール（https://dotinstall.com/）
1本3分〜5分程度の動画を見て学ぶ形式
手軽に勉強を始められる
基本無料（有料プランでしか見れない動画もありますが、基礎学習では無料で見れる範囲で十分です。）

Progateと同じ時期でも前でも後でもいいですが、ドットインストールでも勉強していきましょう。動画1本が短く手軽に勉強できるので、0から手軽に学習することができます。Progateと同じく、初心者向けのぶん、実務レベルまでもっていくのは難しいです。また、動画を見るだけでは知識が定着しないので、移動時間で動画を見つつ、家に帰って同じものを見ながら実際にコードを書くのがよいでしょう。めんどくさく感じるかもですが、これが1番効率的で挫折しづらく、稼ぎやすい方法です。

【 無料 】ドットインストールでは以下の動画を見て学習しましょう。

・はじめてのHTML：https://dotinstall.com/lessons/basic_html_v5
・はじめてのCSS：https://dotinstall.com/lessons/basic_css_v5
・はじめてのWordPress（無料部分だけでOKです）：https://dotinstall.com/lessons/basic_wordpress

こちらもProgateと同様、理解度は30％でOKです。どんどん先に進んでいきましょう。

⒊Udemy（https://www.udemy.com/）
ドットインストールと同じく1本3〜10分の動画を見て学ぶ形式
ドットインストールが月額制のサービスであるのに対して、Udemyは教材を1回買い切りで購入する仕組み

Progateやドットインストールよりも少し難易度が上がるので、Progateとドットインストールの次に勉強することをおすすめします。
こちらもドットインストールと同様に、動画を見るだけでは知識が定着しないので、必ずどこかでコードを書きましょう。動画を購入するとオフライン保存できるので、データ量が不安な方も心配いりません。

また、Udemyで購入できる動画は通常1万円〜3万円ほどで売られていますが、不定期にくるセールではそれが1000〜2000円で購入できます。
ガチで質が高くてコスパがいいので、Progateと同じく投資しない手はありません。実務レベルのスキルを身につけるためにはUdemyも必須です。

参考までに、Udemyで実際に僕が勉強した動画を紹介しておきます。この動画は受講生が満足度4.5超えの人気講座です。

[HTML/CSS/JavaScript] フロントエンドエンジニアになりたい人の Webプログラミング入門：https://www.udemy.com/course/html-css-js/

基礎学習のまとめ

⒈Progate
⒉ドットインストール
⒊Udemy

の3つのサービスを使って勉強していきましょう。どれも理解度は30％でいいのでどんどん進んだ方が良いです。なぜかというと、初めから80％、100％を目指すと膨大な時間がかかり飽きてしまうからです。まずは30％の理解度で進んで、残りの70％は実践しながら理解していけばOKです。僕も含めて多くのエンジニアは「同じものを何回も勉強して時間をむだにしちゃった」とよく語っています。

僕は初期のころProgateを3周も4周もしていました。しかし、それでも理解度は50％くらい。結局のちにポートフォリオサイトを作るとき、分からないところを大量にググりました。素直に時間の無駄でした。あとで同じところをもう1回調べてコードを書くと、「あ、こういう意味だったんだ。なんであのとき理解できなかったんだろ」ってことによくなりますw 僕の経験として、その時が1番深く理解できると思っています。なので初めは理解できていなくても全く問題ありません。むしろ最初から理解できていたら怖いですw 

今はなんのことを言ってるのかさっぱり分からなくても心配はいりません。あとでその知識が必要になったときにググればだいたい理解できます。
最初は雲の中を歩いているようで不安かもしれませんが、これが1番近道です。時間のムダはなるべく削って、まっすぐ進んでいきましょう。
僕は【 自分が通ってきた無駄な道をショートカットしてもらう 】ことを通じて、読者の方に貢献するためにこのnoteを書きました。無駄をなくしてしっかり努力すれば3ヶ月で月5万は普通にいけるので、ここは特に強調しておきます。

⚪︎実践

前のパートで基礎学習の手順を見てきました。ただ、基礎がわかるだけでは1円も稼げません。冒頭でお伝えした通り、稼げない原因は「仕事を取れない」ことです。
そして、仕事を取れない原因はだいたい決まっています。ここを押さえて行動することで、稼げる確立がグッと上がります。

1. 基礎だけをずっと勉強している
2. 営業をかけない
3. マインド

⒈基礎だけをずっと勉強している
どれも仕事を取れない（＝稼げない）大きな原因ですが、とりわけ基礎だけを勉強している人は本当に多いです。基礎がある程度わかったらすぐに実践する段階にうつりましょう。なぜかというと、基礎がわかるだけでは実案件はこなせないからです。例えるなら、野球でずっと素振りをしているようなものです。もちろん素振りは継続するべきですが、打てるようになるにはとにかくたくさんボールを打つしかありません。野球で例えるとわかりやすいですが、プログラミングでも素振り（基礎学習）だけをやっている人は本当に多いです。なので、勉強してきた知識を実践で使えるように練習していかなければいけません。プログラミングは本当に奥が深いので、100％理解するのはほぼ不可能です。なので、基礎は30％や半分くらいの理解でいいからまずはどんどん前に進みましょう。抜けている部分は実践しながら埋めていけば大丈夫です。
実践でまずやるべきなものとしては、模写とポートフォリオ制作が挙げられます。模写とは文字通り、世の中にあるサイトをそっくりそのまま作ることです。「模写なんかして意味あんのかよ」と思うかもしれませんが、本当に勉強になります。抜けていた知識を確認できる・実績として使える・デザインの勉強になる。これだけの理由があるので、模写を絶対やるべきだと思います。「実績として使える」というのは、自分のスキルを相手に知ってもらうために使えるという意味です。

「何も作ったことはありませんが、スキルはあります。」
「〇〇というスキルを持っていて、こちらが実際に私が作った作ったものになります。」

どちらの方が発注者から信頼されるかは一目瞭然です。ポートフォリオ制作もこれと同じで、自己紹介などをしつつ、「こういうサイトを作れます」というアピールにもなります。ポートフォリオとは簡単にいうと「自分をまとめた作品集」のことです。そんなに難しく考えなくても大丈夫です。
参考までに僕のポートフォリオサイトを貼っておきます。
https://ka16.github.io/portfolio/
ぶっちゃけ大したスキルではありませんが、これがあるだけで信頼が大きく増します。
とくにまだ案件を受注したことがない人は、必ず模写するかポートフォリオを作った方がいいです。それが信頼に繋がり、受注率が大幅にアップします。
模写の素材に関しては、「模写コーディング　素材」とググったり、クラウドソーシングというサービスにある実案件をもとにすると良いでしょう。

⒉営業をかけない
「稼ぐためには仕事を取る、仕事を取るためには営業をする」
これは当たり前のことですが、本当にやっていない人が多いです。営業といってもそんな大げさなものではありません。
今回はクラウドソーシングで提案することに絞って、テンプレと共に見ていきましょう。
※クラウドソーシングとは、仕事を発注する人と受注したい人が集まるWebサイト（サービス）のことです。クラウドソーシングは、プログラミングだけでなく動画編集やライティングなどの幅広い分野で利用されています。

提案分のテンプレート（一例です）

はじめまして。
名前（ふりがな）と申します。
東京都在住、〇〇歳です。
○○様と一緒にお仕事ができたらいいなと思い、今回提案させていただきます。現在わたしはWeb系フリーランスエンジニアとして活動しており、クラウドソーシングやTwitterからお仕事をいただいています。

●お役立ちできること
・発注していただいたお仕事を早く、正確にこなします。
・ほかの企業様やフリーランスと比べて低コストでお引き受けすることができます。
・当然、こまめな連絡やご要望にも対応いたします。

※まずは「自分に発注するメリット」を示しましょう。安請けは消耗するのであまりよくありませんが、案件を取って実績を重ねていく段階ではある程度必要かと思います。最初の受注が1番大変ですが、そこからは実績を積むごとに受注もしやすくなるので踏ん張りましょう。

●実績
・ポートフォリオサイト
https://ka16.github.io/portfolio/
・デザイナーさんのサイト（製作中）
デザインからコーティングまで

●スキル
・HTML ・CSS ・JavaScript ・jQuery ・WordPress・PHP(フォームを作れる程度）※発注者には「この人はスキルあるのかな？」という疑問が必ずあるので、この不安要素をなるべく取り除きましょう。そうすれば受注率が大幅にアップします。

●開発環境
Mac Atom

●稼働時間
7時～21時

ぜひよろしくお願い致します！

あくまで一例ですが、こんな感じで提案分を作っていくと受注率が上がります。
本質の部分で大事なのは、「相手のメリットを考える」ことです。「この人はスキルあるのかな？この人に頼んでも大丈夫そうかな？」発注者にはこういった不安が必ずあるので、自分に頼むメリット・スキルや実績などをしっかり提示していきましょう。
0から自分で作るのは難しいですが、コピペして修正していくことでよい提案文が仕上がります。
実際、このテンプレートもコピペして自分で少しだけ変えましたw すでにあるものは上手く使っていきましょう！

⒊マインド
最後にマインドのお話をします。ここも稼げない大きな原因の1つです。
身につけるべきマインドは以下の2つです。

・プログラミングはそこまで難しくない
・届けるのは価値（コードを書いて苦労すればいいわけではない）

まず「プログラミングはそこまで難しくない」ということについて。ここは多くの人が難しく考えすぎています。
「コンピューターが苦手で…」「数学が嫌いで晩年文系です」特に大人の方でこういった悩みを抱えている方が多いです。しかし、Web制作で稼ぐためなら超難しい知識はいらないし、文系も理系もほぼ関係ありません。言い訳しても何も変わらないので、とにかく前に進みましょう。サボって後悔した経験はいくらでもありますが、頑張って後悔した経験はただの一度もないと思います。

次に「届けるのは価値」ということについて。ここも勘違いしている人が多いです。とくに真面目な方に多い印象があります。
端的に言い換えると、「目の前の相手を120％満足させる」ということです。例えば、WordPressでサイトを作る案件があったとします。（今はなんのことかわからなくても大丈夫です。）WordPressはコードを書かなくてもサイトを作ることができるので、コードを書かないことに申し訳なさを感じてしまうことがあります。「お金もらってるんだし、コードは書かないとまずいよな。」みたいな思考です。いい人なのはわかりますが、大事なのはコードを書くことではありません。「目の前の相手に120％価値を届ける」ことが何よりも重要です。「相手は何を求めているのか」「相手の要望に1番応えられるのはどんな方法か」これを何よりも優先して考えましょう。それによって、コードを書くのか、WordPressを使うのか、それとも他のやり方なのか、おのずと見えてきます。

まとめ

ここまで読んでいただき本当にありがとうございます！
最後にざっとまとめに入ります。

⚪︎稼ぐ5STEP
①提案する
②受注が決まる
③コードを書く
④納品する
⑤お金が入る

⚪︎学習手順3STEP
⓪環境準備
おすすめのPCはMacbook、ソフトはVScodeとAtomです。
VScode
Atom
①目標設定
ワクワクする、かつ収益・期間などを数字で表して目標を立てましょう。
②言語選び
HTML・CSS・jQuery・WordPressを使えれば、月5万稼ぐためのスキルとしては十分です。
③基礎学習
Progate・ドットインストール→Udemyで学習するのが1番効率的です。

⚪︎実践
基礎を30％理解したらすぐに実践する・営業をどんどんかける・届けるのは"価値"であることを忘れない

これらを押さえてしっかりと努力すれば、3ヶ月で月5万稼げるようになります。時間で言うとざっと200時間くらい。1日2時間 × 90日（土日は5時間）やればこの時間に届きます。「そんな時間ないよ」と思ったかもしれませんが、通勤時間に1時間動画を見て家で1時間やるだけです。人によっては通勤時間だけで1日2時間確保できます。これくらいは最低限やりましょう。

月5万収入が増えたら嬉しくないですか？しかもやればやるほど収入が上がるので、1年後にはもっと稼げるようになってると思います。まずは3ヶ月、頑張ってみませんか？少なくとも僕は、プログラミングにコミットして良かったと確信しています。せっかくプログラミングに興味をもってこのnoteを読んでくださっているのですし、1歩踏み出していきましょう！

最後に

ここまで読んでいただき、本当にありがとうございました！素直に感謝です🙇‍♂️
今回、読者の方に【 自分が通ってきた無駄な道をショートカットしてもらう 】ためにこのnoteを書きました。
「まあ役に立ったな」と思っていただけたら幸いです！これをきっかけにプログラミングをやっている仲間ともっと繋がりたいとも思っています。仲間が多い方が楽しくて挫折しづらいですし！なのでぜひ仲良くしてくださいw

という感じで終わります。ささやかではありますが、このnoteの感想を僕のメンションつきでツイートしていただけると、RTさせていただきます。アウトプットとしてぜひ😌
Twitter ID：kazusa_16　リンク：twitter.com/kazusa_16
最後まで読んでくださり本当にありがとうございました😊 既読感覚でスキもぜひ押してください！