初心者向け!Webの開発への最短ロードマップ!

6 min 14 views
ロードマップ 初心者 エンジニア

どこから始めるべき?

自分で調べていると何から始めていいのかわからないですよね。

僕もそうでした。

やりたいことが明確じゃないと尚、混乱します。

見当違いのスクールに申し込んで、途中で「やりたかったことはコレじゃない!」ってなった人も多いかと思います。(自分は数十万ちょっとドブに捨てたことあります。未だに後悔の念が深いです(笑))

ある程度仕事をしているとわかるんですけどね、、、飛び込むまでわからないもんです。

いきなりバックエンドだけを覚えて、それだけで食っていけるなんて勘違いしたこともありました。

さて、技術が日進月歩で進化している昨今ですが、AIでプログラマーの仕事がなくなるという記事もチラホラとみられます。

が、安心してください。デバックしたりテストするのは人間なのでエンジニア職はまずなくなりません。

むしろ仕事がしやすくなっています。

Adobeをお使いのクリエイターさんならご存じでしょうがAI機能がついたおかげで作業効率が格段にUPしました。何時間もかけて調整してたものがすぐにできます。

だからといってデザイナーがいらなくなるかと言われれば、それは違うとなります。

AIは単なる道具であって、それ以上でもそれ以下でもないので安心してください。

世間の情報が多すぎるのに限定的で、初学者からすると選択肢が多すぎて何を学んだらよいかという状態になってしまっていると思います。

では、本題に入りましょう!

まずは、どんなエンジニアがいるの?(おおまかに4つに分類)

1、開発系エンジニア

皆が想像するエンジニアの姿はここじゃないでしょうか?

一昔前なら、プログラミングを始めるなら当たり前のようにコレを選択していました。

システムエンジニアはさまざまなシステム開発において幅広い業務に対応するのが主な仕事で、今でもプログラミングの中核をなしてます。

システムエンジニア(SE)、プログラマー(PG)、アプリケーションエンジニア、組み込みエンジニアなどがここに該当します。

2、インフラ系エンジニア

ITシステムの基盤となるネットワーク、サーバー、データベースなどの設計、構築、運用、保守を担当するエンジニアのことです。彼らは、Webサービスやアプリケーションが安定して動作するために不可欠な役割を担っています。

一昔前まで一部の技術を持つ人材以外は重要視されずエンジニア求人で保守・運用にまわされて名ばかりのエンジニアだと嘆いていた時代もありましたが、現在では誰もが少なからず使っているクラウドがメインとなり、彼らが構築・運用するインフラ環境がなければ、Webサービスやアプリケーションは正常に動作しません

ネットワークエンジニア、サーバーエンジニア、データベースエンジニアなどがここに該当します。

3、Web系エンジニア

フロントエンド、バックエンドなどでお馴染みのWeb系エンジニアです。

インターネット上のWebサイトの作成・Webサイト向けのアプリケーションソフトウェアの設計・開発を担います。

システムエンジニアはさまざまなシステム開発において幅広い業務に対応しているのに対し、Webエンジニアは基本的にWebシステムの開発に特化しています。

検索エンジンやSNSなど日常的にお世話になっているオンラインサービスの多くがWebで開発されていますね。

4、上記以外のITエンジニア

基幹システムの運用、営業をサポートする業務を担う職種などがあります。

社内ITエンジニア、セールスエンジニア(SS)、セキュリティエンジニアなどが該当します。

特にセキュリティエンジニアはクラウド領域でも重宝されますしオススメですが、情報のキャッチアップを常に行わないとすぐに技術不足になりかねない責任の重い職種となります。専門的なセキュリティ対策が必要とされており、これからもこの分野の専門家は非常に重要で、需要は高まる一方です。

始めるならWebが最適!

様々な選択肢がある中で、初心者に最適な入口がWebです。

理由としては

開発の難しさ

初心者には予想しているより遥かに障壁が高いです。

まずはプログラミング言語の複雑さ。CやJava、Swift、Kotlinなど高度な専門知識を要する言語が使用されていることが多い。

世間で簡単と言われているPHPでも覚えることが非常に多い(HTML&CSS、 JavaScript、Web技術(HTTP)、データベース、サーバー、API、バージョン管理システム、Linux/Docker、テスト、セキュリティなど)そこにフレームワークとかが乗っかるので大半の初学者は折れます。独学だとかなりの割合で心が折れます

また、1つの言語しかできないのではお話にならない。できなくていいんだけど、「やりません」「できません」は通じない。わからなくても調べながらしないといけない。ベテランになってもゼロからの学び直しなんてザラである。

プラットフォームごとに全く違う開発環境や技術が必要になる。

Web開発の普遍性と共通性

パソコン、スマホなど、デバイスの種類に依存せず同じ技術が使える

一度習得した技術を幅広い環境で使える。など、他のエンジニア職よりは敷居が低いです。

上記の理由からWeb開発からの入門をお勧めします。

就職した後もバタバタせずに、しっかりと土台をつけてステップアップしていけるのが利点です。

基礎であるHTMLとCSS、JavaScriptから始め、徐々に高度な技術へと進むことでプログラミングを効率的に学んでいくことができます。

また、Web開発で得た知識は将来的にアプリ開発や他の分野に進出するときにも役に立ちます。

アプリの見た目を作るのはHTML、CSS、JavaScriptなんですよ。土台という言葉が一番しっくりきますね。

フロントエンドとバックエンド

フロントエンド

フロントエンドとは、ユーザーが直接操作し目にする「Webブラウザに表示される部分」です。

