WEB制作で稼ぎたい人
未経験からWEB制作で月5万を稼ぐ方法を知りたいです。
未経験からWEB制作で月5万を稼ぎたいです。最近プログラミングに興味を持ち始め、手に職をつけたいと考えています。とはいえ、プログラミングに触ったことのない僕にもできるかとても不安です。将来的にリモートで稼げるスキルを身につけて、ノマド生活を送りたいです。
こんなお悩みを解決します。
✔︎WEB制作のロードマップ
- 1.準備：WEB制作に必要なモノ
- 2.基礎：WEB制作スキルの習得
- 3.応用：ポートフォリオの作成
- 4.営業：WEB制作会社への営業方法
- 5.納品：WEB制作で月5万を稼ぐ方法
- 6.番外：WEB制作の未来とは?
- 7.移住：海外移住×リモートで人生をチート化する方法
この記事を書いている僕は、未経験から独学でWEB制作スキル習得し、月30万ほど稼ぎました。ノマドエンジニア歴2年の僕が解説します。
本記事では、「コレからプログラミング学習を始めたいけど、何をどう勉強すればいいか分からない」という方に向けて、学習手順や案件獲得方法、スキル習得後の働き方などを網羅的に解説します。
この記事を読むことで、「学習の方法手順〜営業・案件獲得〜その後の未来設計」までをマルっとイメージできるようになります。
一人でも多くの方に「自走力」を身につけてもらいたい...と思って、完全独学なロードマップを作成しました。
自由人生プランという「コンパス」を持って
航海の「旅」に出発しましょう。
0円スクールという近道
独学でスキル習得って、けっこうシンドいですよね?僕もバグでつまづいてマジで大変でした。そんな手間を省きたい方は、テックアカデミー無料体験
をオススメします。メンターサポートも豊富でして、挫折しにくいかと。独学でつまずきそうなら、スクールを利用するのも選択肢としてアリですよ。それに、、、案件保証もついてます。というと、実質タダ。ゼロ円でスキルゲットできるチャンスです。 >> はじめての副業コース
1.準備：WEB制作に必要なモノ
必要なモノは、PCだけ。
やる気なんて、必要ありません。
- その①：MacBook：なんかカッコイいから
- その②：VSCode：コードを書くのに必須
- その③：参考書籍：ぶっちゃけ、必要ない
ぶっちゃけ、PC以外にも必要なモノはありますが、PCを持ってないと話が進みませんので...軽くてカッコいい"Macbook"なら、スタバでドヤ顔できますよ...シンプルにマウス不要で使いやすいです。
その①：MacBook
【裏ワザあり】WEB制作に必要なモノはMacだけ【やる気は不要】
その②：VSCode
【WEB制作】VSCodeに入れるプラグインは8個だけ【初心者向け】
その③：WEB制作に役立つ参考書籍
【初心者】WEB制作にオススメな参考書籍など存在しない
フリーランスを目指すための精神論
会社員からフリーランスになる方法←フリーランスに会え
必要な学習期間の目安
【未経験】WEB制作に必要な学習期間は3ヶ月ほど【稼ぐまで6ヶ月かかった件】
2.基礎：WEB制作スキルの習得
やるべきことは、下記のとおり。
- その①：学習サイトで基礎を学ぶ
- その②：動画で基礎を学ぶ
- その③：ブログで基礎〜応用を学ぶ
- その④：フレームワーク（Bootstrap）
- その⑤：デベロッパーツールの使い方
大切なのは、頭より「手」を動かすこと。
本から学ぶと、手が動きません。
その①：学習サイトで基礎を学ぶ
【独学】プログラミング学習サイトは、Progate一択だった件【フロントエンドエンジニア向け】
その②：動画で基礎を学ぶ
プログラミングを動画で学ぶなら、ドットインストールが最適【動画学習のメリット・デメリット】
その③：ブログで基礎〜応用を学ぶ
【必読】WEB制作初心者にガチで役立つブログ3選【並行して、ブログで発信しよう】
その④：フレームワーク（Bootstrap）
WEB制作でBootstrapを学ぶ価値とは?【通勤排除の未来】
その⑤：デベロッパーツールの使い方
GoogleChromeの検証機能。
WEB制作やデザインでは、必須ツールです。
具体的には、下記ができます。
- デザインの変更テスト
- ウェブサイトのコードチェック
- レスポンシブの表示チェック
なんぞや?ワケワカメ...って感じだと思いますが、勉強過程で慣れてきます。
学習や開発に必須ツールですので
ぜひ使い方をマスターしときましょう。
>> 参考 | 初心者向け!Chromeの検証機能（デベロッパーツール）の使い方 | サルワカ
成長の早い質問方法
【無料テンプレ】伸びるエンジニアが実践する質問の仕方とは?
3.応用：ポートフォリオの作成
ポートフォリオとは、「自分の作品集」のこと。
下記が、スキル証明となります。
- その①：ノーコードでPFを作ろう
- その②：模写コーディングでPFを作ろう
- その③：オリジナルPFを作ろう
- その④：WordPressでLPサイトを自作しよう
上記が、あなたのポートフォリオとなります。
営業するときに必須です。
えっ?スキルなんて呼べるほどのスキルがないって?
今まで基礎を学んできたじゃないですか?
インプットしたら即アウトプットしましょうよ。
その①：ノーコードでPFを作ろう
【名刺不要】ポートフォリオに最適なCarrdの使い方【ノーコードでOK】
その②：模写コーディングでPFを作ろう
【悲報】模写コーディングは意味ありません【ヒント：デザインカンプ】
その③：オリジナルPFを作ろう
【簡単】WEB制作で案件受注できるポートフォリオの作り方【採用心理の裏側】
その④：WordPressでLPサイトを自作しよう
【簡単】MAMPのインストール方法を図解付きでわかりやすく解説【中学生でOK】
【初心者】WordPressでLPサイトを自作する方法と手順【まずは、WEB制作で月5万を稼ごう】
4.営業：WEB制作会社への営業方法
営業方法は、下記のとおり。
- その①：クラウドソーシング←オススメしない
- その②：WEB制作会社へ鬼の100本ノック←オススメ
- その③：見積もりの発行
その①：クラウドソーシング
その②：WEB制作会社へ鬼の100本ノック
【フリーランス】WEB制作会社から案件受注する営業方法【勇気が出る記事】
【フリーランス】WEB制作で案件受注率を爆上げする企業向け営業メールの書き方【営業未経験でも安心】
その③：見積もりの発行
【無料配布】WEB制作フリーランスで案件受注できる見積書の作り方【テンプレあり】
5.納品：WEB制作で月5万を稼ぐ方法
案件を受注できたら
あとはコーディングして納品するだけ。
請求書の発行
【無料配布】WEB制作で納品後に行う請求書の作り方【テンプレあり】
6.番外：WEB制作の未来とは?
- その①：コードを書かない「NOCODE」とは?
- その②：付加価値を高める方法
- その③：WEB制作への道を極める
その①：コードを書かない『NOCODE』とは?
その②：付加価値を高める方法
ブログ
【相性抜群】ブログ×WEBデザインでスキル発信しつつ稼ぐ方法
【無料】サルでもできる!?WordPressブログの始め方【たった10分で人生が変わった】
SEO対策
その③：WEB制作への道を極める
無料オンラインで学べるおすすめプログラミングスクール3社【比較/現役エンジニアが保証】
