記事内にプロモーションリンクが含まれる場合があります。
- 「プログラミングで稼ぎたい!」
- 「フリーランスになって稼ぎたい!」
でも、その一方で
- 「何からはじめればいいの?」
- 「独学でも勉強できる?」
- 「無駄な勉強はしたくない!」
- 「どうすれば稼げるようになるの?」
と1歩を踏み出せないでいる人も多いと思います。
そんな初心者を応援したく、
フリーランスで稼げるようになるまでの最短ロードマップを作りました!

よこやま良平
こんにちは、18年以上プログラミングを行っているITエンジニアのよこやま良平です。
すでに法人化しており、会社の代表をしておりますが
現役ITエンジニアをしながら4歳から85歳まで年間1,792名以上の方へパソコンやプログラミング講座を行っております。
未経験からプログラミングだけで
生活できる様になった経験をしたからこそ
- 「効率よく学習する方法」
- 「稼ぐためには何をすればいいのか」
あなたのお役に立てると思います。
目次
副業やフリーランスで稼ぐプログラミングの勉強プラットフォームの種類
プログラミングの勉強は、独学でもできます!
ただ、何も考えず闇雲に勉強するのでは挫折する可能性の方が高いです。
プログラミングの勉強というと…
・プログラミングスクールに通う
・参考書を買って独学
の二択しかない時代もありましたが、
今は「オンラインで勉強や独学」が主流になってきています。
オンライン学習のメリットは
- スクールに通うよりも安いこと
- 隙間時間に自分のペースで学習できること
そして、オンラインで勉強するプラットフォームの種類は
- オンラインサービス…プロゲート・ドットインストールなど
- オンライン動画…チューターなど
- オンラインスクール…テックアカデミー・デイトラなど
この3つです。
オンラインサービスで勉強
オンラインサービスでの学習は、無料~低価格であるため
初心者が始めにプログラミングに触れるのに最適です。
- すきま時間を利用して無理なく気軽に学べる
- 自分のペースで学習でき、復習しやすい
という点も大きなメリットです。
オンラインサービスで勉強するなら…
- Progate(プロゲート)
- ドットインストール
この2つが初心者向けでおすすめです。
Progate(プロゲート)

Progate(プロゲート)の特長は…
- イラスト中心のスライドで学べる
- ブラウザ上で、コードを書いて結果も確認できる
- 準備不要で、すぐにプログラミングが実践できる
- 必要なレッスンを最適な順番で学ぶことができる
- 手軽に始められるアプリ版もある
無料プランは、プログラミングに触れ「基礎」を身につける18レッスン。
プラスプラン(月額・税込み…1,078円)は、
「応用」と「実践」で創る力を身につける84レッスンです。
ドットインストール

ドットインストールの特長は…
- すべてのレッスンが3分以内の動画
- 開発環境を整えるレッスンからスタートなので実践ですぐに活かせる
- スマートフォンからも視聴可能
- 豊富で幅広いレッスン(464レッスン・6943本の動画)
プレミアム会員は、月額費用1,080円(税込み)。
プレミアム動画や、ソースコードの閲覧ができるようになるほか、
レッスンでわからないところを先生に質問でき、より効率的に学習できます。
副業やフリーランスで稼ぐためのオンライン動画で勉強
動画学習の最大のメリットは、やはり「わかりやすさ」です。
- スクールに通うより安く、買い切りなのでコスパ的に◎
- 講師の操作方法を見ることができるのでわかりやすい
- 巻き戻して確認したり復習がしやすい
- 本当に必要な箇所だけ学べるので無駄がない
- 真似をするだけで、成果物が作成できるので達成感がある
動画での勉強の場合、見るだけでなく動画を真似しながら進めていくとより効果的‼
手を動かすことで自然とスキルが身につきますよ。
オンライン動画で勉強するなら…
初心者向けでおすすめです。
TUTOOOR(チューター)で学習する

