Webエンジニアが最初に行う学習術2ヶ月プラン

2025/08/14

エンジニア 学習

t f B! P L
eyecatch プログラミングスクールに行った人であれば、教科書を見ながら手順に沿って、プログラミングの学習をすると思います。 最近では、Webの教材を、順に見てくみたいですね。 でも、世の中には独学で学習している人も多く、参考書を買って読んでいたり、ネットで検索した情報を元に独自に学習を進めているようです。 実は、こうした学習手順って、有るようで無いような気もするんですが、 未経験者に教育をする時に、「自分ならこの手順で教える」的な内容を、ブログに書いておきたいと思います。 今後の自分のために・・・

1週目. 「Webとは何か?」を理解する

まずは ブラウザとサーバーの関係 を図解などでざっくり説明する。 「サーバーって何?」とか、「ブラウザってフリーザとどう違うの?」なんていう初心者がいたら、ここをしっかりと理解する必要があります。 HTML/CSS/JS/PHPなどの技術がどこで使われているのかを把握させるのも重要なので、 スクリプトや、言語、などの名称を覚えてもらいます。 「静的なページ」と「動的なページ」の違いも軽く触れるのも大事です。 コードの中身は見せたらパニくると思うので、拡張子と、その役割についての理解をするのがポイントです。

2週目. HTML/CSSを使って、1ページ作ってみる

"Hello World" のWebページを作るのは、定石。 見出し・段落・画像・リンク・表など、HTMLの基本タグを実際に書かせる。 CSSで色を変えたり、ボタンにホバー効果を付けたり、すぐに結果が見える楽しさを体感させる。 初心者は、「スクリプトのすべての内容を理解しないと、Webエンジニアになれない」と思い込みガチなので、
・文字を画面に表示する。 ・装飾(色やサイズ)を変更する。 ・画像などのメディアを表示する。 ・リンクをつける。
デザインなどは、この後の学習工程である事を理解させて、まずは、しっかりと上記の内容を自分でできるという成功体験をするのがポイント。

3週目. JavaScriptで「動き」を付ける

一気にレベルが上がる感じがしますが、Javascriptに苦手意識を持っているWebコーダーやWebデザイナーの人も多いです。 まずは、HTMLでセットできる書き方と、scriptタグ内で書く場合、jsファイルをscriptタグで設置する方法などを理解した上で、 アラートを出す/ボタンクリックで表示を変える、などの簡単なスクリプトを自分で書いて、実行して、確認できるという工程を何度も行うのがいいでしょう。 次に、DOM操作の基礎を学習します。 getElementById() などの、HTMLとJavascriptの関連する箇所を重点に、HTMLを操作するJavascriptを学習する事で、「Webプログラミングが面白い」という感覚が生まれてくるでしょう。

4週目. ローカル環境で簡単なWebアプリを作る

テキストエディタ

VS Codeなどのエディタの使い方を覚えるのも重要です。 キーボードのタイピングなどは、基本中の基本ですが、重要なのは、自分のスタイルを見つけるという事も意識するといいかもしれません。

簡易サーバーの立ち上げ

PHPやPythonなどは、Live Serverを立ち上げる機能もあるので、ローカル環境構築が簡単にできます。 他にもDockerを使ったり、簡易な外部サーバーなどを扱えると、独自の環境が構築できて便利です。

Git

Gitの初歩もこのあたりで教える(git initとcommitだけでもOK) add、commit、pushなどまで覚えると、基本的な操作はOKだと思われる。

5週目. PHPなどサーバーサイドの導入

HTMLフォームで入力→PHPで受け取って表示する、などの簡単なやりとり $_POSTや$_GETの使い方を覚えるだけで簡単な掲示板アプリなどを作る事ができるので、 インターネットのデータの流れなどが理解することが、Webエンジニアの最初の一歩と言ってもいいでしょう。 ローカル環境で動くだけでも達成感があるので、この成功体験を早めに行う事で、挫折しにくいエンジニア学習につながるでしょう。

6週目. データベースと接続してみる

次に、SQLiteやMySQLを使って簡単なSELECT/INSERTの体験を学習します。 「データを保存できた」ことの喜びを感じてもらうのと同時に、SQLの奥深さも理解しつつ、 ORMなどを使って比較的簡単にデータベースが扱える事も理解できたら、Webアプリを作るイメージが出来上がってきます。 この辺から、MVC的な構造にも少し触れるといいかもですね。 できれば、少し難しめの技術書を読み始めると、何となく理解できてくるかもしれません。

7週目. 実際にWebに公開する(簡単なデプロイ)

GitHub Pagesやレンタルサーバーを使って、Webに公開すると、自分の作品がネット上にアップロードできた達成感で、 Webエンジニアとしての成功体験が得られます。 URLを共有できることで、友達などに見てもらう事で、大きな自信にもつながること間違いなしです。 Xなどで公開すると、色々な人が意見を言ってもらえるかもしれないので、 自分のポートフォリオなどを作ってアップするいわゆる自分ホームページを作るのがオススメです。

8週目. チュートリアルから実践へ

ドットインストール・Progate・Udemyなどを併用しつつ、自分で「何かを作りたい」と思えるものを探してみましょう。 作りたいものを考えて、それに必要な技術を逆算して学ぶステップに移行。 基本的にエンジニアは、この作りたいものを学習して作るを繰り返して、 この経験を積んでいく職業だと考えましょう。 何度かやっていくうちに、自分のレベルや、作りたいもので何を勉強すべきか、理解しているけど、深掘りできていないという事が見えてきたら、 自分がレベルアップしている証拠でもある事が自覚できた証拠ですね。

あとがき

教科書的な順番も大事ですが、成功体験を早く積ませることが最優先だと思っています。 「動いた!」という小さな感動が、次の勉強の原動力になるんですね。(ならない人もいるかもですが) 自分自身も昔は遠回りばかりしていたので、これを残しておくことで、未来の誰かや未来の自分が少しでもショートカットできればと思っています。 そして、自分の備忘録をみて、見ず知らずの人から「参考になりました」というメッセージをもらった時に、 モチベーションが爆上がりしますよ。

人気の投稿

このブログを検索

ごあいさつ

このWebサイトは、独自思考で我が道を行くユゲタの少し尖った思考のTechブログです。 毎日興味がどんどん切り替わるので、テーマはマルチになっています。 もしかしたらアイデアに困っている人の助けになるかもしれません。

ブログ アーカイブ