こんにちは、BЯuno(@bbbbruno69)です。
自分は今フリーランスのWeb制作でなんとかやっていけています。
そして、フリーランス１ヶ月目で月収２０万を達成しました。（具体的には２３万です）
自分は３ヶ月ぐらい独学で学習したのちに、こんぐらい稼げるようになりました。
そこで今回は、「どのように学習計画を立てたか」「具体的に何を学習したのか」を紹介していこうと思います！
みなさんもこんぐらいやれば、月収２０万は余裕ですよ！！
また自分で作ったロードマップも公開しますので、そちらも参考にしてみてください！
ではいってみよう！
動機
２０１８年の１０月、僕は大学にも行かずバイトもせず、暇を持て余してました。（既に中退すると決めていました）
バイトを始める気にもならなかったので、何か稼げてかつブログのネタにもできるようなことを漠然と探していました。
そんな時、ノマドエンジニアを養成する講座「iSara」の存在を知りました。
iSaraについて詳しくは下からどうぞ↓
『これだ！』と思い、ちょうど４期生の募集が始まるタイミングだったのですぐに応募しました。
しかし、結果は落選。（20人の枠に1000人とか応募するらしいので通るのは至難の技だということを後になって知りました・・・）
落選後は、しばらく自分が行きたかったiSara４期参加者のTwitterをずっと眺めていました。そして、自分と同世代なのにわずか１ヶ月で月に２０万とかを稼いでいる人がいることを知って衝撃を受けました。
衝撃を受けると同時にめちゃくちゃ悔しかったです。
行きたかった講座で同世代の人がめちゃくちゃ短期間で稼いでいる。iSaraに参加できていれば、自分もそうなれていたかもしれない。
そして心に決めました。
『自分と同世代の人ができるのなら自分にできないはずがない。iSaraに参加しなくても自力で稼げるようになってやる。』
ここから自分のフリーランスとしての生活が始まりました。
情報収集
稼ぐと決めた後、早速情報収集に取り掛かりました。
なるべく無駄なく効率的な学習がしたかったので、稼ぐためには何が必要か、どうすればいいか？を調べまくりました。
幸いネット上には積極的に情報発信してくださっている方がたくさんいらっしゃるので、有益な情報をたくさん手に入れることができました。
特に参考にした記事は下記の３つです。
- https://showtaki.com/first-work-skills/
- https://j-info1.com/progate-2
- https://yukinishimura.net/web-shortest-earn/
これらを元にプランを練っていきました。
学習する順序を決める、ロードマップを作る
iSara生のブログ記事やツイートをかたっぱしから調べ終えた後は、学習順序を決めて自分なりのロードマップを作りました。
順序は当初はHTML&CSS&Bootstrap→Webデザイン&javascript&jQuery&Photoshop→PHP&Wordpressでした。（もちろんこの順序通りにはいきませんでした笑）
また、ロードアップも作りました。このロードマップには参考サイトや学習方法、順序、使用する教材などをすべてまとめました。
自分が作ったロードマップを公開しておきます。すべてこの通りにはいっていませんが、少しでも参考になれば幸いです。
※少しだけ注意なのですが、Progateは本格的に学習を始める数ヶ月前に一度やり終えていました。ですので、ロードマップではProgateはすっ飛ばしています。このロードマップを参考する方は、ProgateのHTML&CSSを全てやってからやったほうがスムーズにいくと思います。
期間を決めて実行
最後に期間を決めました。期限なしでやっていてはだらけると思ったので、１ヶ月単位で分けました。
約２ヶ月半ぐらいで全ての学習を終わらせ、３ヶ月目からは営業に入っていくという感じで計画を立てました。
HTML・CSS・JavaScript・jQuery（12月中旬〜）
HTML＆CSS３きちんと入門 【HTML&CSS入門】
まずは基礎知識を満遍なく学ぶため、こちらの本から取り掛かりました。
この本では、ブラウザでHTMLファイルが表示される仕組みから、相対パスと相対ルートパスの違い、画像の保存形式であるpngとjpgの違い、よく使われるCSSプロパティの詳細な説明、ボックスという概念の詳細な説明（インラインとボックスの違い、パディングとボーダーとマージンの関係など）、テーブルとフォームの詳細な説明などなど、多くのこと幅広く学べてとても良かったです。
特に、
- ボックスに関する知識が一通りまとまっている
- フレックスボックスの説明がある
- 最後にフレックスボックスを使ったレスポンシブなサイトが一つ出来上がる
上記の点がとても良かったです。実際の案件で自分はフレックスボックスを多用しているので、この本でそれを実践的に学べたのは大きかったです。（フレックスボックスはめちゃくちゃ便利です。フロートなんて使いません。というか絶対使いたくない）
Progate javascipt E6 1~3 【Javascript】
みんな大好きProgateです。新しいの言語の学ぶことにおいてこのサイト以上に簡単なものはないでしょう！みんなおすすめだよ(^^)
サイトの作り方はわかったので、次は動きの付け方です。最初からjQueryにいくのは後から困るかもと思ったので、まずjavascriptから入りました。
これでjavascriptの基本の文法を押さえました。
javascript 書籍
基本がわかったら実践です！
この本でjavascriptだけで簡単な動きをつけられるようになりました。（自動再生のスライダーなど）
とてもわかりやすかったです。
progate jQuery 全部【jQuery】
いよいよjQueryです。
javascriptを学んだ後だと、いかにjQueryでの記述が楽か実感しました。正直javascriptの知識があんまりなくともjQueryだけで大抵のものは作れます・・。（実際、案件ではjavascriptはほとんど使っていません）
これで動きはある程度OKになりました！
ドットインストール「Bootstrap入門」『あまり意味なかった』【Bootstrap基礎】
Bootstrapも学びましたが、正直使い道がよくわかりませんでした・・。
サクッとサイトを作りたい時には便利なんでしょうが、デザインからサイトを丁寧に細かくコーディングしていく時にはBootstrapを使ってしまうといろいろと制限がかかり、邪魔でしょうがありません。
学びましたけど、今でも全然使ってないです。
書籍モダンコーディング【HTML&CSS発展】
この本では、それぞれレイアウトが異なるサイトを実際に一から作ります！
- スタンダードレイアウト
- グリッドレイアウト
- シングルページレイアウト
上記３つが作れます！特にシングルページレイアウトはよくでます！
この本のおかげで大分サイトづくりの経験値がたまりました。サイトを見るだけで頭の中でどうコーディングすればいいかのイメージが湧くようになりました。
Sass・Bootstrap・css設計・サイト模写（1月）
Progate Sass【Sass】
ここからはコーディング速度を上げるための効率化についてです！
そして、やはりみんな大好きProgateからです笑。いやあ、ほんと便利っすね、このサイト。
Sassは絶対やったほうがいいとネットで調べるとでててきたので、Sassの文法を学びました。
ネスト記法とミックスイン、変数が使える点は超便利だと思いました。個人的にはSassを学ぶのはマストです。
Sassの教科書
Sassの書き方は分かったけど、自分のPCのローカル環境への導入の仕方がわかんない！！
ということで、このSassの教科書で自分のPCでSassを使える環境にしました。
GulpというツールでSassを使えるようにするのですが、このツールでできることがたくさん載っていて大変役に立ちました。
YoutubeのBootstrap【Boootstrap応用】
なんでこのタイミングこれをやったかは忘れました。確か、どこかのブログで紹介されていたからだと思います。
Bootstrapはあんまし使えないと思ってたのに・・。まあ、でもサイトづくりの経験値は溜まりました。
あ、あとこれ英語です。ただ、英語わからなくても画面見てればだいたい何してるかわかるので、やりたい人はどうぞ。
UdemyのBootstrap
Learn Bootstrap 4 By Creating An Advanced Bootstrap Theme
上のYoutubeの人と同じ人が販売してるUdemyの講座です。
なんで買ったんだっけなぁ・・・？忘れました笑笑
ただこの講座はすごく良かったです！Bootstrapはどうでもいいんですけど、作るサイトにめちゃくちゃいろんな動きがついているんですよ！！
ですので、jQueryのいろんなプラグインに詳しくなれました！『この動きはこのプラグイン、あの動きはこのプラグインでできるのか』ということがわかりました！！
買った価値はありました。
吉田式BEM記法を学んだ【CSS設計】
このサイトでCSS設計というものについて学びました。
クラス名とかでいちいち迷うのは時間の無駄なので、あらかじめルール作ってそれに従ってクラス名をつけちゃおう！ということですね。
後、Sassファイルの分け方や画像の命名の仕方なども載ってます。
実案件では特に指定がないかぎりこのやり方でいつもやってます。
オススメです！
サイト模写二つ pas-pol.jp&isara.life 【サイト模写】
もう大分サイトづくりには慣れてなので、何も見ずに０から模写してみよう！ということで、上記２サイトをやりました。
pas-polの方は忘れましたが、isaraの方は確か一日中ずっとやって、レスポンシブも込みで５日ぐらいかかったと思います。めちゃんこ大変でした。
ただ、これで０からでもコーディングできるという自信がつきました！
はにわまんの有料Noteでデザインカンプからのコーディング
実案件ではデザインデータ（photoshopやillustrator、XD）などから値を読み取ってコーディングしていきます。その練習として、この有料Noteを買ってやりました。
自分がコーディングしたものと、はにわまんさんの完成版のデザインがどうしてもあわずイラついた覚えがあります。（原因はline-heightでした。XDの値をそのまま読み取っていくとどんどんズレていくので注意してください。）
１日やっても解決しなかったので、結果練習どうこうではなく、ただただイライラして途中で終了しました笑笑
WordPress・Webデザイン（2月）
Progate PHP 1,2【PHP基礎】
またまたProgateだね！本当にProgateは初心者向きで最高のサイトで、なぜかというとそれは初心者でも挫折せず取り組め（以下略）
PHPの基礎です！文法を学んだら次！！
WordPressレッスンブック【Wordpress基礎】
WordPressを学び始める際にこの本以上に簡単な本はないですね。
最初にコードをバッて示して、そのあとに解説がすごく丁寧に書いてあります。これなら絶対挫折しないなと思いました。
ただ、個人的には内容量は物足りなかったです・・。WordPressの基礎はわかりましたが、実戦でこれだけの知識で色々な要望に応えれるかとなると微妙だなと思いました。
WordPressデザイン教科書
この本は最高でした！！！！
WordPressについてグッと理解が深まり、これで実案件でも大丈夫だという自信がつきました！！
- テンプレート階層
- カスタム投稿
- カスタムフィールド
- メインループ、サブループ
上記の４つは自分がWordPressにおいて最も大切だと考えている４つの知識なのですが、これらがこの書籍でしっかり学べました。
繰り返しになりますが、この本は本当に良かったです。プログラミング自信あるぞ！って方はあれは一つ上の本を飛ばして、この本から入ってもいいと思います。
そのぐらい超絶オススメです。
Udemy webデザイン二つ（挫折）【Webデザイン】
未経験からプロのWebデザイナーになる！ 400レッスン以上の完全マスターコース
Webデザイナーのキャリアを未経験からスタートするためのオールインワン講座
Webデザインについてもやろうとしましたが、挫折しました・・。
上記二つでデザインツールの使い方は分かりましたが、なんというか、Webデザインはあんまり自分で練習できないなと感じました。
実際に誰かから欲しいサイトのイメージを聞いて、それを元に作る、という経験がたくさん必要だと感じました。
そして、それはすごく時間がかかりそうだったのでやめました。（もう学習はたくさんしたので、早く稼ぎ始めたかったです・・）
ポートフォリオサイト(3月)
Udemy portfolio 【ポートフォリオサイト作り】
Make a Responsive Portfolio Website: JavaScript and HTML
最後にポートフォリサイトを作って、これを武器に営業しこうと考えて上記の動画講座をやりました。
スキルを数え上げる動きなんかはのちに作るポートフォリオサイトに導入させていただきました。
下記URLで確認したい方はどうぞ。
iSara参加、課題をこなす
3月から営業するつもりだったのですが、isaraに受かっちゃったので不可能になりました笑！
３月はずっとisaraの課題をやっていました。合計で１０サイトぐらいは作ったと思います。
下記のURLで作ったものが載ってます。ほとんどはisaraの課題で作ったやつです。確認したい人はどうぞ。
これでもうサイト作りに関しては完璧になりました笑笑。ですので、発案件を取るときも「できるかどうか」の心配はあんまりなかったですね。
ちなみにisara5期で最速で全ての課題を終わらせました。こんだけやってきたんだから当然ですね！自慢しておきます（生意気）
営業開始、クラウドソーシングで提案しまくる
４月のバンコク滞在中、とにかく初案件を取ることだけにフォーカスしました！
周りがどんどん取れていく中、自分だけ取れなくて萎えていましたが、４月終盤になってようやく取れました！！
しかも、１３万！！取れた時はとても嬉しかったです☺️
その後も案件は継続的に案件は取れていきました。この方法についてはまた別記事で書こうと思います。
こんぐらいやれば誰でも月収２０万は達成できる！！！
今回伝えたかったのこれです。
自分はこんぐらいやって達成できました。
しかも、本当に誰でもできると思います。３ヶ月もガチでやれば、自分と同じ量ぐらいは学習できます。そこから（別記事で語りますが）営業しまくれば絶対達成できます。
ポイントはWordPressです。自分は発案件の時からWordPressができたので、すぐに達成できました。
WordPress案件というのは単価が高いんですね。平気で１案件２０万とかあります。
これを月に一個受けてやれば、それだけで月収２０万は達成ですよ？もっと取れば月収３０、４０と伸びていきますし。そんなに難しい話ではないです。
これから学習する人達はWordPressまで習得するということを頭に入れて、学習すれば後から楽ですよ！！
３ヶ月ガチでやればできるんで、是非頑張ってください！！
チャオ！
コメント