TUTOOOR(チューター)の特長は…
- 講師として出品も、勉強の為に購入もできる動画講座
- 初心者向けに一つ一つの用語も丁寧に解説
- 質問無制限なので、購入後も安心して学べる
副業やフリーランスで稼ぐオンラインスクール動画講座で勉強
オンラインスクールは、オンラインサービスや
オンライン動画と比べるとかなり高額なので、ハードルが高め。
まずは無料体験を受けてから検討しましょう。
オンラインスクールで勉強するなら…
- WPHack講座
- TechAcademy(テックアカデミー)
- デイトラ
この3つが人気です。
WPHack講座で学習する

HTML・CSS・Bootstrap・WordPress・オリジナルテーマ作成・WEBサーバー公開など160以上の授業を学習できるようになっています。
- 追加料金不要の買い切り
- 15年以上のベテラン講師
- 圧倒的の低料金
など就職やスキルアップに成功させます。
オンラインスクールでデザイン学習する

Adobeオリジナル11講座+AdobeCreativeCloudのセットで講座を受けられます。
- PhotoshopCC
- IllustratorCC
- DreamWeaverCC
- InDesignCC
- AfterEffectCC
- XDCC
- PremiereProCC
- HTML5&CSS3
- FrescoCC
- DimensionCC
- AeroCC
AfterEffectCCとPremiereProCCがあればYouTubeやショート動画の編集ができる様になり、PhotoshopCCとIllustratorCCがあればサムネイルやアイキャッチの制作ができる様になります。
デイトラで学習する

デイトラの特長は…
- 目標別(副業で月5万・企業に転職など)に学習ステップを用意
- 全コースで講師(メンター)が学習を支援。学習後のキャリアもサポート
キャッチコピーは「1日1題90日でプロのWebスキルを手に入れよう」。
業界最安級のオンラインスクールです。
副業やフリーランスで稼ぐプログラミングの開発環境を用意する
開発環境とは、プログラミングをするために必要な環境(作業場所)のこと。
プログラミングを行う前に、用意(構築)しておく必要があります。
必要なソフトウェアや開発ツールがはじめから揃っている統合開発環境 (IDE)をインストールすることで、
簡単に開発環境を整えることができます。
統合開発環境 (IDE)にも、様々ありますが、代表的なものを紹介しておきます。
有料でも良いなら
- IntelliJ IDEA(インテリジェイ・アイデア)
- PhpStorm
- VSCode(Visual Studio Code)
がオススメです。
- アップデートが頻繁にある
- 追加のプラグインをほぼ必要としない
など、有料ならではのメリットも多いですよ。
IntelliJ IDEA

IntelliJ IDEA(インテリジェイ・アイデア)は、
JetBrainsが開発・販売しているJavaの統合開発環境(IDE)です。
Java用のIDEですが
・SQL
・JPQL
・HTML
・JavaScript
が使え、プラグインをインストールすることで、さらに
・PHP
・Ruby
・Python
・Go言語
・フレームワークサポート
が追加されます。
PhpStorm

IntelliJ IDEAと同様に、JetBrains社が開発しているPHP用の統合開発環境(IDE)です。
PHP用のIDEですが
・HTML
・CSS
・JavaScript
に関するWebStormの全機能が含まれているので、これらの言語にも対応しています。
30日間は無料で使用できるので、購入前に試してみてもいいですね。
Visual Studio Code

