このシリーズは、短期間でWebエンジニアとして最低限必要な技術を学ぶことを目的としています。
Webの世界は日進月歩、今日の技術は明日には古くなるくらいのスピード感で、次々に新しい技術が生み出され続けています。現在IT業界の特にWeb分野で活躍しているエンジニアの人たちの多くは、常に新しい技術の動きにアンテナを張りながら、より良いものを作る努力を続けています。
今回は、実際の勉強を始めていく前に、まずはWebの分野で使われている技術の構造を紹介しています。勉強を進める際に、自分が今学んでいる技術がどういった部分なのかを把握して、理解度が高まると思いますので、是非参考にしてみてください。
短期間で全体を経験したWebエンジニアへ
Web分野の動きは未だ活発で、現在IT業界の第一線で活躍しているエンジニアであっても、すべての技術を把握して使いこなしている人は、いないと断言できます。何故なら、こうやってあなたが文章を読んでいる間にも、新しい技術が次々に生まれ続けているため、とても一人の人間が追い付けるものではないからです。
実際には「業務で必要となる技術を習得する」のが現実的で、企業によって異なりますが、新人教育や研修期間などに最低限の業務が可能となるように教育をすることが多いでしょう。
対象は新人エンジニアとWebエンジニア志望
このシリーズは、とにかく短期間でWebエンジニアが戦場とする「Webの世界」を体験し、知ってもらう事を目的としています。対象は、IT業界に入社したばかりの新人エンジニアや、これからWebエンジニアを目指そうと考えている人です。
また、個人でWebサイトを立ち上げたり、Webシステムを個人事業として運営しようと考えている人にも役立つことが多いでしょう。ただし、先輩や上司から技術的なアドバイスや教育を受けられない環境にいる場合、不足している知識は自分で収集する必要があるでしょう。その場合にも、全体像がしっかり把握できていれば、調査や学習を効率的に行えるようになるはずです。
コンセプトは「最低限これだけは」
短期間で全体像を把握してもらうために、細かな説明を飛ばしたり、簡略化した説明にする場合もあります。大事なことは、「Web技術がどのように動いている」かを把握し、「Webエンジニアの仕事の領域」を認識することです。
それらを知った上で、今後の業務でどのあたりの知識が必要とされるのかを考え、広いWeb分野の中で自分は「どのあたりを勉強していくべきなのか」を考えることに役立ててもらえればと思います。
学習の全体像
Web技術を学ぶことに限りませんが、何事も始める際は全体像を把握しておくことは大事です。これはプログラムの設計をしていく際にも共通して言えることですし、実際に仕事を進める中でも、全体の中で自分がどのくらいの位置にいるのか進捗状況を把握することは、遅れを出さず良い品質のものを制作するためにとても重要です。
ここでは、これから始めていくWebの短期集中学習で、実際にどのような事を学ぶのか全体像を確認しておきましょう。
使われる技術分野
Webと一言で表現されますが、実際には中で複数の技術分野が繋がり合うことで実現されている世界です。書籍やインターネットの技術解説サイトなどを見ると、色々な聞いたことのない単語が次々に目に入ってきて、複雑そうに思ってしまうかもしれませんが、意外と単純なので安心してください。
この構成は、ネットワークやサーバーといったインターネットインフラの技術に大きな変革でも起きない限り変化がほとんどないため、一度覚えてしまえばずっと使える知識です。
Webの世界は大きく分けると「クライアント」と「サーバー」という2つのコンピュータ/ソフトウェアが通信することで実現されています。クライアントの方は、通常皆さんが使っているパソコンであり、その上で動作しているWebブラウザ(Chromeなど)のことです。サーバーは、ブラウザにURLを入力したり、リンクを押した時に通信をする相手で、Webのサービスを提供するコンピュータまたはソフトウェアの事をWebサーバーと呼びます。
それぞれの環境において、Webエンジニアが使うことになる技術分野を以下にまとめてみます。
ブラウザー側(クライアントサイド)
Webブラウザというソフトウェアは多くの人がパソコンやスマートフォンから利用しています。このソフトウェアもどこかのエンジニアが作っていることからも分かるように、Web通信で扱われるデータやブラウザ上でのデータの表現については、世界的な標準規格が決まっています。その世界標準規格はW3Cという団体で決められていて、Webエンジニアの世界の土台ともいえるでしょう。
ブラウザー側の利用者に見える部分に特化したWebエンジニアの事を、フロントサイドエンジニアと呼ぶこともあります。
HTML
HTMLは、Hyper Text Markup Languageの頭文字で、構造化された文書データです。Webページのデザインに相当する部品データとして、画面上の文字やレイアウト、ボタンやドロップダウンリストなどをタグという記述方式を用いて表現します。
Webエンジニアは、HTMLをゼロから書き起こす事もありますし、デザイナーが作ったHTMLを受け取って作業を引き継ぐといったこともある仕事です。何もない真っ新な状態から、思った画面を作れるようになるのが理想です。
HTMLの仕様は膨大なので、全部覚える必要はありません。経験と共に徐々に覚えていくはずです。ただ、最低限どのような構造をしていていて、動きやデザインを付けるのにはどういった手法があるのかは知っておく必要があるでしょう。
CSS
CSSはCascading Style Sheetの略で、HTML部品のデザイン要素の指定をまとめた仕様で、一般にはスタイルシートと呼ばれます。
HTML内に記述されたタグの属性(付与情報)として指定したり、STYLEというタグを使ってHTML内にまとめて指定することができます。HTMLから切り出して別ファイル(.css)にまとめてしまい、ファイル全体をHTMLに読み込ませるといった指定もできます。
Webエンジニアとしては、最低限の構造を把握しておく程度でも良い場合が多い分野です。色の指定などができると開発効率が上がったりする効果が期待できますが、一般公開する様な美しいデザインに仕上げようと思うと、それなりにデザインについて学ばないと難しく、ある程度の規模のソフトウェアであれば、それはデザイナーの仕事になるでしょう。
JavaScript
JavaScriptとは、ブラウザ側(クライアントサイド)で動作するスクリプト言語です。HTMLのタグに対する操作だけでなく、Webサーバーと動的な通信を行ったり、タイマー制御ができるなど、ブラウザ上のプログラム言語と表現できるくらい強力な言語です。名前が類似した言語にJavaというものがありますが、JavaScriptとは全く違う言語で、Javaは紛れもなくプログラム言語で、主にスマートフォンや後述するWebサーバー上でWeb以外を含めたソフトウェア全般の制作に使用されます。
JavaScriptはWebエンジニアの領域で、Webサイト上での様々な動作や制御を実現するために利用します。例えば、画像をクリックしたら拡大表示されたり、何かのボタンを押して画面の情報に変化があるといったものは、JavaScriptで動きを付けることになります。
サーバー
サーバーは、要求に対してサービスを提供するコンピュータまたはソフトウェアの事を指します。Webの分野では、必ずブラウザからの要求に対して応答するWebサーバーが必要になります。
Webサーバーという言葉はややこしいのですが、そのままだとコンピュータとソフトウェアの2つの意味を持った言葉です。Webサーバー(ソフトウェア)が動いているコンピュータの事もWebサーバー(コンピュータ)と呼びます。
Webエンジニアは、コンピュータ・ソフトウェア両方のWebサーバーを利用することになります。
Linux
現在では、WebサーバーのコンピュータにはLinuxというOS(Operating System)がよく使われています。Windowsサーバーも存在しており、一部企業やサービスなどでは使われ続けているようですが、今回は扱いません。
Webエンジニアは、自分でLinuxのコンピュータを準備することもあれば、ネットワークやサーバーエンジニアが準備してくれることもあります。まずは、最低限どのような流れで準備するのかを知っておくと良いでしょう。
LinuxというOSは、ディストリビューション(Distribution)という形態で提供されています。ディストリビューションは、Linuxの基本構造の上にどのようなソフトウェア群が載せられているかという違いの他、無償・有償やサポートの有無など、提供元によって様々な差別化が繰り広げられています。類似した派生物も多く、IT現場ではRedHat系(CentOSなど)かDebian系(Ubuntuなど)を見かけることが多いです。
Apache
Webサーバーのソフトウェアの代表といえば長い実績を持つApache(アパッチ)が挙げられます。Linux上で使われることが多いですがWindows用もあります。Windows上では、MicrosoftからIIS(Internet Information Server)というWebサーバーも提供されています。今はApacheの問題点を改善したNginx(エンジンエックス)がシェアを伸ばしている状況です。
コンピュータにOSのLinuxをインストールした後、Linux上のコマンドでApacheをインストールして動かせば、ブラウザでつないでWebサイトを見るための最低限の環境が整うという流れなので、パソコンやスマートフォンにアプリをインストールするイメージと思えば理解しやすいでしょう。ただし、インストールはコマンドを入力して行うのが一般的で、ある程度知識が要求されます。
Webエンジニアは、Apacheのインストールや設定も行うことが多いですが、サーバーエンジニアがいるような大規模なプロジェクトの場合は、用意されたWebサーバーを使うだけで済むこともあります。最低限、Linuxからのインストール方法や、動作させるための最低限の設定などを知っておくとよいでしょう。
サーバーサイド
Linux上で稼働しているApacheなどのWebサーバーに配置することで、サーバー上の資産であるデータベースを活用したり、ユーザーの要求に合わせて動的なHTMLを生成するプログラムや、その周辺分野を合わせてサーバー側やサーバーサイドとまとめて呼称することがあります。
Webエンジニアの担当区分としては、Webサーバーが直接管理しているプログラムや静的コンテンツを中心として、プロジェクトの規模や参加人員によってはデータベースなども含まれることがあります。
クライアントサイドの言語がW3Cが策定しているJavaScriptというスクリプト言語だけなのに対して、サーバーサイドで使われる言語はいわゆるプログラム言語なため、幅広い選択肢があります。よく利用されるプログラム言語としてはJava、PHP、Rubyなどが挙げられます。
最初は、複数のプログラム言語を扱うことよりも、一つのプログラム言語で「出来る事」を増やしていくことに注力した方が早く活躍できるようになるでしょう。どこまでその言語を深く研究していくかは、その後の自分のキャリアや参加プロジェクトなどから追って検討していきましょう。
学習の順序
Webの技術は複数の分野で構成されているため、どのように学習を進めていけば良いか迷う人もいるでしょう。冒頭でもお話したように、最初は全体像を認識することを意識して、一通り触ってみることをオススメします。
全体像の認識を目的とした場合の学習の場合、あまり順序は重要ではありませんが、環境の準備の観点からフロント～サーバー～サーバーサイドと進めていくのが効率がよいでしょう。
このシリーズでは実際の作業や設定、プログラムコードなども交えながら、一通りWebの世界を駆け抜けていきます。
出来る事が増えるのは楽しい!
学習を進めていくと、技術の世界がどのような構成になっているのか見えてきます。すると、これまで触れ合っていたソフトウェアなどの見え方も変わってくるはずです。
便利なソフトウェアがどのように作られているのかが分かり、それが個人で、しかも無料で作れることが分かった時、私はパソコンがお金の製造機に見えたものです。エンジニアはパソコンと知識(技術力)さえあれば、無から有を作り出す夢のある製造業ともいえます。
技術の進歩が激しく、どこまでも勉強が終わることがない分野ですが、エンジニアとして活躍するためにすべてを覚える必要はありません。全体の構造を把握して、「何を調べればよいか」が分かるようになれば、後は経験を積み上げていくだけです。是非このシリーズを通して、Webの世界への興味を自分の技術力にしてもらえればと思います。
