フロントエンドから見た
 Web制作の変遷
 （2022年版）
 2022/8/27　まぁし（知念）


知念 昌史 / まぁし@chocodogmagic
 TAMのフロントエンドエンジニア 兼 個人事業主
 ● 沖縄でリモートワーク/元・美容師
 ● Twitterスペースで平日9時からWeb情報発信中
 ● 技術コミュニティ運営
 ○ PWA Night（東京）/ v-okinawa（沖縄） 
 ● ものづくりが好き
 ○ イラスト、ゲーム、アプリ、漫画、小説 
 ● ベテランポケモントレーナー（新作発売楽しみ）
 ● スプラトゥーン3期待（2のウデマエS+）


これまでのWeb制作を振り返り


注意：僕の観測範囲です
 ※東京の大手〜中堅規模の会社が委託するWeb制作
 数年のずれや自分の環境は違うという
 意見も貴重ですのでぜひ共有を！


PC/モバイルのみ〜 
 スマホサイト増加
 2008年iPhone発売
 2010
 2012
 レスポンシブウェブデザイン 
 HTML/CSS/jQuery 
 Pug(Jade)/EJS/Sass 
 Grunt / Gulp（タスクランナー） 
 徐々に素のHTML・CSSを書かなくなる 
 2013
 Angular(1系)
 /React/Vue.js
 jQuery
 VS
 JSライブラリ
 2015
 徐々にjQueryを
 使わなくなっていく
 ECMAScript 2015
 新しいJavaScript
 2016
 Next.js/Nuxt登場
 Angular(1系)が消える 
 Webアプリが増加
 PWA登場
 2018
 WordPressの
 立ち位置が変化
 Jamstack
 ヘッドレスCMS
 2019/2020
 大規模サービスの事例 
 React/Vue.js
 バージョンアップで
 高機能に


2022年



 ● HTML/CSS/jQuery → 新規ほぼ0だが 運用はまだある
 ------------------------------
 ● Pug/EJS、Sass（Gulp）
 ● JavaScript（ES6〜）
 ------------------------------
 ● 今後はNext.js/Nuxt？
 ● Jamstack
 WebサイトかWebアプリ（Webサービス）で2極化
 
 ● React or Vue
 ● Next.js or Nuxt
 ● コンポーネント開発
 → 普通のHTML書かない
 → Gulp使わない
 → TypeScriptが基本
 Webサイト
 Webアプリ/Webサービス 
 Build必要
 Build必要
 Build必要
 パターンが別れる 黎明期が続く 制作パターン が固定化

お客さん（クライアント）のスキル変化
 ● 2010年頃、制作はほぼ制作会社へ丸投げも多かった
 ○ HTML無理・プログラムわからない 
 ● 2015年頃、お客さんがHTMLを知っている・書ける
 ○ HTMLならいける、Gulpは無理（PugやSassどうする問題 → 納品後は使えない） 
 ● 2018年頃、お客さんの社内に開発メンバーがいる
 ○ GulpなどタスクランナーもOK、開発環境ごと納品してほしい 
 ○ タスクランナーの使い方をレクチャーしてほしいという需要 
 ● 2020年頃、お客さんの開発チーム体制が整い始める
 ○ デザイン・HTMLは内製・Gulpも使っている、ReactやVueはまだ扱えない 
 ● 2022年は？
 ○ Next.js/Nuxtで納品OKというところも少しずつ増えてきた。 
 ○ gulpはいけるがReact/Vue.jsは無理という状況は2015年頃のgulpと似ている 


海外の流行から2〜3年遅れで
 日本のエンジニア間で主流になる


さらに5年以内くらいの数年遅れで
 制作会社に依頼するような会社にも
 普及する


時代に合わせた開発をしていきましょう


ありがとうございました！！！
 TAMで一緒に働く仲間を募集しています！
 Twitter まぁし@chocodogmagic
 フォローしてね！！
 PWA Night
 毎月第3水曜 イベント開催中！
 平日9:00〜
 Web情報発信中！