バッテラが如く

プログラミングしましょ!

【Progate】Progateでプログラミングを学ぼう

はじめに

Progateって知ってますか?

prog-8.com

自分も聞いたことはあるけどやったことはなかったんですよねー。

なので実際に挑戦してみましたという記事です。

始め方や進め方について詳しく解説していきます。

こんな人におすすめ

・プログラミングをこれから学びたい人
・Progateに興味はあるけどよく分からない人

Progateとは

Progateはプログラミングをこれから始めようと思っている人に向けのプログラミング学習サイトです。

流れは後述しますがスクールなどと違い独学が基本です。

1人で黙々とやりたい人や、人と話すのが苦手な方でも気軽に始めることができると思います!

お金がかかるのか?

レッスンが現在86あり、その中の19レッスンを無料で受けることができます。

無料で受けられるレッスンはほぼ基礎編となってます。

無料と有料で受けられるコースの違いは以下にまとめられていました。

https://prog-8.com/lessons/info

まずは無料枠で受けられる分を学習してみて自分に合わないなぁーと思ったらやめればいいし、

なんか楽しいし続けられそうだったら有料会員を検討してみるでよいと思います!

どういうレッスン(学習内容)があるの?

``HTML , CSS, Javascript, Ruby, PHP, Java, Python, Go```など言語に関するものや、

CommandLine、Gitといったツールのレッスンまであるみたいです。

学ぶ順番が決まっていないので、自分が学びたい箇所のレッスンをやればいいと思います。

プログラミングを全くやったことがないという人は、HTML&CSSのレッスンから始めてみるといいと思います!

必要な機材や環境について

パソコンもしくはスマホがあればOK

パソコンはWindowsMacどちらもで大丈夫です。

スマホ版にはアプリがあるようです。

この記事ではPC版での説明になりますのでご留意を。

アカウントを作る

Progateはアカウントを作る必要があります。

アカウントを作るのはもちろん無料ですので安心を!

トップページ に「今すぐはじめる」ボタンがあるのでこちらをクリックすると、

すぐにアカウントを作る画面になります。

よくある会員登録方法で、

ユーザー名とメアドとパスワードの3つを入れて登録できます。

GoogleAppleなどのアカウント連携でも作成することができるので、

お好きな方法で登録をしちゃいましょう。

登録できたら自動でログインされます。

レッスンをやってみよう

Progateを始める準備が整いましたので無料のレッスンを受ける手順を解説します。

コースの選択

今回はHTML&CSSのコースを選択したいと思います

トップページ{リンク}に遷移しましょう

上部の「コース一覧」をクリック

スクロールすると言語別コースの欄があり、

その中にHTML&CSSというアイコンがあるので、そちらをクリックします

レッスンを選択

続いてどのレッスンを受けるかの画面になります。

一番上のレッスンの「HTML&CSS初級編」をクリックするとレッスンを始めてみます。

コースの一番上にあるレッスンだけは一部を除いてほぼ無料で受けられるレッスンとなってました

スライド

レッスンの前半は「スライド」と呼ばれる勉強パートになります。

図の説明が多いためすんなり読み進められるようになってますね。

(参考書とかだとテキスト多めで萎えるんですよね〜)

「スライド」が終わったら「演習」に進みます。

演習 - 画面構成

レッスンの後半は「演習」と呼ばれる実践パートになります。

画面の左・中・右のエリアでそれぞれ役割があります。

中エリア(黒いところ)にプログラムを打ち込んでいきます。

左エリアでは、プログラムをどう書けばいいかの指示が書いてあります。

指示にそってプログラムを書いていきましょうー。

右エリアはプレビューとなっています。

上と下にプレビューがありますが、

上側には、自分が書いたプログラムの結果が表示されます。

下側には、見本(正解)が表示されています。

なので見本と同じ表示なるようにプログラムを組んでいくって感じです!

演習 - プログラムができたら

プログラムを書いてプレビューの上下が同じになったら、

「できた!」ボタンをクリックしましょう。

もし間違っていれば、どこが間違っているか教えてくれます。 (これがやさしい)

見事正しいコードが書けていたならレッスン達成です!

どうしても分からないという場合は「答えをみる」をクリックする演習の答えが表示されます。

なるべく見ずに「スライド」を再度確認してみて自力でやるのが吉だと思います。

「次に進む」をクリックすると、次のレッスンが開始されていきます。

このようにしてレッスンを進めていくだけとなりますので、

誰でも気楽に進められるようになっています。

ありがとうProgateさん。

おわりに

実際に1ヶ月やってみた感想としましては、

いきなり参考書を見て挫折した自分でもついていける解説の丁寧さがありましたし、

「演習」では自分が書いたコードが間違っていたらどこが間違いを指摘してくれるのも、

初心者にはすごく助かるなーと思いました。

今回はProgateをはじめる方法について書いてみましたが、

Progateの中での便利な機能やノウハウについてアップしていけたらと思います。

最後まで見ていただきヘペトナス!

読者登録・Twitterのフォローもお願いします。