1. Progateを進めよう
まずは皆さんに Progate Web開発パス（Ruby on Railsコース） に取り組んでいただきます。
この記事では、Progateで進めていただく課題の概要と、学習の進め方についてご案内します。
Progateを進める上での注意事項
1. 暗記を目指さず全体像を掴もう
プログラミングの学習では、暗記は不要です。むしろ暗記にこだわると、いつまでも学習が終わらなくなります。
インターネットには豊富な情報があり、必要なときに調べられるのがプログラミングの強みです。
「まずは動かしてみる → こんな概念があるのか → ふーん、理解したかも → 次へ進む」
この流れでどんどん進めていきましょう！
2. 何度も周回しないこと
「しっかり理解できてから先に進みたい」という気持ちが強いあまり、Progateを何周もする方がいますが、それは ほとんど意味がありません。 Progateはプログラミングのごく一部を体験する教材なので、何周しても全体像のほんの一部しかカバーできません。
- Progateは“ざっくりした全体像”を掴む ためのツール
- 覚えきろうとせず「あとでググれば対応できそう」と思えたら次へ進む
これを心がけてください。必要があれば1周だけ復習してもOKですが、3周以上繰り返すのは時間の浪費です。
3. 道場レッスンはスキップでもOK
特にHTML/CSSの道場レッスンは、小さなミスでハマって時間を浪費しがちです。
実際の開発ではより実践的な作業があるので、道場レッスンを無理に完璧にする必要はありません。
- 15分悩んだら答えを見てしまう
- 完成イメージがついたら終わる
と割り切って進めましょう。
ただし、SQLの道場レッスンは良質なので挑戦する価値があります。
4. 生成AIを活用して効率的に学習しよう(重要)
最近は検索エンジンだけでなく、ChatGPTなどの生成AIも学習に大きく役立ちます。
- ソースコードの一部を提示して「このエラーを直すには？」と質問する
- 学んだ概念の用例や活用法を尋ねる
- コードを書いてみたが合っているかチェックしてもらう
といった使い方で、疑問点やつまずきを早めに解消できます。まずは兎にも角にも使ってみましょう。 ただし、最終的に理解・判断するのは自分自身です。AIの回答を受け取ったら必ず自分で検証し、正しいと確信できたら活用してください。
課題の手順
Progateで取り組むレッスンのうち、以下の課題に取り組みます。
- Web開発コースRuby on Rails
- HTML/CSS（初級 / 中級 ※はスキップでOK）
- Ruby
- Ruby on Rails（※道場レッスンは任意でOK）
- Ruby on Railsのバージョンが古いので、あまり覚えすぎず概要だけ拾っていきましょう
- HTML/CSS（上級 / Flexbox ※道場レッスンはスキップでOK）
- SQL（※この道場レッスンは良質なのでぜひやってください）
- Command Line
- Git
- Javascript (ES6)
- ※ 7つのレッスンのうち、Ⅳ、Ⅴはスキップしても構いません。
参考：Webアプリケーション概略図
1. HTML/CSSを学んでページの見た目を作る
1-1. Progate “STEP 2 Webページを作成しよう”を進める
ProgateのHTML/CSSコースを進めましょう。
Web開発パス（Ruby on Rails）の序盤がHTML/CSSのコースになっています。初級・中級編を通じて、Webページの見た目を作る技術を一通り体験できます。
- 暗記不要。ざっくり理解できたらどんどん進む
- 道場レッスンはスキップでもOK。15分悩んだら答えを見る
以下の内容は後半で取り組むのでここではスキップしてください
- HTML & CSS の開発環境を用意しよう！（macOS用）
- 自分で作ったWebページを公開しよう
1-2. HTML上級編、Flexbox編を進める
初級、中級編の内容に続いて、上級編ではPCとスマホでレイアウトを分けるための手法（ レスポンシブデザイン ） について学びます。 Flexbox編では、従来CSSを用いて要素を横並べにする際にfloatを用いていましたが、より直感的に要素の横並べが実現できます。 レスポンシブデザインと合わせて柔軟なデザインが可能になるので、合わせて学んでいきましょう。
- Progate STEP 3, STEP 4を進める
HTML/CSSに続き、RubyやRuby on Railsの学習を進めます。
2-1. Webアプリケーションの全体像を把握する
ProgateのWeb開発パスは、以下のように進みます。
- HTML/CSS
- ページの情報構造（HTML）や見た目（CSS）を定義するマークアップ言語。
- Ruby
- サーバーサイドの処理を担当するプログラミング言語。日本人が開発し、日本語の資料が豊富。
- Ruby on Rails
- Ruby製のWebアプリケーションフレームワーク。Webサービスとして動かすための機能をひと通り揃えており、開発を効率化してくれる。
フレームワークとは？
特定の機能をゼロから作るのではなく、あらかじめ用意された“便利な土台”を活用することで開発を効率化する仕組みのこと。
Railsの場合はMVCアーキテクチャ（Model, View, Controller）に沿った構成が用意され、Webサービス開発でよく使う機能をひとまとめにしています。
2-2. Ruby のレッスンを進める
Web開発パスの**STEP 3「Webアプリを作成しよう」**で、Rubyの基礎を学びます。
主な学習内容は以下です：
- 四則演算 / 条件分岐 / ループ / 変数などプログラミングの基本
- クラス / オブジェクト / メソッド / インスタンスといったオブジェクト指向の基礎
人間がコンピュータに指示するためには、現実の複雑な概念を機械的に整理して伝える必要があります。
最初は「これって何のために必要なんだろう？」と腹落ちしない部分があるかもしれませんが、Railsを学ぶ中で徐々に活用イメージが湧いてくるはずです。
最初は深く考えすぎず、手を動かして慣れるところから始めましょう。
2-3. Railsの前にやっておくと良い2つのレッスン
補足のレッスンとして、以下の2つに取り組んでください
- Command Line
- コマンドライン（CLI）操作を学ぶレッスン。開発ではマウス操作だけでなく、コマンド入力が必須です。
- progateでは簡単なファイル操作をコマンドで行う方法を学びます。
- SQL
- データベースにデータを読み書きするための言語。
- 構文が比較的シンプルで、Progateのレッスンがよくまとまっています。
- 道場レッスンも有用なので、ぜひ挑戦をおすすめします。
2-4. Ruby on Railsのレッスンに挑戦
いよいよメインとなるRailsのレッスンです。
Railsコースでは、Twitterのような投稿アプリをサンプルとして学習し、Webサービスの仕組みを一通り体感できます。
- ボリュームがあるので、焦らず少しずつ着実に進める
- それでも暗記を目指すのではなく、 「こうやれば動くんだな」 という感覚を大事にする
特にProgateのRailsコースは、古いバージョンのRailsを使っているため、最新の情報とは異なる部分があります。 わかりやすいメリットはあるものの、最新ではないことを念頭に置きながら 覚えすぎない ことを意識して進めてください。
最後に
途中でわからないことや、エラーで詰まってしまったときはいつでもSlackで質問してください。
まずは学習時間の確保を目指して、自分なりのペースで学習を進めていきましょう！