Javascriptって結局何ができたらいいんですか？っていう話

若干釣り感のあるタイトルになっちゃうんですが、面接とかするとこんな質問を結構聞きます。
いわゆる一般的なフロントエンドエンジニアの要求スキルセットとかは https://roadmap.sh/frontend のようなものを見ればいいと思うんですが、たぶんもっと根本的な実感のなさというか、ふわふわした不安感からくる疑問なんだと思います。

いまはコーダーもJavascript書けないと話になんないような風潮もあってとりあえず勉強するんだけど、ゴールが見えないのでどんだけやったらいいのかわからないというか。
今回はそんな、

これから制作会社に入ってホームページ作る仕事をしたいです！
jQueryとか使ってスライダー実装したりはあるけど、転職のときにJSできるって言っていいのかわからんです！
勉強はしてるつもりだけどいまいちJavascriptおまかせください！と主張できないサイドスリーの若手社員。

というような人向けに書きます。
「いまだにmeta要素のkeywordsを設定したがるお客さまにやんわりNOと伝えたい話」とどちらにしようか迷いました。

前置き：
弊社では、企画・デザイン・コーディング・CMSの設計や組み込み・外部システム連携・保守運用などウェブサイト構築全般について承っておりますが、ネイティブアプリの開発などは取り扱っておりません。
また、大規模ウェブアプリ構築もしていないので、フロントエンドへの要求はそこそこです。モダンで先進的であることよりも、安定性が重視されます。

Javascriptに求められていること

サーバー側でできないことやしたくないことやしなくていいことはだいたい求められます。
最近はアニメーションをcssに任せるようになってきて、見た目の動きがどうこうというより、DOMの操作やデータの取り扱いがメインのような気がします。

つまり、どういうことをサーバ側でやれる（やるべき）かがわかっているとよくて、そのためにはサーバー周りの設定やPHPの知識があるとより説得力があります。
サーバー側で本来できるけどやらないケースでいうと、CMSサーバは秘匿されていて公開サーバはプログラムを動作させられない案件などが結構あるので、WordPressとかなら比較的簡単に実装できる検索やページングといった機能をあえてJavascriptでできるとよかったりします。見た目は地味ですが。

逆に、すごいぐにょぐにょ動く！フロントエンドで色々やってる！感のある、動きのあるポートフォリオを見ても、この人しっかり書けるなあという印象はあまり持ちません。
DOMの操作を行うにあたっては構造のきれいなhtmlや、適切なcssが書かれている（親子関係に依存しないコンポーネント化ができているとかそういう）ことが重要なので、そういう意味ではJavascript自体のソースよりも、操作しやすそうなhtmlが書けていると、実務に則した経験値が感じられます。
また非同期通信を行うときなどに、コールバック地獄にならない書き方をしてると、ちゃんとしてる感があります。

Javascriptを書く人に求められていること

お客さんが動いてほしいと思ってる環境で、理想の80～120％の挙動が実装でき、それが説明できることです。
どんなライブラリやフレームワークが使われてるとかはあんまり関係ないです。
社内的には、読みやすく、なんでそういう書き方したかわかるコードが書けるといいです。

まず要求に対してどんな実装をしたか、あるいはするつもりか、言語化できることが重要だと思います。できないことはできないと言える勇気と根拠も必要です。常に完璧に言われたとおりを満たすことはそこまで求められません。実際フロントエンド環境というのはユーザーごとに違うので、誰がやっても無理ということはままあります。これはできるけどこれは無理とか、代わりにこういうことならできるとか、説得力のあるコミュニケーションをとれることが大切です。

jQueryだけじゃなくVueやReactを学んだことがあるというのはあまりアドバンテージになりません。（実務で実装した例があれば別ですが）
書籍やチュートリアルでは、実務でよくある実装パターンとか出てくると思うんですが、進研○ミの漫画よろしく「これ、あのサイトで見たやつ…！」とピタリ当てはまるケースはそう多くないものと思います。

拾い物のコードでコピペ実装するにしても、どこからどこまでコピペして、不要なところを省いたか、要件にあてはめて適切に書き換えたかというのは非常に重要な評価のポイントになるんじゃないでしょうか。
多くの同業者が可及的すみやかに退場してほしいソフトウェアNo1にあげると思われるIEですが、残念ながらまだ使われています。最近はなにか調べるたびにIEで動かないコード例が沢山ヒットしますが、そういったものを適切に書き換えることができる力も必要です。
また開発中は必ず（コードをコピペしてきた場合は特に）エラーが出るものなので、エラーメッセージやリファレンスを読んで解決できることが非常に大事です。

そういったようなことを考えたとき、重要なのは結局のところ入門書に書かれているような基礎的な知識です。
基礎的な知識が抑えられているというのは、例題の挙動が実装できているということではなく、概念を自分の言葉で説明できたり、単語を適切に使用して会話ができるということだと思います。

jQueryってどうなん？オワコン？

弊社ではCMSの組み込みだけ担当するケースも多く、他社制作のコーディングを目にする機会が多いのですが、まあオワコンな感じは全くないので安心して習得したらいいと思います。ただし初学者はなんせコピペになりがちなので、コピペしたソースはちゃんと読んで何がどうなってるのか理解する癖はつけたほうがいいんじゃないでしょうか。

jQueryに限らずライブラリやフレームワークが採用される理由は色々あると思いますが、その使う理由が自分なりに説明できるならそれでいいと思います。
ただ「jQueryじゃないと実装できないから」ということであれば学習の妨げになっている恐れがあるので、無理にでも使わない実装を考えてみてもいいかもしれません。
実務では時間が限られてるので無思考でとりあえずCDNが突っ込まれていることはままあります。なんなら突っ込まれたまま最終的に使われていない案件も見たことあります。すでに導入されている環境であえてjQueryオブジェクトを使わないようにする意味はなく逆に可読性も下がるので、ちゃんと使う必要があります。

よって人の書いたコードを触る機会が一切ない人以外は、いまのところ習得は必須です。
ただまあ、以前はとにかくなんでもjQueryだったのが、小中規模のコーディングでは採用されないことも多くなってきたというのも事実ですね。

まとめ

さて、タイトルの「Javascriptって結局何ができたらいいんですか」っていう話ですが、募集要項的な観点でいうと、ちょっと身も蓋もないんですが実務経験のない人がJavascriptのスキル如何で採用されることってないので、気にしてもしょうがないです。またこの質問が出てくる時点で「そんな得意じゃない」感が演出されるので、面接とかでは心にしまっておいたらよいでしょう。
通常のウェブサイト制作という点ではあくまでブラウザ上での動作が前提になるので、上述のroadmap.shに挙げられているようなスキルが全部必要かというと、そんなことはないと思います。自分が実装したアプリケーションについて要点を語れることが重要です。

実務上、自分のスキルに不安があってこういうことを考えてる場合はたぶん実装を任された経験が少なく、よって実装を任されないということは往々にしてあると思います。実案件がないなら誰かが作ったものの焼き直しでもいいので、自分なりに考えて作ってみるのがいいでしょう。
結局、できる人・経験のある人に案件は集中するので「そういうのやったことある」例を増やしていくのが一番はやいんだと思います。

作ったものについて、コードの説明ができるようにしておくことも忘れずに。

採用情報

サイドスリーではわりといつでもJavascript書ける人を募集しています。Javascriptはこれから頑張るけどhtml/cssならやれますという人も募集しています。