Progateを終えたら次に何をする？制作を学べるサイトと選び方

Progateで取り組んだコースを終えたものの、次に何をすればよいか迷っていませんか。教材を離れて自分で作るか、別の学習サイトへ進むかを考えている人向けに、次の学び方を整理します。

おすすめは、学んだ言語を使ってWebページやアプリなどを一つ作る学習へ進むことです。

作り始め方が分からなければ、完成までの手順がある制作講座を使います。作りたいものがあり、自分で調べながら進められるなら、自作から始めても構いません。

ここではUdemy・ドットインストール・paizaラーニングの使い分けと、制作講座の選び方を紹介します。HTML・CSSだけに限らず、サーバー側の処理やデータベースを扱うWebアプリの学習先も見ていきます。

Progateの次は、学んだ言語で作る学習へ進む

作る手順が見えない場合は、制作物を完成させる講座が候補です。見本と同じものを、動画や解説に沿って自分でも作ります。ファイルの準備、コードを書く場所、動かす方法まで案内されている講座なら、制作の流れを追えます。

まだ作りたいものが決まっていないなら、学習サイトの制作系講座で完成見本を見てみてください。Webページ、タスク管理、投稿アプリなどから、使ってみたいものを選ぶ方法があります。

すでに作りたいものがあり、必要な手順を調べられるなら自作へ進みます。分からない部分が出たときに、公式ドキュメントや、その機能を扱う講座を参照します。

制作を学べる学習サイト3つと、使い分け

学習サイトは、講座ごとに選ぶか、順序に沿って学ぶか、必要な技術から探すかで使い分けます。まずは、自分の探し方に合う入口を一つ見てください。

学習サイト	まず見るとよい人
Udemy	作るものと学習内容から、講座を選びたい
ドットインストール	短い動画と、言語別の学習順序を見たい
paizaラーニング	言語・目的・技術を絞って学習先を探したい

Udemy｜作るものに合う講座を選びたい人へ

Udemyは、講師が作成した講座を選んで受講する動画学習サイトです。Web開発やプログラミング言語、データベースなどの分野から、自分の目的に合う講座を探せます。

私もプログラミングを学ぶときは、主にUdemyの講座を使っていました。エンジニアになった後も、Udemyで学習を続けていました。

有料講座のQ&Aでは、講師に講座の内容を質問できます。ほかの受講者の質問・回答も検索できるので、同じところでつまずいたときの手掛かりになります。回答までの時間は講師によって異なります。

「PHP 入門」のように言語名だけで探すより、「PHP 掲示板 作成」「JavaScript アプリ制作」など、作りたいものや学びたい作業を加えると候補を絞りやすくなります。目次の制作部分と前提知識を読んでから選びましょう。

個別購入と定額制では、料金や視聴できる期間が異なります。個別購入なら、急ぎでなければセールを待つのも一案です。受講予定の講座が複数ある場合は、セール中にまとめて買っておく方法もあります。価格や対象講座はその都度変わるため、購入画面の金額を確認してください。

Udemyの個別購入には条件付きの30日以内の返金制度がありますが、購入方法などにより扱いが異なります。詳細はUdemyの返金に関するFAQを確認してください。

ドットインストール｜短い動画と学習順序を見たい人へ

ドットインストールには、Web制作やJavaScript、Ruby／Ruby on Rails、PHP／Laravelなどの学習ロードマップがあります。短い動画を区切って見ながら、必要な内容へ進みたい人の候補です。

Progateで基礎を学んだ人は、ロードマップから制作レッスンを探し、受講に必要な知識を確認してください。例えばWeb制作には、環境準備やHTML・CSSの基礎に続き、見本のサイトを再現する模写の講座があります。学んでいない項目が前提になっていたら、その部分を補ってから進めます。

自分のPCで進める講座では、使うOSに合った環境準備の案内も確認します。2026年10月19日の公式表示では、個人プレミアムの月々払いは月額1,480円（税込）です。無料で見られる動画もあります。

料金・契約期間・自動更新の条件は、ドットインストールの料金プランで確認してください。

paizaラーニング｜言語や必要な技術から探したい人へ

paizaラーニングは、動画と演習で学ぶサイトです。講座一覧では言語に加え、「Webアプリケーションを作りたい」といった目的でも絞り込めます。データベースを操作するSQLや、Webアプリづくりの枠組みとなるフレームワークからも探せます。

RubyやPHPなどの基礎を終え、次にWebアプリの作り方やデータベースを学びたい場合は、目的に合う講座の概要と前提を確認します。

講座の演習環境と、自分のPCで制作する環境は同じとは限りません。作業場所と必要な準備は講座ごとに確認してください。2026年10月19日の公式表示では、個人の1ヶ月プランは1,490円（税込）で、無料で見られる範囲もあります。

視聴範囲や契約期間は、paizaラーニングの有料プランで確認してください。「月額980円」は12ヶ月プランの月換算額で、月々払いの金額ではありません。

制作講座は、完成物・前提知識・作業環境で選ぶ

制作講座は、完成するものと今の知識が合い、自分の環境で作り始められるかで選びます。「初心者向け」という表示に加えて、次の内容を確認しましょう。

