Git Product home page Git Product logo

190730_frontend-trending's Introduction

フロントエンドエンジニアなんでそんなに飽きっぽいのか問題

hinagataシリーズ

  • クライアントワーク(HTMLファイ部)では、とにかく新規プロジェクトの作成が頻繁。(肌感、8案件/月くらい?)
  • 毎回ゼロから環境構築をしてると頭が追いつかないので、自分の場合は開発環境だけいれたプロジェクトを作っておいて、新規作成時に都度コピーする形をとっている(hinagataシリーズ
  • 以降、その更新ログをかいつまんで、自分の入社以後のフロントエンド技術の変遷を見てみる

フロントエンド技術の変遷

  • 2013/4: 生のhtmlとjavascriptをごりごり書く・scssがどうにか導入されて、ファイルを分割して分担して書けるようになったぞーやったー
  • 2013/10: grunt.jsというのをつかうとjsとかhtmlも一緒に生成して効率化できていいらしいぞ。便利や。
  • 2014/1: gulpというやつのほうがgrunt.jsより便利らしいからこっち使おうかな。開発環境ぜんぶ刷新するね
  • 2015/4: es2015すごい!javascriptの嫌なところだいたい直っとるやんけ。babelというのでトランスコンパイルして普通のjavascriptに直す必要があるのねーgulpの設定変えなきゃ。閉じタグ書きたくないからHTMLはpug使うね。
  • React使うと画面遷移でjsで管理できてすごい!今後はこれだなーまたgulpの設定直さなきゃ。
  • Reactと似たようなもんだけどVueの方が洗練されてて便利だなー。またgulpの設定直さなきゃ。
  • 気がついたらgulpぜんぜんメンテナンスされてないや…今後はwebpackでビルドしたほうがいいねー開発環境つくりなおすね
  • だいたいいつもVue使ってるからvue-cliで環境構築するほうが早そうだ!webpackの開発環境自分で作らなくていいんだねー開発環境つくりなおすね
  • いろいろ考えるとvue-cli使うよりNuxt.jsで全部の環境用意するほうが早い!開発環境つくりなおすね
  • TypeScript使いたいなって思うとやっぱりVue.jsよりReactの方が相性いい気がしてきた…Next.jsというの使うとNuxtと似たようなこともできるしこっちに乗り換えるか。開発環境つくりなおすね
    • ★イマココ

どうしてこういうことになるのか

フロントエンドに任されている責務の変化

  • 太古の時代、Webフロントは「マークアップ」と呼ばれ、デザイナーが兼任することがほとんどだった。
  • Webでできること自体が増えてきた結果、Webサイトの開発に大規模な設計が必要なことも増えた
  • 言語(javascript)・プラットフォームに求められる役割自体が大きく変化。その結果、直接手で書く領域を減らしたり、ゆるくてよかったところに強い規約を付けられる開発環境が優位性を得るようになった。
  • ex) mizchi氏の登壇資料: Real world es201x and future

フロントエンドの開発環境ツールはぶっちゃけつくるの全然難しくない

  • HTML・CSS・JS自体がメモ帳でも書けるくらいのゆるふわ技術で、前提になる物的リソースやライブラリがぜんぜん少ない。それを効率化するツール・フレームワークも簡単なテキスト処理の範疇→後発がどんどん出てくる
  • 理系スキルというより文系的・詩的なスキルが必要(Web開発・Webサイトというものをどう抽象化するか。grunt/gulpとか、React/Vueとかはそういう**の違い)

とにかく外部刺激が多い

  • Webフロントエンジニアは、他職能との関わりが一番多い(当社調べ)
    • 先述のようにデザイナー出身の人も多いし、サーバーと連携したりそのためにWeb基礎をしっかり知っておく必要があったり、表現面ではフロントエンドつながりでUnityが代替になったりシェーダーを共通で考えたり…etc

飽きっぽいと何が起きるか?

  • 古いプロジェクトを引きずり出して改修するのが非常に困難になる
    • 当時の価値観で完璧なコードを書いたとしても5年後には誰も読めない…みたいなことが起きる
    • そういうタスクが古残に偏りがちになったりする
  • 性質的に、Webフロントという職能に飽きっぽい人が集まりやすい
    • →人員計画がよくわからないことになる

まとめ

  • Webフロントは業界的に求められる役割が大きく変化し、それに伴って周辺技術も大きく変化。人材もそれに耐えられる飽きっぽい人が生き残った。

宣伝

  • この資料は、自然なmarkdown文書をそのままスライド化するsector-slideの提供でお送りしています。
  • いまのおすすめhinagataはhinagata-nextなのでよかったらつかってね。

190730_frontend-trending's People

Contributors

fnobi avatar dependabot[bot] avatar

Watchers

James Cloos avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.