無料のエディタのオススメは、 Visual Studio Code です。
Visual Studio Codeは、Microsoft社が提供するコードエディタで、
VSCode(ブイエスコード)と略して呼ばれることが多いです。
単にエディタというだけではなく「プラグイン」という拡張機能が豊富に用意されています。
プラグインをインストールすれば、様々な機能を使うことができ、
無料とは思えないほど、効率的に作業ができるようになっています。
副業やフリーランスで稼ぐプログラミングの勉強方法
プログラミングといっても、プログラミング言語だけで何百と存在しています。
何を勉強すれば何ができるのか、初心者は何から勉強すればいいのか、さっぱりわからないですよね。
初心者が、プログラミングで稼ぐために勉強しておいた方がいいのは、それほど多くありません。
- HTML/CSS…webページのテキスト・デザインを決める言語
- JavaScript/jQuery…動的コンテンツ・機能を実装する言語
- Bootstrap…Webサイトを時短で制作できるCSSフレームワーク
- WordPress…CMSですが簡単に言うとホームページ作成ソフト
最初はこのくらいで充分ですし、完璧に覚えようとしなくて大丈夫です。
- 「こういうものなんだな…」
- 「こういう書き方をするんだな…」
と、なんとなく基礎的なものがわかれば、
その都度調べながらでもやっていけるので大丈夫です。
プログラミングの独学で挫折しないコツは、インプットよりアウトプット。
なんとなく基礎がわかったら、真似っこでいいので実際に手を動かし、
調べながらでいいので「出来た!」経験を積み重ねていきましょう。
HTML/CSSの勉強方法
HTML/CSSを勉強するならチューターがおすすめ。
プロゲートは、環境構築する必要がなく、
ブラウザ上でコードを書いてすぐに結果を確認できるからです。
環境構築は、初心者がつまずきやすいポイントなので
「ドットインストールの方が好みなんだけど…」という人も
- プロゲート(環境構築不要)
- ドットインストール(環境構築必要)
の順で勉強する方が挫折しにくいと思います。
HTML/CSSは、コーディングの必須スキルなので、
プロゲートの「HTML&CSSコース」で基本をおさえておきましょう。
JavaScript/jQueryの勉強方法
HTML/CSSと同様にチューターで学習しましょう。
JavaScript/jQueryが使えるようになると、
サイトに動き(アニメーションや効果)をつけられるようになります。
プロゲートのJavaScriptコースで
- 基本的な文法
- 変数・定数の使い方
- 条件分岐
- 繰り返し処理
- 関数の定義、呼び出し
までを勉強してみましょう。
jQueryコースは
- 基礎知識
- WEBページにjQueryを実装する
までを勉強してみましょう。
Bootstrapの勉強方法
Bootstrapは、Twitter社により開発されたCSSのフレームワークで、
レスポンシブデザイン対応のWebサイトを時短で作成できます。
なぜ、時短で作成できるかというと…
Bootstrapには、あらかじめよく使われるデザインが用意されていて、
コーディングの量を減らすことができる仕組みになっているからです。
HTML/CSSの基礎知識があれば、取り組みやすいので、
で勉強しておくと、今後Bootstrapの案件も受注できるようになりますよ。
副業やフリーランスで稼ぐために必要なサーバーを取得しておきましょう

サーバーとは、ネットワーク上にデータを保存しておく土地や倉庫のようなものです。
プログラミングをする上では必須なので、サーバーを取得しておきましょう!
初心者にオススメのサーバーは
- レンタルサーバー国内シェアNo.1
- 安くて、使いやすい
- WordPressを簡単に導入できる
エックスサーバー です。
エックスサーバーの取得方法はコチラで詳しく説明しています。
エックスサーバーを取得しておくと…
エックスサーバーを取得すると
- WordPress
- LP(ランディングページ)やポートフォリオ
- HTML・CSS
をアップロードしたり、動作をチェックしたりできるようになります。
WordPressに関しては、この後詳しく解説していきます。
WordPressの学習

