プロ直伝！Webエンジニアとして独り立ちするために学ぶべきスキルマップ

Webプログラミングの始め方

この記事の動画版はこちら（画像クリックでYoutubeに飛びます）

今回は、初心者の方向けに「Webアプリケーションを作るために学ぶべき技術」についてご説明していきたいと思います。

HTML、CSS、JavaScript、PHP、Ruby、Pythonなど、プログラミングを学ぼうとするとたくさんの技術が出てきて、どれをどういった順番で学んでいけばいいのか迷ってしまいますよね。

実は、これらにはそれぞれ「役割分担」があります。

今回はこの辺りを分かりやすくご説明していきたいと思います。

これからプログラミングを学んでいこうと思っている方や、現在フロントエンドを学習中で、これからバックエンドプログラミングも学んでいこうと思っている方のご参考になれば幸いです。

学ぶべきスキルマップ

Webアプリケーションを作る際の「技術の全体マップ」は、こんなイメージです。

それぞれの技術を役割別に配置しました。

まず大きく分けて「フロントエンド」と「バックエンド」という分類があります。

フロントエンドは、
実際にユーザーが使う「画面まわり」を作る技術のことです。

バックエンドは、
ユーザーからは直接見えないんですが「裏方」として様々な処理を行うための技術のことです。

順番にご説明していきます。

フロントエンドスキル

フロントエンドには3つの主要技術があります。

①HTML
②CSS
③JavaScript

①の「HTML」は、画面を作るためのメインの技術です。

HTMLタグというものを使ってコードを書いていくことで、Webページを作ることが出来ます。

②の「CSS」は、画面のデザインを指定するための技術です。

基本的に、HTMLに付随する形でセットで使います。

例えば、画面のレイアウト構成や、背景の色、文字の大きさ、ボタンの形など、デザインに関することは、このCSSに指定していきます。

この2つはセットだと覚えておきましょう！

 HTMLとCSSが出来るようになると「Webページ」を作ることが出来るようになります。

そして、③の「JavaScript」は、HTMLで作った画面に動きを加えたり、操作性を良くしたりと

画面をよりインタラクティブにするために使います。

 JavaScriptを使わなくても、Webアプリケーションは作れるのですが、使うことでより操作性の高い、カッコいいアプリケーションが作れるようになります。

バックエンドスキル

次に、バックエンドです。

バックエンドは、先ほど言ったようにユーザーには見えない「裏方」の処理を担当します。

例えば、

ユーザーが入力したURLやクリックしたリンクに応じて、次に表示すべき画面を振り分けたり

ユーザーが画面から入力したデータを受け取ってそれをデータベースに保存したり

逆に、データベースから商品情報などを取り出して、それをユーザーに見せられる形式に加工し、画面表示用のHTMLを生成したり

このような形で、バックエンドは、Webアプリケーションの「管制官」的な役割を行っています。

こういった処理を作るための技術が、
Ruby、PHP、PythonといったWebプログラミング言語です。

Webプログラミング言語には、いくつもの種類がありますが、基本的に1つのWebアプリケーションではこの中の「どれか1つ」を選択して使う形になります。

 ですので、まずはこの中からどれか1つ選んで学んでいけばOKです。
※ちなみに僕の講座では「PHP」を使って学んでいきます。

そして、これらの言語からデータベースを操作する際には、データベースに対して命令を行うための言語である「SQL」というものを使います。

 SQLは、どのWebプログラミング言語を選択したとしても共通の技術となりますので、1つの技術要素として学んでいきましょう。

サーバースキル

そして、これら全てを動かす「土台」となるのがサーバーです。

レンタルサーバーを借りれば、サーバーはあらかじめ準備・設定されている状態ですが、自分でWebサービスを本格的に運営してユーザーを増やしていきたいという場合や、フリーランスとしてお客さんのWebシステムを提案・構築していくような場合には、サーバースキルが求められることも多くなります。

 サーバースキルは、プログラミングの学習とは切り離されている場合も多いですが、僕の経験上、ここも忘れてはいけない重要な技術要素です。

しっかり自分の学習ロードマップに加えておきましょう。

まとめ

ということで、まとめると、

【フロントエンド技術】
HTML/CSSで画面を作り、JavaScriptでよりインタラクティブにする

【バックエンド技術】
PHP／Ruby／Python（どれか1つ選択）
データベース操作のためのSQL
土台となるサーバースキル

これらが、Webプログラミングを行う上で身につけるべきスキルマップとなります。

現在、自分が学んでいるもので足りないものはないですか？

自分が到達したいレベル、目指す方向と見比べて、もし足りない技術があるなら、是非学習ロードマップを組み直してみてくださいね。

おすすめ記事