Work guide
Webエンジニアとは、パソコンやスマートフォン・タブレットなどのデバイスからアクセスするWebサイト・Webアプリケーションを開発するエンジニアです。インターネット上に構築するシステムの設計・開発・運用・保守をおこないます。インターネットに関連するエンジニア、いわゆる「Web系エンジニア」の総称です。
ここでは、モバイルデバイスの普及などにより、必要不可欠となった情報インフラを整備する職業ともいえるWebエンジニアについて、わかりやすく解説します。
イベントの動画&レポートを公開中!ぜひチェックしてみて!
内容:
第一部 基調講演「技術の先の見通し方」
1:技術を点ではなく線でとらえる
2:何過去を知る~ページからパーツへ コンポーネント駆動開発の必然性
3:今を知る~キャズムの壁を超えている「React」「TypeScript」「Next.js」
4:未来を見通す~Create Application
5:それでも気になる、今注目の技術
第二部 ぶっちゃけパネルトーク
1:技術の話
2:ここだけの話
3:入社前後のよもやま話
一口にWebエンジニアと言っても、さまざまな業務形態があります。企業によっては、Webエンジニアという呼称はさらに細分化され、より専門性を持った業務範囲を担当することも珍しくありません。Webエンジニアには、具体的にどのような職種があるのかご紹介します。
主にWebブラウザやアプリケーションのインターフェース部分を開発するエンジニアが、フロントエンドエンジニアです。WebサイトやWebアプリケーションを利用するユーザーに、最も深く関わるエンジニアともいえます。
HTML、CSS、JavaScriptを駆使してWebサイトに動きを持たせたり、ReactやVue.jsなどのフレームワークが必要な環境でプログラミングしたりするのが、メインの業務です。
ユーザーがシステムを利用する際の「インターフェース(境界面)」の開発をするため、フロントエンド(前部)エンジニアと呼ばれます。
(関連リンク:フロントエンドエンジニアの仕事内容とやりがいは?キャリアアップのために勉強したい4つのことを解説!)
(関連リンク:フロントエンドエンジニアに必要なスキル6つ!長く生き残っていくためには?)
バックエンドエンジニアは、その名の通りユーザーの目に見えない裏側のシステムを開発するエンジニアです。サーバーサイドエンジニアとも呼ばれます。 ApacheやNginxのようなサーバーの構築から、MySQLやOracleなどのデータベースの構築、JAVAやScalaなどを用いたプログラム開発まで、業務範囲は広めです。もちろんシステムの要件定義や仕様書の作成、システムテストも含まれます。
実際の業務を行う場合、バックエンドエンジニアは、クライアントの業界知識の習得が必須になります。金融業界、物流業界、不動産業界……Webアプリケーションを構築する上で、システムを利用する業界特有の単語が頻発するので、プログラミング言語とは全く違った勉強が必要になりますので注意しておきましょう。
バックエンドエンジニアはプロジェクトの根幹を支える、なくてはならないポジションです。
フルスタックエンジニアとは、アプリケーションの設計・開発・運用を一手に担うマルチなエンジニアです。フロントエンドエンジニアとバックエンドエンジニアをこなすハイレベルなエンジニアといえます。マルチエンジニア、万能エンジニアとも呼ばれます。
分業することが難しいベンチャー企業やスタートアップ企業で特に需要があります。大手企業ではプロジェクトマネージャーやディレクターとして就業することのほうが多いでしょう。
モバイルエンジニアとは、スマートフォンやタブレット端末で動作するアプリケーションの開発を行うエンジニアの総称です。Webエンジニアという定義に包括される場合もありますし、純粋にモバイル端末向けのネイティブアプリケーションエンジニアを指すこともあります。ここでは、モバイル端末向けのWebエンジニアをモバイルエンジニアと呼びます。
Webに特化したモバイルエンジニアの具体的な業務の一例として、React NativeやExpo、Flutterなどのフレームワークで、HTML5、CSS3、JavaScriptに加えPHPやJSPと組み合わせたWebアプリケーションを開発・運用することが挙げられます。iOS用アプリとAndroid用アプリをワンソースのJavaScriptで開発することで、開発者は、JAVA、Objective-C、Swiftなどの言語の習得が不要になります。
JavaScriptやPHPに慣れたWebエンジニアにとって、モバイルエンジニアになるのは比較的敷居が低いので、転職の選択肢としてはおすすめです。
PCやモバイルのWebブラウザからアクセスするアプリケーションを開発します。Webアプリケーションの形態は多様で、ブラウザゲーム、ECサイト、CMSなどもWebアプリケーションに分類することが可能です。利用するユーザーからのリクエストに応じて、サーバー上で処理したデータを返答する仕組みをまとめてWebアプリケーションと呼びます。
Webアプリケーションエンジニアが開発でよく利用する言語は、PHP、Ruby、JSP、C#.NETなどです。もちろんこれに加えてHTML5、CSS3、JavaScriptの技術やクロスブラウザの知識も必要になります。
WebプログラマーはWebアプリケーションエンジニアの策定した要件や仕様に沿って、プログラミングをする職業です。エンジニアの中でも特にプログラミングに特化したポジションといえます。
使用する言語は上流工程で決定されたものを使うため、プロジェクトによって左右されます。PHP、Rubyなどがメジャーですが、AI領域が盛んになってから需要が高まっているのがPythonです。ディープラーニング・機械学習をWebアプリケーションで実装することも注目されています。
できるだけ多くのプロジェクトに対応するために、複数の言語を習得するのもおすすめです。もちろん1つの言語を極めることも大事ですが、仕事の幅を広げたり、生涯プログラマーとして安定した収入を得るための「保険」として、数種類の言語を習得しておくことも考えておくべきかもしれません。
Webエンジニアは使用する言語によって、JavaScriptエンジニアやPHPエンジニアと呼ばれることもあります。よく求人情報には「Rubyエンジニア募集」のように掲載されます。
Pythonエンジニア、Javaエンジニアなどの求人に応募する際には注意が必要です。Webアプリケーションに限らずネイティブアプリケーションの開発を募集している場合もあるので、応募要項をよく読むようにしてください。
Webエンジニアの仕事は大きく以下の3つに分類できます。
この3つについて解説します。
要件定義とは、開発工程の準備段階においてアプリケーションのゴールを明確にし、具体的な開発の進行方法や実装方法を確定する工程のことを指します。
一般的にはまずアプリケーションの全体図を決定し、次にそれを構成するパーツごとの詳細の構成図(設計図)を書面に書き起こしていきます。
個々のパーツで実装不可能なことがあったり、全体図との矛盾が発生したりすることがあるので、都度全体図を再度見直していく反復作業が発生することもあります。
コーディング段階で時間をかける必要が無いように、より細かくモジュール単位・クラス単位で設計しておくことが重要です。
要件定義とスケジュールが決まったら、開発・コーディングフェーズに入ります。
システムエンジニアを経験すると分かりますが、プログラミングにかける日数はそれほど長くはありません。20日間のプロジェクトであれば3~4日くらいです。
Webエンジニアはプログラミングだけできればよいわけではありません。開発の前段階の要件定義、詳細設計のクォリティによって、コーディングのスピードや品質は影響を受けやすい傾向にあります。実際の業務ではコーディング自体よりも、要件定義に重点を置くことのほうが多いというのが実情です。
保守・運用は、アプリケーションができあがってからのメンテナンスや不具合解消を行っていくフェーズです。開発段階でテストケースに入らなかったり、事前に認識できなかったりしたエラーを潰していきます。
アプリケーションのリリース後は開発チーム以外の不特定多数のユーザーが操作するため、未知の不具合やエラーは必ず発生します。一つ一つに対処することでアプリケーションの精度・品質を向上させていくのです。
Webエンジニアの年収の相場は400~600万円です。使用する言語によってばらつきがありますが、大抵の場合は400万円以上だと考えてよいでしょう。
就業する企業の規模や業務内容、経験年数によっては1000万円を超えることもあります。大手企業でプロジェクトマネージャー以上の管理職であれば十分に実現可能な金額です。
ベンチャー企業やスタートアップ企業では400万円を下回ることもよくありますが、資金面で体力のある企業では、経験の浅いエンジニアであっても400万円を超えるのが一般的です。
Webエンジニアにはさまざまなスキルが要求されます。プログラミングはもちろん、サーバーの知識、データベースの知識、セキュリティに関する知識なども必要です。
多岐にわたる分野に精通することで、Webエンジニアとしての価値が上がります。必要とされる人材になるためには「浅く広く」でもなく「深く狭く」でもなく、「深く広く」スキルをつけることが有効です。以下に紹介するスキルについて、日々アンテナを張り、探求心を持っておくことをおすすめします。
Webエンジニアにとってプログラミングスキルは必要最低限のスキルです。プログラムが書けないと、まずエンジニアにはなれません。
プログラミング言語を複数習得する必要は必ずしもありませんが、どの言語にも対応できるように備えておくことは非常に重要です。たとえばJavaのスキルを磨く際には、Javaの文法を単に覚えるのではなく、プログラミングの本質を把握することを意識しましょう。
プログラムがどのように動作するのか、コードのフローやデザインパターンがどうなっているのかなど、汎用的な視点を持ってコーディングに接するべきです。自然と別の言語にも対応できるようになり、少しの勉強量でも習得するスピードが格段に上がります。
特定のプログラミング言語自体の知識も大事ですが、そもそもコンピューター言語の1つに過ぎないことを忘れないようにしてください。
幅広く業務をこなすためには、もちろん多言語を習得すべきです。Webエンジニアとして生涯生計を立てていくのであれば、流行り廃りにも柔軟に対応できるよう、応用が利くようにしておきましょう。
とは言え、どの言語から始めたらよいか分からない方のために、別記事でまとめてありますので、こちらを併せて参照してみてください。まずは1つの言語に集中して習得すると良いでしょう。余裕ができたらフレームワークやデザインパターンなどについて深堀りしてみてください。
(関連リンク:Webエンジニアが学ぶべき言語15選!今後ニーズが拡大するのは?)
サーバーやOSの選定もWebエンジニアの仕事の1つです。要件定義の段階でアプリケーションに合ったツールを選びます。
サービスの規模によってオーバースペックであったり、ロースペックになったりしないよう、サーバーを決める必要があります。サーバーを稼働させるOSはオープンソースのLinux系を利用するのが主流です。
主にバックエンドエンジニアが得意とする分野ですが、知っておいて損はありません。フリーランスで仕事をしていると、企業サイトの新規構築を依頼されることがあります。作成するサイトの置き場所(サーバー)を決めるのも仕事になります。
自社開発のアプリケーションであれば、社内のPCをサーバーにすることもありますし、AWS(Amazon Web Services)などの外部のサービスを利用することもあります。メンテナンスの手間を省きたい場合にはレンタルサーバーを採用するのも良いでしょう。
いずれにせよ、サーバー・OSの選定の際に知識がないと対応できませんので、最低限スペック・コマンドラインの利用については把握しておきましょう。
Webアプリケーションとデータベースは切っても切れない関係です。
データベースは、ユーザーの入力した情報や投稿した記事などを格納しておく重要なツールです。データベースに保存した情報をフロント側に表示するような利用方法が挙げられます。
データベースには、階層型、NoSQL、リレーショナル型(RDB)などの種類があります。ここでは詳しく触れませんが、それぞれに特性があり、アプリケーションをどのように管理したいかによって利用するデータベースを変える必要があります。
簡単に代表的なデータベースを挙げますと、Oracle DatabaseやMySQLはリレーショナル型、MongoDBはNoSQL、IMS DBは階層型に分類されます。
たとえば階層型は、データの親子関係(階層関係)を保持するため、検索が高速なのが特徴です。一方リレーショナル型では、テーブル形式でデータを保存するため、複雑なリクエストが可能になります。
このようにデータベースの種類によって異なる特性があるため、アプリケーションをどのように管理すべきか方針を決めたうえで、データベースを選定するのが良いでしょう。
Webエンジニアにはセキュリティについても知識が必要です。個人情報の流出やサイトの改ざんなどに備えなくてはなりません。
セキュリティに関する知識は、バックエンドエンジニアはもちろん、フロントエンドエンジニアも知っておく必要があります。HTMLのフォームから個人情報を抜かれてしまうこともあります。
特にクロスサイトスクリプティング、SQLインジェクション、クロスサイトリクエストフォージェリなどは知識として必須です。以下に、簡単に解説します。
クロスサイトスクリプティング(XSS) | 攻撃者が悪質な(詐欺などに用いられる)サイトに誘導するリンクをWebサイト上に仕掛け、ユーザーがサイトを閲覧したときにスクリプトが実行されるようなサイバー攻撃のことです。ユーザーをフィッシングサイトなどに誘導して個人情報を盗むときによく用いられます。 |
SQLインジェクション | WebアプリケーションやWebサイトに対して、不正なSQL文を送ることでデータベースの中身を盗むときに使用されます。最も簡単な例では、ECサイト上のフォームにSQL文を入力してデータベースの中身を表示させるような手口です。 |
クロスサイトリクエストフォージェリ(CSRF) | 本来Webアプリケーションの外で実行できてはいけない処理を外部から仕掛ける手法です。被害にあうと、ECサイトで勝手にショッピングをされてしまったり、意図しないSNS投稿をされたりしてしまいます。 |
上に挙げたのは、ほんの一例です。これらのサイバー攻撃に備えるためにWebアプリケーション側で対策する必要があります。もし攻撃に合ってしまった場合は、企業に大きな損害を与え、信用失墜につながってしまいます。サイバー被害を未然に防ぐために、セキュリティの知識と対策は必ず身につけておくべきです。
Webエンジニアにとって、実はコミュニケーション能力が最も大切なスキルといえるかもしれません。プロジェクトはチームで行うことが多く、クライアントとの打ち合わせも多数開かれます。
要件定義の場面では、顧客からのヒヤリングで細かく希望を聞き出す能力が高いほうが、精度の高い仕様書が書けます。プログラマーとのやりとりでは、どういった実装方法になるのかを円滑に話さなければならない場面もあります。
Webサイトやアプリケーションは、エンジニア同士が話し合ってつくるものです。そのため、WebエンジニアであってもWebプログラマーであっても、コミュニケーション能力が高いほうが企業からも優遇される傾向にあります。
プログラミング言語自体が一種のコミュニケーション
経験上の話になりますが、コミュニケーション能力が高い同僚や上司、部下を見ていると、要件定義もプログラミングも上達が非常に早いと感じられます。
どういうことかと言うと、プログラミング言語は、日本語、英語などの言語(言葉)とかなり似通っていて、コンピューターとの対話で成り立っているものです。コミュニケーション能力が高いと、相手(この場合はコンピューター)の意図を汲み取る能力も高いのではないでしょうか。
既にWebエンジニアとして活動している方と、Webエンジニアになりたい未経験の方では、転職活動でアピールするポイントが少し違います。
既にWebエンジニアである方は、転職の目的を明確にしておく必要があります。間違っても前の職場のことをネガティブに言うことはやめましょう。また、転職に失敗しないように「これは譲れない」点などは正直に話したほうが後々のためになります。
業務経験がなくWebエンジニアに転向したい場合は、個人で作成した制作物を提示することが最も効果的です。そのためにポートフォリオサイトなどを準備します。
ポートフォリオには、制作した時間、使用したツール、使用言語、どういった点に配慮したかなど、明確かつ簡潔に説明できるように準備しておきましょう。要件定義書・詳細設計書を自分なりに書いてみたり、セキュリティにどのように配慮したかなどを説明したりすると、ライバルと差をつけられます。
また、経験者であっても未経験者であっても共通するのは、「なぜその企業なのか」をはっきり伝えることが重要だということです。
Webエンジニアのための転職の事前準備については別途まとめましたので、こちらを参照してみてください。
エンジニア業界は慢性的に人手が不足しています。今後もWebエンジニアリングが発展し続けるのは明確であり、将来性という点では、大いに見込みのある職種です。
報酬や給料も他の業界と比べると高い方ですし、何より努力次第で自分の好きなワークスタイルを実現できるというところが、Webエンジニアの魅力だといえるでしょう。
Webエンジニアのキャリアパスは多岐に渡ります。その中でも代表的なキャリアパスの例は以下の通りです。
エンジニアとして長く第一線で活躍する道です。フロントエンドエンジニアからモバイルエンジニアへ、バックエンドエンジニアからフルスタックエンジニアへなど、スキルを磨いて業務領域を広げることもあるでしょう。
社員として働き続けることはもちろん、経験と努力があれば、フリーランスや派遣、業務委託でも十分に生活できる賃金を得られます。実際、業界経験を積んでフリーランスに転向するエンジニアは少なくありません。フリーランスになることで、いつでもどこからでも仕事ができるようになります。
(関連リンク:フロントエンドのスキルを高めるためフリーランスと派遣と両立、横地建さんのワークスタイル)
エンジニアとしての知識やスキルを活かして、プロジェクトの進行管理やメンバーのマネジメントをしていく道です。技術的なスキルを持ったうえで、サービスの設計に大きく関わっていきます。エンジニアのキャリアパスとして、一般的な道のひとつです。
企業のエンジニアチームのリーダーとして、チームをまとめ、エンジニアを育成していく道です。チーム内で使う技術の選定に携わるのはもちろん、その企業のビジネス戦略に技術面から関わっていきます。高い技術力とマネジメント力を求められるポジションです。
エンジニアとしての知識を活かして他職種にキャリアチェンジすることも可能です。ITコンサルタントやIT系企業の営業職などがその代表例です。
Webエンジニアにおすすめの資格はズバリ「情報処理技術者試験(FE)」です。
情報処理技術者試験は国家資格で、エンジニアの基礎となるITの基本的な知識とプログラムの初歩を問われる試験です。難易度はそんなに高くないので取得しやすいでしょう。
ワンランク下に「ITパスポート試験(IP)」という資格がありますが、これはあまりおすすめしません。残念ながら、持っていても転職において、エンジニアとしての箔はつかないでしょう。
少し難易度が上がりますが、「応用情報技術者試験(AP)」もおすすめです。合格率は24%程度とかなり狭き門です。転職の際には胸を張って履歴書に書ける資格です。余裕がある方はこちらの応用情報技術者試験を取得してみてはいかがでしょうか。
少し長くなってしまいましたが、Webエンジニアの概要を記しました。覚えることがたくさんありますが、やった分だけ見返りのある魅力的な職業です。
Webの技術は衰えるどころかますます発達し続けています。将来、仕事を失う可能性も限りなく低いですし、給料も高めなのでおすすめです。
何より、努力次第でフリーランスでリモートワークができるのは魅力といえるでしょう。最近では、正社員や派遣のエンジニアでもリモートワークできる企業が増えています。スキル次第で自分にあった働き方を選べるので、今の働き方に疑問を持っている方にはおすすめできる職種です。
現在Webエンジニアとして働いている方は、スキルの幅を広げることで、さらに自分の望む待遇や働き方に近づくことができます。未経験でWebの世界に入りたいという方も、努力を続けることでフリーランスでも派遣でも生計を立てられるようになるはずです。
ぜひWebエンジニアとして自分の望む働き方を手に入れてください。
フルスタックエンジニア
吉村健一 さん
文系大学を卒業後、新卒としてシステム開発会社に入社。研修やOJTを受け、現在の土台となるスキルを身につける。JAVA、PHPをメイン業務として遂行していたが、激務から体を壊しフロントエンドエンジニアに転身。最も好きなプログラムはJavaScript。フロントエンド、バックエンド共に経験している自称動物大好きフルスタックエンジニア。
※この記事の情報は2022年04月01日時点のものです。
Career advice
転職のアレコレ。プロに相談したい方へオススメ!
最新のIT・Web業界動向を知るキャリアカウンセラーが行う
「キャリアアドバイス」
ある程度経験を積んだので次のステップにキャリアアップしたい、しばらくWeb業界を離れていたが再度業界に戻りたい、 未経験・経験浅めだがどのように転職活動を行っていったらいいかなど、ウェブスタッフでは様々なご要望に対応したキャリアアドバイスを行っております。
ウェブスタッフが運営するサイトでは、利便性向上・分析・広告配信等のためにCookie等のデータを使用しています。当社が取得したアクセスデータとの関連付けの削除(オプトアウト)に関しては「個人情報の取り扱いについて」をご覧ください。
同意して閉じる