職歴
一般社団法人フロントエンドカンファレンスアソシエーション
代表理事, Website: https://fec.or.jp/
フロントエンドカンファレンスを冠する、カンファレンスの運営や支援を目的とした法人です。
Next Experts (株式会社サイバーエージェント)
担当領域: クライアント・TypeScript
サイバーエージェントのDeveloper Experts制度におけるNext Expertsとして、サイバーエージェントグループへの技術支援や啓蒙活動を行っています。
また、対外活動としてカンファレンスへの登壇や企業スポンサー、Webにて執筆活動なども行っています。
Next Expertsになった経緯については、個人ブログのエントリをご覧ください。
CyberAgent group Infrastructure Unit (株式会社サイバーエージェント グループIT推進本部)
フルタイム, Website: https://it.cyberagent.group/team/ciu/
入社後1年半が経過し、WebフロントエンドのPlatform整備やイネーブリングのような業務にチャレンジしたく、社内転職制度でサイバーエージェントに帰任・グループIT推進本部に異動しました。
Cycloudというプライベートクラウドの、Webコンソールの開発に従事しています。
また、グループIT推進本部の一員として、スポーツ関連の事業部や化粧品関連の事業部、社内アプリ開発チームなどに対する、Web技術やTypeScriptを中心とした技術支援を行っています。
株式会社CAM (株式会社サイバーエージェント)
フルタイム, Website: https://cam-inc.co.jp/
サイバーエージェント入社後、出向の形で子会社配属されました。
配属後半年間は、Fensi Platform 開発チームにて、Vironの開発者陣にメンターをしていただきながら、管理画面向けのOSS開発を行っていました。
半年経過後はプロダクト側のチームに変わり、エンタメ関連のファンサイトのWebフロントエンドの開発に従事していました。
立命館大学 情報理工学部 情報理工学科
学士（工学）
画像・音メディアコース 卒業。
3年生で配属された音声言語研究室（山下研）にて、音声コーパス関連の研究 を行っていました。
学生時代に経験した、業務委託・インターンシップ
いくつかご紹介します。
tambourine.inc(Current Accenture Japan Ltd)
インターンシップ(2019/05 〜 2019/06) → アルバイト(2019/06 〜 2021/12)
Website: https://newsroom.accenture.jp/jp/news/2021/release-20211119
SalesforceやHerokuの知識をインプットしながら、新規事業向けのIaaS（GCP, AWS）の検証やWebフロントエンド関連のPoC実装、新卒向けの技術研修を行っていました。
また、技術顧問の方からお声掛けいただき、フロントエンドカンファレンス関西2019のスタッフとして運営に関わりました。
tambourineのアクセンチュアへのジョインが決まったタイミングで退職しました。
WinTicket Inc.
アルバイト
Website: https://www.winticket.co.jp/
CodemodとASTを用いた自動リファクタリングや、施策のPoC実装に取り組みました。
ElevenBack LLC
業務委託
Website: https://elevenback.co.jp/
CEOにお声掛けいただき、デザインやエンジニアリングを学びつつ、フリーランス向けのサービスの開発に携わりました。
Relie Inc.
業務委託
Website: https://re-lie.com/
AkinaiOne.inc
業務委託
Website: https://akinaione.com/
pixiv inc.
pixiv FACTORY, PIXIV SUMMER BOOT CAMP 2020
pixiv FACTORYにて、RailsフロントエンドとReactが混在するプロジェクトのリファクタや、新規機能追加を行いました。
DeNA Co., Ltd.
1dayのチーム開発イベントにて、Webフロントエンドの実装を担当しました。
DMM.com LLC
DMM GUILD 2019
GUILDインターンの2期生として、Webフロントエンド関連の技術的課題に対して、本部・石川支社の方々と連携して取り組みました。
コミュニティ活動
技術者向けコミュニティにおける登壇や主催です。
TypeScript Compiler APIとPHP-Parserを活用し、TypeScriptとPHPで型を共有する
プロポーザルを採択いただき、当日発表した資料です。
フロントエンドカンファレンス名古屋2026
アドバイザー兼コアメンバーとして、企画・運営に関わりました。
Website: https://fec-nagoya-org.github.io/2026/
Event URL: https://fortee.jp/fec-nagoya-2026
ブラウザの投機的読み込みと投機ルールAPIを理解し、Webサービスのパフォーマンスを最適化する
FEC名古屋のリジェクトコンで発表したLTです。
うわっ...私のSwagger、古すぎ...？grpc-gateway向けのSwaggerと向き合う
フロントエンドカンファレンス関西2025の学生支援スポンサーイベントのLTです。
ViteとTypeScriptのProject Referencesで 大規模モノレポのUIカタログのリリースサイクルを高速化する
Vue Fes Japan 2025のサイバーエージェントトラックでのスポンサーLTです。
フロントエンドカンファレンス東京2025
実行委員長として開催しました。400名が参加するカンファレンスとして、28名の方々にご登壇、11社にスポンサーとしてご支援をいただき、盛況のうちに終了しました。
Website: https://fec-tokyo.github.io/2025/
Event URL: https://fec-tokyo.connpass.com/event/352581/
歴代のWeb Speed Hackathonの出題から考えるデグレしないパフォーマンス改善
Event URL: https://browser-and-ui.connpass.com/event/362999/
CADC(CyberAgent Developer Conference) 2024
LP開発チームのテックリードとして、Webフロントエンドの開発に携わりました。
また、職域を超えてチームのマネジメントやLPとライブチャットのインフラ整備に携わりました。
Website: https://cadc.cyberagent.co.jp/2024
なぜクラウドサービスで Web コンソールを提供するのか
Slide: https://speakerdeck.com/shuta13/nazekuraudosabisude-web-konsoruwoti-gong-surunoka
Event URL: https://web-study.connpass.com/event/321711
5分でわかるPreactのVDOMで作るWebエディタ
Slide: https://speakerdeck.com/shuta13/5fen-dewakarupreactnovdomdezuo-ruwebedeita
Event URL: https://meguro-lt.connpass.com/event/316885
TailwindCSSでUIライブラリを作る際のハマりどころ
Slide: https://speakerdeck.com/shuta13/tailwindcssdeuiraiburariwozuo-ruji-nohamaridokoro
Event URL: https://megurocss.connpass.com/event/316265/
Web Speed Hackathon 2024
バックエンドとCanvas関連の作問に関わりました。バックエンドにHonoを用いてAPIを書きつつ、ReactアプリケーションをSSRしました。Canvas関連では、WebGLを用いてCSSのobject-fit: coverのような効果を実装し、デチューニングを施しました。
Repository: https://github.com/CyberAgentHack/web-speed-hackathon-2024
Event URL: https://cyberagent.connpass.com/event/300386/
codemodとうまく付き合うには
Slide: https://speakerdeck.com/shuta13/get-along-with-codemod
プライベートクラウドのコンソール画面をNext.jsのApp Routerでフルリプレイスした話
Event URL: https://cyberagent.connpass.com/event/301089/
Meguro.es
前任の fuya さんから引き継ぎ、主催を行っています。
Website: https://meguro.es/
Turborepo Code Generationによる、サイバーエージェントグループのフロントエンド開発の効率化
Event URL: https://uit.connpass.com/event/291443
CADC 2023 LPにおけるライブ配信の裏側
Slide: https://speakerdeck.com/shuta13/cadc-2023-lpniokeruraibupei-xin-noli-ce-momento-meetup-number-3
Event URL: https://momentocommunity.connpass.com/event/288796/
CADC(CyberAgent Developer Conference) 2023 LP
https://cadc.cyberagent.co.jp/2023/
Web エディタ開発を支える技術
Slide: https://speakerdeck.com/shuta13/technologies-for-developing-editors
Event URL: https://cyberagent.connpass.com/event/270629/
React Deep Dive
Repository: https://github.com/shuta13/react-deep-dive
Event URL: https://kc3.me/study/297/
天下一 静的サイトホスティング 武道会 / World Static Site Hosting Tournament
Slide: https://speakerdeck.com/shuta13/world-static-site-hosting-tournament
Event URL: https://tambourine.connpass.com/event/161708/
Vue + TSXでもCSS in JSしたい話
Slide: https://speakerdeck.com/shuta13/keyframes-of-vue-and-tsx-with-css-in-js
Event URL: https://kyotojs.connpass.com/event/154884/
OSS活動(コントリビューター)
開発者の間で広く用いられているOSSに対する貢献を行っています。
以下は本体にマージされ、リリースまで行われたPull Requestです。
Storybook
https://github.com/shuta13?tab=overview&from=2024-06-01&to=2024-06-06&org=storybookjs
webpack
https://github.com/shuta13?from=2022-12-01&to=2022-12-31&org=webpack&year_list=1
pmndrs
https://github.com/shuta13?tab=overview&from=2022-12-01&to=2022-12-31&org=pmndrs
https://github.com/shuta13?tab=overview&from=2021-12-01&to=2021-12-31&org=pmndrs
DefinitelyTyped
https://github.com/shuta13?tab=overview&from=2021-12-01&to=2021-12-31&org=DefinitelyTyped
https://github.com/shuta13?tab=overview&from=2021-12-01&to=2021-12-31&org=DefinitelyTyped
https://github.com/shuta13?tab=overview&from=2020-12-01&to=2020-12-31&org=DefinitelyTyped
https://github.com/shuta13?tab=overview&from=2019-12-01&to=2019-12-31&org=DefinitelyTyped
three-types
https://github.com/shuta13?tab=overview&from=2021-12-01&to=2021-12-31&org=three-types
mdn
https://github.com/shuta13?tab=overview&from=2021-12-01&to=2021-12-31&org=mdn
fastify
https://github.com/shuta13?tab=overview&from=2021-12-01&to=2021-12-31&org=fastify
OSS活動(コミッター)
自身が開発したOSSや、マージ権限をいただいてメンテナンスしていたOSSについてです。
moldable
https://github.com/CyberAgent/moldable
Node.jsとGoによるコード生成CLIです。サイバーエージェントグループのWeb開発に用いられています。
three-stdlib
https://github.com/pmndrs/three-stdlib
three.js に含まれるヘルパー群 をpmndrsでメンテナンスしつつ、TSで書き直したプロジェクトです。
create-r3f-app
https://github.com/utsuboco/create-r3f-app
React Three Nextという、Next.jsとReact Three Fiberを組み合わせたスターターを利用するためのCLIです。
Utsubo株式会社のOSSになる以前、開発者と共にメンテナンスを行っていました。
Bento
https://github.com/cam-inc/bento
Slate.jsを拡張したエディタ向けのプラグインです。
株式会社CAMにて、設計・開発・メンテナンスを行っていました。
pde.js
https://github.com/cam-inc/pde.js
Preact の差分検出処理を Editor.js のプラグインとして移植したソフトウェアです。
株式会社CAMにて、設計・開発・メンテナンスを行っていました。
詳細はMuddy Webでの発表資料をご覧ください。
執筆活動
npm をセキュアな挙動にするために .npmrc に記述する最小設定
https://zenn.dev/cycloud_blog/articles/5ce66daf4bd0cb
TypeScriptでCLIを作って学ぶAST
https://thinkit.co.jp/series/11870
CADC 2024 LPの舞台裏
https://developers.cyberagent.co.jp/blog/archives/50679/
CIUのWeb開発を支えるコード生成ツールをOSS化しました
https://developers.cyberagent.co.jp/blog/archives/48009/
Hono app with Docker, Kubernetes
https://blog.did0.es/entries/c0e07acb-44f4-45f0-9539-b210a6d6163f
renderToStringとhydrateを作って学ぶReactのSSR・SSG
https://zenn.dev/did0es/articles/b41d0de60934cc
CADC2023のコメント欄はMomento Web SDKを使って実現しました！実装コードも掲載あり！
https://developers.cyberagent.co.jp/blog/archives/42887/
新卒エンジニアで毎月LT会を開催してみた
https://cam-inc.co.jp/p/techblog/731757550625621172
Preactの差分検出処理を用いたライブラリによる開発体験向上の取り組み
https://cam-inc.co.jp/p/techblog/710053497071993899
それSWRじゃなくてgetServerSidePropsでいいよねっていう場面の話
https://zenn.dev/did0es/articles/cb8675f2b9da37
ポッドキャスト
司会担当やメンバーとしてお話したポッドキャストです。
JSConf JP 2025の気になるセッションを深ぼってみた
Spotify: https://creators.spotify.com/pod/profile/muddy-web/episodes/25-JSConf-JP-2025-e3cigjj
来年も開催決定！ フロントエンドカンファレンス東京2025 振り返りと2026への野望
Spotify: https://creators.spotify.com/pod/profile/muddy-web/episodes/24--2025-2026-e3bj5tg
TSKaigi 2025に参加してみてのふりかえり
Spotify: https://creators.spotify.com/pod/profile/muddy-web/episodes/20-TSKaigi-2025-e33vma0
CyberAgent Developer Conference(CADC) 2023 LP開発の舞台裏
Slide: https://speakerdeck.com/shuta13/cyberagent-developer-conference-cadc-2023-lpkai-fa-nowu-tai-li
Event URL: https://cyberagent.connpass.com/event/294610/
新卒で1年目を振り返ってみた話
Spotify: https://open.spotify.com/episode/7qyI4jXhuIugKCurPzYeNT?si=1dA0zJ6yTBaKzNHEIaJTdQ
職務と職能
職務
ビジネスサイドやデザイナーなどの異職種と密に連携し、定義した要件とデザインを元に一気通貫で開発を行い、リリースとメンテナンスを行えます。
また、デザイナーが不在の状況でも、ある程度の品質のUIUXを提供できます。
4人規模のWebフロントエンドチームにて、テックリードの経験があります。
マネジメント経験はありませんが、EMやPdMとしてのキャリア設計をしており、マネージャーの補佐を通してインプットを行っています。
関心のあるドメインは以下になりますが、他のドメインについても適宜キャッチアップしつつ開発できます。
- 興行（アイドル系のエンターテインメント、サッカーなどのスポーツなど）
- 不動産
- 医療
職能
JavaScript関連の技術を用いた開発を得意とします。
また、流行り廃りや技術の潮流、事業に適した技術かどうかを考えつつ、開発者向けのPlatformの構築やイネーブリングで、組織の出力を最大化する仕組みづくりも得意とします。
Webフロントエンドをメインとしていますが、チームによってはバックエンドやネイティブアプリの開発も行えます。また、Node.jsとGoを用いたCLIの開発も得意とします。
以下の技術を用いて、チームのリーダーやメンバーとしてベストプラクティスを実践できます。
- JavaScript
- TypeScript
- React
- Next.js
- HTML
- CSS
以下の技術を用いて、チームのメンバーとして人並みに開発できます。
- Go
- Docker
- Node.js(Express, Hono)
- Vue.js(Nuxt.js)
- React Native
- Three.js
- AWS
- CloudFront
- S3
- Lambda
- IAM
- Amplify
- EKS
- EC2
- Cognite
- Google Cloud
- Cloud Run
- Artifact Registry
- IAM
- Cloudflare
- Pages
- Workers
- CI
- GitHub Actions
- AI Agent
- Claude Code
- Codex
以下の技術について、基本的な知識を持っています。実務で触れた経験があります。
- Kubernetes
- CI
- CircleCI
- TravisCI
- PHP
- Laravel
- Blade
- Ruby
- Ruby on Rails
- Sinatra
- ERB
- Momento
- Topics
- Cache
- GLSL(WebGL)
以下の技術の利用経験があります。趣味や大学の学部の授業で学んだ程度です。
- RDB, SQL
- MySQL
- PostgreSQL
- SQLite
- KVS, NoSQL
- MongoDB(MongoDB Atlas)
- DynamoDB
- Redis
- Python
- scikit-lern
- tensorflow
- C, C++
- Java
- Java Applet
- Unity