AppGram 
こんにちは、ヒロケイと申します。
今回はプログラミング完全未経験の大学生が、Web開発を学んで月10万円稼ぐまでの流れを解説していきます。
こんなことで悩んでいる方も多いのではないでしょうか？
- プログラミングを勉強したいけど、実際に何から始めれば良いかわからない
- バイト以外で稼ぎたいけど、収入0のステップをとにかく最短で抜け出したい
実際に私もそうでした。。。
- 勉強してるけど、全然稼ぐイメージが湧かない
- 収入が無いから安心できない
- とにかく早く稼ぎたい
私もずっと悩んでいました💦
不安ですよね。
今回は自分の経験を踏まえて、勉強する際に余計なものを削ぎ落とした最短でミニマムな学習フローをまとめました。
この記事を読めば、エンジニアとして働いて月10万円稼ぐための学習の流れがわかります。
実際に勉強に入る前に、プログラミング学習のために必要な準備についてみていきましょう。
- パソコンと教材費(5000円程度)
- 毎日の勉強時間の確保
- 学習サイトへの登録
一つずつ見ていきましょう。
必要な物
学習にあたって必要なものは以下の通りです。
- パソコン
- 教材費(5000円程度)
パソコンを新しく購入する場合、目安として10万円~15万円のPCを用意しておくことをおすすめします。
特に、メモリが16GB以上のPCを買うようにしてください。
なぜなら
- サーバーを動かしたり複数のウィンドウを起動して開発するため、同時進行が苦にならないスペックが必要
- 実際に採用されて稼ぐとなった場合、自分のPCで開発する場合がある
会社によっては貸与されたPCを使う場所もあります。
自分のPCを使うとなった場合、スペックが問題で仕事ができないなんて状況に遭遇しないためにもスペックは良く選んでから買うことをお勧めします！
やっぱり初期投資は必要なんだな。。。
実際に稼げたらパソコン代は3,4ヶ月で回収できるから、モチベーション維持のためにもちゃんとしたPCを用意しておきたいね！
時間
勉強時間として、一日最低3時間は確保しておきたいです。
まとまっていなくても良いです
- 朝起きたら1時間
- 帰ってきたら1時間
- 寝る前に1時間
バイトや大学の勉強、部活などで忙しいでしょうから、ぶっ続けで3時間を確保するのは厳しいでしょう。
休日にまとめて勉強時間をとるのも良いと思います！
ちなみに私は朝方だったので、5:00~7:00、17:00~18:00に平日休日関係なく勉強していました。
学習サイトへの登録
次に、学習サイトの登録を済ませておきましょう！
今回の勉強では下記二つのサービスを利用していきます。
- Progate
- Udemy
それぞれアカウントを登録しておきましょう。(どちらも登録自体は無料です)
あれ！これ中級とか上級やろうすると課金しなきゃ行けないんだ！
無料でできるのは一部だけなんだね。。。
Progateの利用には月額1078円のサブスクリプションに登録しておく必要があります。
用意した5000円を使って登録を済ませておきましょう。
この学習フローでは無理なく1ヶ月間で終了する予定ですので、基礎学習期間が終了したら忘れずに解約しておきましょうね！
次にUdemyについて、やっておくべきことがあります。
この学習フローでは、
この二つの講座を購入する必要があるのですが。。。
たっけぇぇぇぇぇ！！！30000円もするのかよ！！
講座のページを見てもらうとわかりますが、非常に高額で予算5000円で到底収まる金額ではありません。
しかし、実はUdemyでは月に2,3度セールを開催しているんです。
どのくらい安くなると思いますか？
何と90%OFFで買える時があるのです！
そのタイミングが来るまで待ち、講座を買っておきましょう！
基本的にUdemyの講座は一度買ってしまえば、ずっと受講し続けられるから早くい買っても大丈夫だよ(^^)
さぁ、プログラミング学習への第一歩を踏み出しましょう！
学習サイト「Progate」を使い、まずはコードに触れていくことから始めましょう。
この期間では、HTML, CSSとJavaScriptの講座を受講していきます。
それぞれが何なのかを簡単にいうと
- HTML: Webページの見た目を構成
- CSS: 構成したHTMLに装飾を付ける
- JS: HTML, CSSで構成したページに動きを付与する(ボタンをクリックしたら他のページに移動するなど)
詳しくはProgateにて詳しく学べるので、是非やってみましょう。
この基礎学習期間を終了すると
- Webページがどのように構成されているかを理解
- 見本や設計書を元に自分でWebページを作る
このようなことができるようになります。
1~2週目: HTML, CSS
最初の２週間は、HTML, CSSを学習していきます。
この2週間をこなすと、HTML, CSSでできること、記述方法を理解し、設計書や見本を見て静的なwebページを作成できるようになっているようになっています。
- 具体的にどんな内容を学習するのか分からないよ！
- どのくらいの量があるの？
このように思う方も多いですよね。
2週間のうちに無理のないような学習プランを組んでおきましたので、こちらを参考にして自分の学習ペースを掴んでいきましょう！
月, 火: 初級
水, 木: 中級
金, 土: 初級-道場
日: 中級-道場
1日の勉強時間: 2~3時間
月, 火: 上級
水, 木: 上級-道場
金, 土: Flexbox編
1日の勉強時間: 2~3時間
3~4週目: JavaScript
HTML, CSSが終わったら、次にプログラミング言語JavaScriptを学習していきましょう！
この2週間をこなすと、JSでできること、記述方法を理解し、自分で思った通りのプログラムを組めるようになっているようになっています。
おすすめの学習プランは以下の通りです。
月, 火: Ⅰ (基礎文法)
水, 木: Ⅱ (基礎文法)
金, 土: Ⅲ (関数の書き方)
日: Ⅳ: (クラスの書き方)
1日の勉強時間: 約3時間
月, 火: Ⅵ (パッケージの使用方法)
水, 木: Ⅶ (コールバック関数の役割と書き方)
1日の勉強時間: 約3時間
全て暗記する必要はない。「大体どんなことができるかわかった。調べながらなら実際にコーディングできるよ」程度の理解度でオッケー！
とりあえず手を動かして見ながらどんどん進んでいこうな。
Webページの構成方法とJSの記述方法がわかったところで、次の段階として開発の勉強をしていきましょう。
あれ？HTML, CSS, JavaScript勉強したからもう実践するんじゃないの？
プログラミングやコーディング言語の書き方の部分のみを学習してきたよ。
次は
- コードを実行する環境
- データの操作を伴った「機能」の実装 …etc
もう少し技術の全体的な理解が必要なんだ。
次は、Webアプリ開発の方法について学んでいきましょう。
この開発学習期間を乗り越えると、以下のようなことができるようになります。
- Webサーバーを構築できるようになる
- データベースの操作を伴ったWebアプリを作成できるようになる
- TwitterやYoutubeなどのサービスがどのような仕組みで動いているかが分かる
この期間では、準備の段階で紹介した「Udemy」を使っていきます。
事前準備でお伝えした2つのコースを購入している必要があるので、注意してください！
1~50日: Node.js講座を受講
まずは、Node.jsを用いたWeb開発について学んでいきましょう。
Web開発には大きく分けると2つの知識が必要です。
- フロントエンド: ユーザーが見える部分 (JavaScript, HTML, CSS)
- バックエンド: データのやり取りなど、目には見えない部分 (Node.jsなど)
これら2つについての知識が必要になるのですが、フロントエンドについては基礎学習期間で習得済みです。
次にバックエンドについての学習をしていくのですが、そこで使われるのがNode.jsです。
動画の総時間: 約45時間
期間: 50日間
一日約1時間分の動画を学習すれば、順調
この講座は英語の講座になります。
話していることを理解するためやコードを書いたりするために動画を止めることもありますので、実際には動画の３倍ほど時間がかかります。
わざわざ英語のこの講座をお勧めする理由としては
- 手を動かして物を作りながら学べるので、身に付く早さが段違い
- 英語が聞き取りやすいし難しい表現も使ってないので、高校英語をかじっている程度でも理解できる
- 他では扱っていないような内容も教えてくれる (痒いところに手が届いている)
実際私もこの講座を受講しましたが、普通に日本語講座や技術書と比べても分かりやすさはピカイチでした。
長編講座ですが、それだけ時間をかけるほどの価値があります。
また、もし英語がわからなくても5割程度理解しているだけで大丈夫です。
実は英語を内容濃く理解するよりも、とりあえず手を動かすことが大事なんです(^^)
英語の授業を受けるなんて面倒くさいよ。。。
最初のうちは抵抗もあるかもしれないし、理解できない文とかもあると思う。
そんな時は「シャドーイング」をすると良いよ！
口が動くから、眠くもならなくておすすめだ(^^)
また今のうちに英語に慣れておくと、後々仕事で英語のサイトとか見るようになるから楽になる。
51~60日: Git講座を受講
Node.jsの受講が終わったら、次にGitの使い方をマスターしておきましょう。
Gitとは自分の書いたソースコードを管理するためのツールで、RPGでいうところのセーブデータと似ています。
書いたソースコードをセーブするかのように保存し、特定のセーブ段階に戻ることができるようになります。
詳しくはGitの講座にて学んでみましょう！
Gitは実際の開発現場で絶対に使うと言っても過言ではないほど重要な物です。
動画の総時間: 約6時間
期間: 5日間
一日約1.2時間分の動画を学習すれば、順調
この講座は日本語になりますので、動画時間の1.5倍ほどで勉強できます。
内容自体もあまり難しくないので、楽に理解できると思いますよ(^^)
よっしゃー！やっと勉強終わった！
なんだかもう何でもできる気がしてきた！！
良いね！その意気だ(^^)
次は学習した内容を実践していこう！
さぁ、次はいよいよ自分でアプリを開発していきましょう。
何故わざわざ自分で１から開発する必要があるの？
この期間で個人でアプリを開発する意味意味としては
- 採用する側の人にやる気をアピールするため
- 全期間で学習した内容をおさらい
- 自分で作ったという経験が開発する力を爆速で成長させる
この期間で作成したアプリを作成することで、次段階の採用面接で大きなアピールポイントになります。
「何も作ってないけど、やる気はあります！」という人と、「やる気があって、自分でこんなアプリを作ってみました！」という人。あなたならどちらを採用したいと思いますか？
おそらく後者の方だと思います。口だけではなく行動でやる気を示せていますからね！
また、学習していた時期では情報をインプットするだけでした。
今までの学習内容を思い出しながら自分で開発をすることによってアウトプットができます。
開発する中で
- エラーを解決する
- 自分で考えた機能を実際にプログラミングする
- コードをわかりやすくするための工夫を凝らす
- 学習した内容と自分のやりたいことを照らし合わせて開発に落とし込む
こういった事を経験します。
その経験が結果的に自分の力となり、実際に稼ぐとなった時の糧になっていきます。
どうやって作っていく？
やばい、やることが多すぎて何から手をつければ良いのか分からないよ。。。
大丈夫！初めてのことだから難しいよね💦
手順を追っていけば問題ないよ！
まず、何を作ろうかが問題になってきます。
基本的に「自分が生活の中で欲しい！」と思った物を作ることを心がけてください。
何故かというと、面接の時に物語を作ることができるからです。
例えば「仕事や勉強でやるべきことが定まらずモチベーションが続かないので、タスク管理アプリを作ってみました。実際に使ってみたところ、日々のタスクを細分化できるようになり、効率が上がりました。」
ストーリーを語ることで、採用担当者に「こいつはエンジニアとしてのポテンシャルがあるな」とアピールすることができるのです。
次に、開発の手順を紹介していきましょう。
- ページのデザインを簡単にスケッチする
- どんなデータを扱うべきか、サーバーにはどんな処理が必要かを書き出す
- デザインを元にフロントエンドを構築してみる (見た目のみを作成する)
- 必要な処理を元にバックエンドを構築
- データベースと連携してデータを保存できるようにする
実際に学習をしてくると、開発の流れは自分で考えられるようになってきます。
その際、開発講座で習ったSpace X Projectを参考にしながら作っていくようにしましょう。
また、開発したソースコードはGitを使って、Githubに投稿しておきましょう！
ちなみに私はこの段階で「WordMixer」というアイデア作成アプリを作ってみました！
昨日はSpace Xとあんまり変わらなかったですね。
ぜひ参考にしてみてください。
さぁ、個人でアプリ作成を成し遂げたあなたはもう見習いエンジニアとしての可能性があります！
次はいよいよ稼ぐための準備をしていきましょう！
未経験応募可能なエンジニアインターンの求人に片っ端から応募していくようにします。
バイトの求人を見る感覚と似ていますね。
今の僕みたいな人が求人を探すには、どうやって探せば良いの？
基本的には求人サイトを使って探していくよ！
とは言っても普通のバイトとはちょっと違うから、エンジニア系の求人を扱ってるサイトで探していくことになるな
エンジニア系の求人を多く取り扱っているサイトを紹介します。
全て登録は無料なので、とりあえず登録はしておいて損はないと思います(^^)
うわ！いろんな求人があるけど、どんな奴に応募していけば良いのだ？
基本は学習した技術を扱っている会社に応募していくと良いよ！
見たこともない技術を扱っている企業は業務に付いていけない可能性があるからね。
学習や開発で使用した技術を取り扱っている企業へ応募することを意識しましょう。
この学習期間で得た技術で言えば、
- HTML
- CSS
- JavaScript
- Node.js
特にNode.jsを扱っている企業はバックエンドの開発にも携われる可能性がありますので、お勧めです。
最近は採用率が低くて厳しくなってきている
エンジニアインターンの採用率は10%前後と言われています。
とても厳しいですね。
また、最近では新型コロナウィルスの感染拡大を受け、企業の業績が芳しくないことによる採用の渋りが生じてきています。
今この状況でわざわざ未経験のエンジニアを採用して育てようと考える企業はそう多くはないのが現実としてあります。
なので、行けそうな企業は片っ端から全て応募し、応募する企業の数を増やすことを意識しましょう。
「この企業にしかいきたくないから、その他は応募しない！」というスタンスで行くと、不採用になった時に落胆してしまったり安心できなくなってしまうので、あまりお勧めはしません！w
採用率を高めるためにおすすめな技術
Node.jsを扱っている求人を一通り探したけど、これだけじゃ応募できる企業数が限られてきちゃうな。。。
Node.jsだけを扱ってる会社だと確かに少ないよね！
そんな時は応募できる企業数を増やしていく必要があるよ。
応募できる企業を増やすための方法は、「新しい技術を習得する」に尽きます。
Node.jsについての理解がすでにあるので、基本の習得にはそれほど時間は要しません。
習得しておきたいおすすめの技術は以下の通りです。
- React (最もおすすめ)
- TypeScript
- Next.js
- PostgreSQL(ORマッパー含め)
- GraphQL
なぜこれらの技術をおすすめするかというと、扱っている企業が多いからです。
特にReactは、Node.js講座で少し扱うので学習しやすいため最優先で習得しておきたいですね。
私はこれらの技術を使って「LittleComp」というアプリを作成しました。
応募できる企業が多くなり、採用率も3倍ほどに上がりました！
大学生が見習いエンジニアとして働くメリットはたくさんあります。
- 大学生のうちに実務を経験するので、就活で有利になる
- 自分が習得した力がお金に変わる経験ができるので、自信につながる
- 同じ志や経験を持つ仲間ができる
- バイトよりも高待遇、高時給な環境で働くことができる …etc
学習に相当な時間と気力を費やす必要がありますが、それだけ得られる経験も価値があります。
実際に私がインターンとして採用されるまでの体験談をまとめているので、こちらをご覧いただくと勉強のモチベーションや将来のイメージにつながるかと思いますので、読んでみてください。