主な技術としては

HTMLWebページの構造を定義
CSSページのレイアウトやデザインを制御
JavaScriptインタラクティブな機能や動的な要素の追加

ここからの出発をオススメする理由としては自分がWebデザイナーをしているという事もあるんですが、そのほかにもJavaScriptを突き詰めると、ライブラリ(React)やフレームワーク(Vue.js、Svelte、Angularなど)によってフロントエンドもバックエンドもいけるフルスタックエンジニアの道が開けるってところが一番の推しポイントです。

Webデザイナーじゃなくて、エンジニアになりたいんだーって方は是非上記のフレームワークなどを調べてみてください。

あと、HTMLとCSSをガッツリ学びたい人におすすめの本を紹介しておきます。現場に入ってからも手元に置いておきたい一冊です。

バックエンド

バックエンドは、ユーザーの目には見えないサーバー側で動作するプログラムやシステムを指します。

主な技術としては

サーバーサイド言語PHP、Python、Ruby、Java、C(++、#)、Goなど
データベースMySQL、PostgreSQL、MongoDBなど
フレームワークExpress,js、Django、Laravel、Ruby on Railsなど

バックエンドではこの他にも様々な技術が用いられます。

使用する言語やフレームワークごとに高度な知識が必要となります。

あと、非常に早く技術が増えていき廃れていきます。日々是勉強ですね。

まずはフロントエンドの勉強だけどその前に

バックエンドでのプログラムの動きも一通り理解しておくと、勉強がスムーズに進みます。

また、仕事をし出した後も情報のキャッチアップなど柔軟に対応できるようになります。

学び方

重要なのはHTMLとCSSをしっかり勉強すること。これらをしっかりと勉強することで、基本的なWebページを作成できるようになります。

サイズやレイアウトの指定の仕方、リンクの貼り方などすべての基本はココから始まります。

↓に貼ったリンクですが、スクール検討しているなら読んでみてください。あと独学でも勉強するにあたりここは押さえてた方がいいよって項目も載っていますので。

HTMLとCSSをしっかり学んだあとはJavaScriptに進みます。

JavaScriptは、Webブラウザで動作する唯一のプログラミング言語です。(←ここ重要)

アニメーションの実装やサーバーとの非同期通信など少し高度な部分はありますが気合入れて勉強してください。他の言語と違い、実行したことがすぐにブラウザに表示されるため、飽きずにできると思います。

また、プログラミングに対するハードルを著しく上げている開発環境構築という悪魔がJavaScriptにはいません。極論メモとブラウザがあればコードが書けて実行できます。

おそらくHTMLを勉強しだした時点で使っていると思われるVScodeからだと拡張機能の「Live Server」を使えば、クリック一つでコンピュータ内でローカルWebサーバーを立ち上げ、Webページをブラウザで表示してくれます。

ただしHTMLやCSSと違い、ここからが本格的なプログラミング言語学習の始まりとなります。

変数や関数、クラスやオブジェクトといった理解しがたい概念が登場します。

少なくとも半年はかかると思っておきましょう。ちなみに自分は理解できる言語を求めウロウロし、基礎の習得に1年以上かかりました。(←これ、愚の骨頂です。が、途中で概念は同じことに気付けたので結果オーライだと思っておきます。ちなみにPython⇨Ruby⇨JavaScript⇨PHP⇨Java⇨JavaScriptという経路を辿りました。)

ただ安心してください。一つの言語をある程度使えるようになると、プログラミングの基本概念は全プログラミング言語共通なので、後々のプログラミング学習は格段に効率が上がります。

ベースとなる考え方は皆同じなので、その言語の癖というか仕様を理解していく学習に切り替わります。

サーバーサイド開発

そんなの説明してなかったじゃんと思われた方、申し訳ないです。

間にワンクッション挟ませて頂きます。

フロントエンド開発の基礎を固めた後は、Node.jsのお勉強です。

Node.jsはWebブラウザ外でJavaScriptを実行するための環境です。

理由としては慣れたJavaScriptを使って効率的に学習を進めてほしいからです。

また、Node.jsはPHPのフレームワークであるLaravelなどで開発を進める際にも使用するので、覚えておいて損はないです。

初めての開発環境構築ですね。ワクワクしませんか?

ぶっちゃけるとインストールして終わりなんですけど、ここからPowerShell(わかりやすく言うとコマンドプロンプト)でガッツリPCに指示を出していく感じがでてきます。

ネットワークアクセスなどを勉強しつつ、バックエンドに行く前の練習です。

ここからの学習と、まとめ

JavaScript(TypeScript)を用いたWebアプリケーションフレームワークの学習、、、と言いたいところなのですが、自分の進路に必要だと思う言語の学習に進んでください

バックエンド的な言語の学習に進むもよし、SQLなどのデータベース学習に進むもよし、はたまたネットワーク関連を深めるもよしです。

SQLは避けて通れない感をひしひしと感じるときが来ると思うので基礎的な部分はさらっておいた方がよいと思いますが、最初からRuby(Ruby on Rails)を選ぶとActiveRecordのせい(おかげ)で、勉強する気が失せるらしいです。

が、覚えなくてもその時調べて使えばいいやって感覚でも全く問題ないので「ああ、こういうものなんだな」ってぐらいでも良いと思います。

要はどんな技術があって、いつ使って、どういう風に作用するかを知ることが大切です。

使いもしない技術を深めるのは効率が悪いので。

ちなみに資格マニアの自分としては深めてしまいましたが、資格とってから一切使うこともなければ勉強することもなかったです。

関連記事