プログラミング未経験者が学習をはじめる前に知っておくべきこと
プログラミングを学習しようとしている人「これからプログラミング学習をはじめようと思うけれど、言語が多すぎてよくわからない。あと、初心者にオススメのプログラミング教材とかあれば教えてください。」
こういった疑問に答えます。
本記事の内容
この記事を書いている私は、Web開発のフロントエンドエンジニアです。
主に、Webアプリの見た目の部分を作っています。
プログラミングをはじめたのは、2020年2月です。
それから、色々な言語に手を出し、遠回りしてしまい、今の仕事に就くまでに1年以上かかりました。
最短で学習できたら3ヶ月から半年で目的を達成できるはずなので、失敗する人が減ればと思い、本記事を書きました。
こういった私が解説していきます。
※私がWebエンジニアですので、本記事ではWebエンジニアについて解説しますm(_ _)m
プログラミング未経験者が学習をはじめる前に知っておくべきこと
プログラミング未経験者が学習をはじめる前に知っておくべきことは以下の通り。
- その①：目的を明確にする
- その②：目指す働き方を明確にする
- その③：目的や目指す働き方に合わせた学習をする
それぞれ解説します。
その①：目的を明確にする
まずは目的を明確にしなければなりません。
なぜなら、目的が不明確だとムダな学習コストが発生してしまい、遠回りになってしまうからです。
よくある目的は以下の通りかと思います。
- 「Webアプリを作りたい」
- 「Webサイトを作りたい」
「WebアプリとWebサイトって同じじゃないの？」と思う人もいるかもしれません。
結論からいうと違います。
簡単に説明すると、
- Webアプリ→Twitter、Facebook、Instagram、Amazonなど
- Webサイト→Appleの公式サイト、企業のホームページ、当ブログ(かわしまのブログ)など
もう少し深く解説します。
Webアプリは使う人によって画面の情報が動的に変わる
Twitterを例に挙げます。
Twitterはログインしていると、『自分専用のプロフィールページ』が表示されるようになります。
Twitterにログインしていなければ、「アカウントを作成orログインしましょう」みたいな表示が出ます。
このように、『使う人によって画面の情報が動的に変わる』というのがWebアプリケーションの主な点です。
Webサイトは全員に同じ情報を表示する
Webサイトでは、基本的に『全員に同じ情報を表示』します。
例えば、Appleのホームページは、誰がみても同じ情報が表示されます。
これがWebサイトの主な点です。
おさらい
おさらいすると、
- Webアプリは使う人によって画面の情報が変わる(動的)
- Webサイトは全員に同じ情報を表示する(静的)
ということになります。
あくまで一例ですので、ニュアンスで理解していただければと思います。
その②：目指す働き方を明確にする
目指す働き方を明確にしましょう。
理由は、リモートワークがしやすい分野、リモートワークがしにくい分野があるからです。
私の肌感覚だと、
- リモートワークがしやすい分野→Web制作
- リモートワークがしにくい分野→Web開発
といった感じです。
ここまで読んだ方の中で、「じゃあリモートワークがしたい人はWeb制作をしたほうがいいのか…。Web開発がしたかったのに」と思うかもです。
でも大丈夫です。
なぜなら、フルリモートのWeb開発企業があるからです。
私自身、Web開発のフロントエンドエンジニアですが、フルリモートで勤務しています。
中には、週2や週3出勤の企業もあります。
「リモートワークがしやすい」か「リモートワークがしにくい」かの違いですね。
こういった感じで、働き方を明確にしましょう。
その③：目的や目指す働き方に合わせた学習をする
ここまでで明確にした「目的」と「目指す働き方」に合わせた学習をしましょう。
主な学習内容は、下記の通り。
- 「Web制作がしたい」→HTML, CSS, Sass, JavaScript, jQuery, PHP, WordPress
- 「Web開発(フロントエンド)がしたい」→HTML, CSS, Sass, JavaScript, Vue.js, Reactなど
- 「Web開発(バックエンド)がしたい」→Ruby, PHP, Java, Pythonなど
「あれ？フロントエンドとかバックエンドとか謎の言葉が増えたんだけど…」と思った方、その通り。
実は、Web開発にはフロントエンドとバックエンドがあります。
簡単に解説すると下記の通り。
- フロントエンド→Webアプリの見た目の部分を作る
- バックエンド→Webアプリの機能の部分を作る
深堀りします。
フロントエンド
こちらはWebアプリの見た目の部分です。
Twitterの見た目はフロントエンドエンジニアが作成しています。
バックエンド
バックエンドはWebアプリの機能の部分です。
実は、TwitterなどのWebアプリには『データベース』というものがあります。
みなさんのツイートには『id』というものが割り当てられています。
イメージは下記の通り。
| id | text |
| 1 | 今日のアニプレックスオンラインフェスよかった！ |
| 2 | 今までで1番感動したアニメは『ヴァイオレット・エヴァーガーデン』です。 |
例えば、かわしま(@hiroyukikshima)をフォローすると、「かわしまに紐づいているツイートをタイムラインに全件表示する」という処理が実行され、みなさんのホーム画面にかわしまのツイートが表示される。という仕組みです。
詳しい解説は長くなるので省略しますが、こういった裏側の処理を行うのがバックエンドです。
おさらい
おさらいすると、
- 「Web制作がしたい」→HTML, CSS, Sass, JavaScript, jQuery, PHP, WordPress
- 「Web開発(フロントエンド)がしたい」→HTML, CSS, Sass, JavaScript, Vue.js, Reactなど
- 「Web開発(バックエンド)がしたい」→Ruby, PHP, Java, Pythonなど
自分の目的や働き方に合わせて学習内容を決めましょう。
プログラミング初心者にオススメの教材4選
「学習する言語はわかった。じゃあ初心者にオススメの教材教えてよ」と思うかもです。
初心者の時点では、向いているかどうかの判断ができないので、コストが低い教材を厳選しました。
初心者にオススメの教材は下記の通り。
それぞれ解説します。
Progate
特徴
- 基本無料
- 月額1078円(税込)で全コース開放
- スライド形式
- Web上で完結
- スマホアプリあり
Progateは、無料もありますが、深く学ぶためには月額1078円(税込)かかります。
Web上で完結するため、環境構築が不要です。
その反面、実環境で作業する時につまずく人がいるかもしれません。
プログラミングの適正を調べるために使われることが多いイメージがあります。
私も学習当初はProgateを使用していました。
ドットインストール
特徴
- 基本無料
- 月額1080円(税込)で全コース＋質問機能が開放
- 動画形式
ドットインストールは、動画形式のプログラミング学習サービスです。
ドットインストールもプロゲートに似ていて、月額1080円(税込)で全コース開放です。
Progateとの違いは、『先生への質問機能』です。
プログラミング学習において、質問できる環境は重要です。
Udemy
特徴
- 基本有料(買い切り)
- 一部無料あり
- 動画形式
- 有名講師が講座を出していたりする
- セール時が安い(むしろセール時がデフォ)
Udemuyは、買い切りの動画形式のサービスです。
有名講師が講座を出していたりします。
講座購入後、30日以内だったら返金してもらえます。
私も過去に返金してもらったことがあります。
セール時に勢いで買って、結局いらなかったパターンです。
Youtube
特徴
- 無料
- プレミア公開しているチャンネルもある
- 動画形式
YouTubeは、無料なのでオススメです。
未経験者が気づかないのが、『海外の動画』です。
YouTubeで、『jQuery』などで英語検索すると、良質な動画がたくさんあります。
意外と動作を見ているだけでも理解できるので、試してみましょう。
まとめ：プログラミングの学習内容は目的に合わせて決めよう
プログラミングの学習内容は目的に合わせて決めましょう。
私は遠回りし、1年以上かかってしまいました。
みなさんには同じ道をたどってほしくないです。
質問等があればTwitterでDMいただけたら答えます。
かわしまのTwitter(@hiroyukikshima)