フロントエンドディベロッパーの仕事とは?具体的にどんなものを作る?

frontend programmer
Photo by Kelly Sikkema on Unsplash

ウェブサイトやウェブアプリケーションをカッコよく、使いやすくするのがフロントエンドディベロッパーの仕事です。

私がプログラミングを始めた7年前は、企業のウェブサイトを作るのが
フロントエンドディベロッパーの仕事だと思っていましたが、
色々な会社で働く中でフロントエンドと言っても、色々なものを作るんだということに気が付きました。

例えば、

  • オンラインショップ
  • 携帯電話会社の申し込み専用のサイト
  • オンラインゲームを配置するためのサイト
  • 金融関係会社でお金の出入りを把握するためのウェブアプリケーション

などなど、

最近はウェブサイトというより、ウェブアプリケーションを作ることが多いです。
今までエクセルで把握していたものをもっと使いやすいものにして
ウェブ上で把握する、とか
情報をただ載せるだけではなく、今は会社とお客さんが双方向にやり取りするためのツールに変わってきていると感じます。

カッコよく、使いやすくするためには、それを可能にするデザインとUX
(User Experience-使い手のことを考えてより使いやすくする技術)
が必要です。
それは大抵の場合、UXデザイナーから受け取って、私たちディベロッパーがコードを書きます。

私はディベロッパーになる前にDTPオペレーターをしていましたが、
フロントエンドディベロッパーと少し似ているかな、と思います。
DTPオペレーターの場合、デザイナーが作ったアイデアを紙媒体で形にしますが
フロントエンドディベロッパーはデザインを、ウェブ上に再現します。

コードを書けないといけないので使われているプログラミング言語を知っていないといけないのはもちろん、
デザインやレイアウトのズレを感じる感覚と
そのアプリケーションをより使いやすいものにするためにどうしたらいいか考えることが必要です。

世界中のかっこいいサイトを見て、どういう風に作られているか見てみたりすると
いい勉強になります。アワードサイトは今かっこいいと言われているサイトが見られます。
(日本語サイトもあります。)
https://www.awwwards.com/

フロントエンドディベロッパーになるために必要なプログラミング言語は
HTML、CSS、そしてJavascriptです。

Javascriptと言えば、どのJavascriptのフレームワークを使ってるのかも重要です。
フレームワークとはウェブの大まかな枠組みを作る手助けをしてくれるものです。

フレームワークを使うと

  • 複雑なものが、Javascriptを使うよりも短時間でできる
  • コードを管理しやすく、他の人が見てもわかりやすい
  • アプリケーションがデータを読み上げる時間を短くできたり、パフォーマンスが良い。

などの利点がたくさん。Javascriptの基本を知ることは必要ですが
Javascriptそのものより、フレームワークを勉強する方が難しくないです。

使われているJavascriptのフレームワークは
会社によって、プロジェクトによって変わります。
私がプログラミングを始めた頃は、jQueryが主流でしたが
その後、Angular 1を使う会社から、ここ5年くらいはReactを使う会社で働いてきました。

プログラミングは新しいものがどんどん出てくるので
常に学び続ける、という楽しさがあります。
それと同時に知らないことばかりだと思うと、呆然として、もうプログラミングなんて
無理なんじゃないかと思う時もありますが、
2年、3年、5年と続けていると、少しづつ経験が自分の知識になって、自信がついてきます。