WordPress(ワードプレス)は、世界中で利用されているホームページ作成ソフトです。
無料でインストールして使うことができるので、ハードルが低く初心者にもおすすめです。
WordPressを使いこなせるようになれば
- 自分のWebサイト(ブログ)を運営してアフィリエイトで稼ぐ
- クラウドソーシングなどで、WordPressの制作案件を受注して稼ぐ
といったことができるようになり、受注できる仕事の幅が広がります。
- 無料のテーマテンプレート
- 簡単に機能を追加できるプラグイン
が豊富なので、プログラミング未経験でも、初心者でも、
見映えの良いサイトやブログが作成できますよ。
WordPressを勉強するなら
独学で、WordPressを学習するなら、WPHack講座のWordpress講座がおすすめ。
質が高く、最新のスキルを学べるからです。
完全サポートでWordPressを学習したいなら、
わからないことを講師に質問できるWPHack講座がおすすめです。
- 投稿、固定ページの使い方
- プラグインの使い方、選択
- オリジナルテーマ作成
本当に必要な部分だけをまとめた初心者に優しい講座なので、
無駄なく効率的に学習することができます。
WordPressで覚えるべき項目
WordPressで覚えるべき項目としては
- お問い合わせフォーム
- カスタム投稿
- カスタムフィールド
- オリジナルテーマ
です。
1:お問い合わせフォーム
お問い合わせフォームは、
コーポレートサイト(会社・企業のWebサイト)なら100%必要です。
一から作るとなるとそれはもう大変なのですが、
WordPressの場合は「プラグイン」という機能を導入すれば、簡単に作成できます。
例えば、よく使われているのが「Contact Form 7」というプラグインです。
インストールして、お問い合わせフォームはサクッと作れるようにしておきましょう。
2:カスタム投稿
WordPressでは、投稿の方法が2種類(投稿・固定ページ)用意されています。
動物園のWebサイトを例にして考えてみると
投稿は、ブログのように記事を書いてどんどんアップできるので、
今日の動物ニュースなどを投稿していけますね。
固定ページは、動物園の営業時間。
アクセス方法、入園料など、更新が必要のないページに使うことが多いです。
ブログ形式の投稿タイプや、固定ページとして投稿するのではなく、
別にページを新しく作りたいような場合に、カスタム投稿を使います。
例えば…
- どんな動物がいるか紹介するページ
- 人気のお土産を紹介するページ
などを作りたい時などですね。
投稿タイプを、自分でカスタマイズできるので、
オリジナリティの高いサイトを作ることが可能になります。
これも、お問い合わせフォームと同様「プラグイン」を導入すればOKです。
「Custom Post Type UI」というプラグインが良く使われています。
3:カスタムフィールド
カスタムフィールドは、投稿する時に「タイトル」「本文」以外に、
コンテンツや属性といった入力が必要な項目を追加できる機能のことです。
作っておけば、いちいち記事内から修正しなくても、
カスタムフィールド上で編集ができて、管理もしやすくなるのでとても便利です。
実は、WordPressに標準で用意されている機能ですが
- サイトに表示させたい時
- 追加したい項目が多い場合
などは、カスタムフィールドが使えるプラグイン(Custom Field Templateなど)を
導入する方がいい場合もあります。
4:WordPressオリジナルテーマ
WordPressでWebサイトを作る場合、
テーマテンプレートを使用するのであれば、コーディングは不要です。
ただ、自分でオリジナルテーマを作りたい場合、必要なものは…
- HTML/CSSのコーディングスキル
- PHPの基礎(調べながらでも大丈夫)
- PHPを動かすことができるローカル環境
オリジナルテーマを作る手順は…
- デザイン
- HTML+CSSによるコーディング
- WordPress用にテーマを作りかえる
- サーバーにアップ
という流れです。
PHPのプログラミング学習は必要か?
PHPとは、わかりやすく言うと、ユーザーが入力した内容に応じて表示する内容が変わるようなページ、
例えば…
- お問い合わせページ
- ショッピングカート
などを作成できる言語です。
Yahoo!やぐるなびがPHPで作成されているというのは有名ですよね。
PHPはHTMLに埋め込んで使用でき、構文がシンプルなので、
初心者向けの言語と言われます。
ただ、WordPressを使っていくのであれば、PHPのプログラミング学習は後回しで構いません。
なぜなら、WordPressは
- フォーマットができあがっているテーマテンプレートがたくさんある
- プラグインをインストールすることで様々な機能を追加できる
からです。
極端な話、コーディングの知識が乏しくてもWebサイト自体は作れるので、
PHPを勉強するなら、まずはWordPressの勉強を優先した方がいいです。
ただ、PHPが使えるようになると
- 高度なカスタマイズ
- オリジナルテーマ作成
ができるようになったりと、自由度がUPしますので、余裕があれば学習しておきましょう。
完全サポートコースのWordPressスクールWPHack講座を確認する
副業やフリーランスで稼ぐ月5万円稼ぐ準備
初心者からフリーランスで稼ぐためには
- LP(ランディングページ)
- コーポレートサイト
が作成できるようになっていることが前提です。
まずは、フリーランスで月5万円稼ぐための準備として、
ポートフォリオの作成にとりかかりましょう。
フリーランスで稼ぐ為のポートフォリオを作成する
フリーランスで稼ぐ為に最も大変なのが、最初の仕事を勝ち取ること。
フリーランスの実績がないので、大勢の応募者の中から選ばれるのは至難の業です。
そこで、ポートフォリオが駆け出しフリーランスにとって重要になってきます。
ポートフォリオは、駆け出しフリーランスでもベテランフリーランスでも使い、
自分のスキル・実力をアピールできる手段です。
自分で実際に作成したサイトを紹介したり、プロフィールを記載したりします。
何のサイトを作ればいいかわからないという人は
- 自分が作りやすい業種のホームページ(カフェなど)
- 実際に、クラウドソーシングのサイトの案件を見て多いもの
を作ってみましょう!
ポートフォリオに載せるサイトを一から考えて作成することで、
これまでの学習の復習にもなりますし、自信にも繋がりますよ。
最低限
- デザイン
- コーディング
で、1ページ型のLP(ランディングページ)が作れるので大丈夫です。
LP(ランディングページ)は
・縦長の1ページからなる商品・サービスの紹介ページ
・注文やお問い合わせといった行動を起こしてもらうことに特化したページ
のことです。
検索結果やWeb広告などをクリックして飛ぶことが多いので、
誰もが1度は見たことがあると思います。
フリーランスで稼ぐ為にサーバーへアップロードする
ポートフォリオをとして作成したものを、サーバーにアップして公開しておきましょう。
サーバーのおすすめは、先ほども紹介した「エックスサーバー」です。
副業やフリーランスで月5万円稼ぐために案件を獲得する方法
準備はできたけど、どうやって仕事を探すの?と思いますよね。
一般的なのは、クラウドソーシングを利用する方法です。
フリーランスにとって稼ぐ為に必要な案件はどんなものか確認してみましょう。
クラウドソーシングに登録する
クラウドソーシングとは、インターネット上で仕事を依頼したい人と
仕事をしたい人をマッチング(仲介)するサービスです。
有名なのは
でしょうか。
登録することで、
- 仕事の受注
- 納品
- 報酬の受け取り
まで、すべてオンラインで完結します。
クラウドワークス・ランサーズは、
自分がしたい仕事に応募をしてライバルから仕事を勝ち取るというスタイルです。
ココナラは、少し特殊で、
自分のスキルを出品し、買ってくれる人を待つスタイルです。
副業やフリーランスで稼ぐ月5万円稼ぐ為のロードマップまとめ
プログラミング未経験者・初心者が
- 効率よく学習する方法
- 月5万円稼ぐためには何が必要か
オススメのサイトやサービスを紹介しながら解説してきましたので
ぜひ参考にしてください。
最短手順をおさらいすると
- プロゲートでHTML/CSS/JavaScript/jQueryの基礎を勉強する
- プログラミングの開発環境(統合開発環境 IDE)を用意する
- エックスサーバーを取得する
- WPHack講座でWordpressを勉強する(わからないことを講師に質問できるのでオススメ)
- ポートフォリオを作成し、サーバーにアップする
- クラウドソーシングに登録して仕事を探す
勉強する時のコツ、そして挫折しないポイントは
- 学習は基礎だけ頭に入ればOK
- わからないことはその都度調べながら作業すれば大丈夫!
- 頭に入れるだけの学習(インプット)は早々に切り上げて作業(アウトプット)してみる
実際に手を動かして(動画を真似て)何かを作ってみること大事です。
作成したものは、ポートフォリオで紹介しましょう!
余裕があれば
- Bootstrap
- PHP
を学ぶと受注できる仕事が増え、収入UPに繋がります。