購入前には、プレビューで説明の速さや画面の見やすさが自分に合うかも確かめてください。

Udemyで制作講座を探すときの具体例

ここからは、制作講座を選ぶときに何を見るかを、Udemyの3講座で具体的に紹介します。自分が学んだ内容と作りたいものに合う例だけを確認してください。3本を順に受ける学習コースではありません。

HTML・CSSでWebサイトを作る例

「【Webサイト講座】一度でいい、手作業でhtmlとcssを目に見える形で追えばわかる。ゼロからWebサイトを作ろう。」（サーチマン 佐藤）は、ロゴ・写真・メニュー・フッターを備えたWebサイトを、HTML・CSSで作る講座です。

HTML・CSSの基礎を終え、ページ全体をどう組み立てるのか知りたい人に向いています。ページの骨組みを作り、見出し・文章・画像・メニューを加えて、余白や色、大きさを整えていきます。

スマートフォン向けのメニューや、画面幅に応じて見た目を変えるCSSも作ります。仕上げにはHTML・CSSの文法チェックまで行います。

作業にはWindows／MacのPCを使います。VS Codeの導入、コードを変更した結果をブラウザで確認するLive Serverの設定、作業フォルダの準備から説明があります。Progateの学習画面を離れ、自分のPCでファイルを作って制作を進める練習に使えます。

JavaScriptで画面のあるアプリを作る例

「アプリを作って学ぶ JavaScript 練習＆講座」（柳井 政和）は、割り勘計算、データの並べ替え、ストップウォッチなど、ブラウザで動くアプリを作る講座です。

JavaScriptの基礎文法を学び、入力欄やボタンのあるアプリを作りたい人に向いています。例えば割り勘アプリでは、金額などの入力を受け取って計算結果を表示します。ストップウォッチでは、ボタンによる開始・停止と経過時間の表示を作ります。

サンプルコードを読み解き、変更する練習をしてから制作課題へ進む構成です。課題には解説付きの作例があり、自分で書いたコードと比べながら進められます。文法を復習しながら、画面に動きを付けるコードを書いていきます。

自分のPCに無料のVS CodeとChromeを入れて作業します。ソフトの導入やファイルの開き方から説明があり、練習用と解答のコードもダウンロードできます。

PHPとデータベースでWebアプリを作る例

「PHP+MySQL（MariaDB）をちゃんと学ぶ講座」（たにぐち まこと〈ともすた〉）は、メモの登録・一覧・詳細・編集・削除や、会員登録・ログイン付きのひとこと掲示板を作る内容です。

私もこの講座を購入しました。たにぐちさんの講座はほかにもいくつか購入していて、説明が分かりやすいと感じています。初心者にもおすすめしたい講師です。

Windows／macOSでMAMPを使う環境づくりから、PHP・データベースの基礎、アプリ制作まで学ぶ講座です。PHPの基礎を学んだ人が、入力した内容を保存して表示する流れへ進みたい場合の例です。

MAMPなど、PHPやデータベースを動かすための開発用ソフトを自分のPCにインストールして進めます。HTML・CSSの知識も推奨されています。

同じ講座内に旧版の教材も残っています。受講時は、講師が「新カリキュラム」と案内している教材で進めてください。

RubyやPythonなどを学んだ人も、同じように「学んだ言語＋作りたいアプリ」で探します。例えばRubyで作りたいなら、PHPへ切り替える前提にせず、Ruby／Ruby on Railsの制作講座から前提と完成物を見ます。

教材で作ったものを、自分の用途に変えてみる

教材に沿って一つ作れたら、自分が使う場面に合わせて機能や構成を変えてみます。見本の作り方を手掛かりにしながら、自分で必要な処理を考える機会を作ります。

例えば、投稿アプリなら投稿を検索する機能を加える、タスク管理なら期限で絞り込めるようにする、といった広げ方があります。教材ですでに扱った機能なら、別に必要なものを選んでください。

自作から始める人も、分からない箇所が出たらその機能の公式資料や解説を参照します。Web制作の手順を文章で確認したい場合は、MDNの「初めてのウェブサイト」のような公開チュートリアルもあります。

応募用の作品を用意する段階になったら、題材や完成ラインは次の記事で確認してください。
▶ 未経験エンジニアのポートフォリオは何を作る？迷ったときの考え方

講師のきめ細かなフォローを受けながら学びたい場合は、スクールや学習支援サービスのサポート内容を次の記事で確認してください。
▶ 未経験向けプログラミングスクール・学習支援比較｜独学で止まったときの選び方

まとめ｜学んだ内容に合う制作の入口を選ぶ

Progateの後は、学んだ言語を使ってWebページやアプリを一つ作ってみましょう。進め方は、今の自分が取り組みやすいほうを選んでください。

• 自分で調べながら作れそうなら、作りたいものの制作に取り組む。
• 作り方が分からないなら、制作講座の手順に沿って一つ作る。

制作講座を使う場合は、Udemyなどの学習サイトで、学んだ言語と作りたいものを組み合わせて探してみてください。完成見本・前提知識・作業環境を確認し、今の自分が取り組める講座を選びましょう。