Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
フロントエンド刷新活動の紹介
Search
Cybozu
PRO
November 26, 2022
Technology
0
5.4k
フロントエンド刷新活動の紹介
Cybozu
PRO
November 26, 2022
Tweet
Share
More Decks by Cybozu
See All by Cybozu
AIツール開発ワークショップ(Dify)【サイボウズ新人研修2025】
cybozuinsideout
PRO
8
7.4k
モバイル【サイボウズ新人研修2025】
cybozuinsideout
PRO
3
2.1k
Git/GitHub を使う上で知っておくと嬉しいかも Tips【サイボウズ新人研修2025】
cybozuinsideout
PRO
3
3.3k
GitHub Copilot活用【サイボウズ新人研修2025】
cybozuinsideout
PRO
6
6.7k
ソフトウェアライセンス【サイボウズ新人研修2025】
cybozuinsideout
PRO
7
5.7k
エンジニアのためのアウトプット講座 〜知識をシェアするはじめの一歩〜【サイボウズ新人研修2025】
cybozuinsideout
PRO
4
1.9k
Docker入門【サイボウズ新人研修2025】
cybozuinsideout
PRO
3
2.6k
セキュリティ【サイボウズ新人研修2025】
cybozuinsideout
PRO
1
1.7k
TLS 1.3をざっと理解する【サイボウズ新人研修2025】
cybozuinsideout
PRO
2
940
Other Decks in Technology
See All in Technology
面倒な作業はAIにおまかせ。Flutter開発をスマートに効率化
ruideengineer
0
260
NewSQLや分散データベースを支えるRaftの仕組み - 仕組みを理解して知る得意不得意
hacomono
PRO
2
150
無意味な開発生産性の議論から抜け出すための予兆検知とお金とAI
i35_267
4
13k
Backlog ユーザー棚卸しRTA、多分これが一番早いと思います
__allllllllez__
1
150
KubeCon + CloudNativeCon Japan 2025 Recap
ren510dev
1
380
Connect 100+を支える技術
kanyamaguc
0
200
ゼロからはじめる採用広報
yutadayo
3
920
Tokyo_reInforce_2025_recap_iam_access_analyzer
hiashisan
0
180
AI専用のリンターを作る #yumemi_patch
bengo4com
5
4.3k
敢えて生成AIを使わないマネジメント業務
kzkmaeda
2
440
Lufthansa ®️ USA Contact Numbers: Complete 2025 Support Guide
lufthanahelpsupport
0
200
赤煉瓦倉庫勉強会「Databricksを選んだ理由と、絶賛真っ只中のデータ基盤移行体験記」
ivry_presentationmaterials
2
360
Featured
See All Featured
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
15
1.5k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
281
13k
Building an army of robots
kneath
306
45k
The Invisible Side of Design
smashingmag
301
51k
Optimising Largest Contentful Paint
csswizardry
37
3.3k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
A Tale of Four Properties
chriscoyier
160
23k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.8k
Raft: Consensus for Rubyists
vanstee
140
7k
Become a Pro
speakerdeck
PRO
29
5.4k
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
20
1.3k
Transcript
フロントエンド刷新活動の紹介 サイボウズ株式会社 JS Conf 2022 Sponsor LT
⾃⼰紹介 ▌⻄川⼤貴 / 2021年⼊社 ▌kintone のフロントエンド刷新 / エンジニア ▌最近の興味 n
Rust で書かれた JS ツールチェーン n Rome 推し︕先⽉末からコントリビューションし始めました @nissy_dev @nissy-dev
kintone のフロントエンド刷新の活動を もっと知ってもらいたい︕
開発の知識がなくても 業務に合わせたシステムを かんたんに作成できる クラウドサービス 東証プライム上場企業の3社に1社が kintone を利⽤中 ※2022年3⽉末時点
チームの独⽴性や⾃律性を重視しながら、 kintone の各ページを Closure Tools から React へ移⾏しています。 kintone のフロントエンド刷新
(フロリア) 最近 ロゴもできました︕ チームの独⽴性や⾃律性の観点の詳細は、「kintoneフロントエンドリアーキテクチャプロジェクトで⼤切にしていること」を参照
React コンポーネント 共通ヘッダーの React 化 (今まで) ページ単位で React 化を⾏うチームへコンポーネントを提供 npm
install
共通ヘッダーの React 化 (今まで) Closure Tools 部分の置き換えが難しく、⼆重実装が課題に React コンポーネント npm
install
React 化された共通ヘッダーを レンダリングするスクリプト script タグでの 読み込み 共通ヘッダーの React 化 (これから)
コンポーネント単位での React 化を進めています
共通ヘッダーの React 化 (これから) ▌マイクロフロントエンドのプラクティスを 取り⼊れながら進めています ▌共通ヘッダーとページコンテンツ間で 技術的に考えることがたくさん n 結合⽅法
n コミュニケーション⽅法 n 共通ライブラリの扱い⽅ React 化された共通ヘッダーを レンダリングするスクリプト script タグでの 読み込み
https://blog.cybozu.io/archive/category/フロリア kintone フロリア 検索 今回紹介した活動以外にも、 フロントエンド刷新の活動を積極的に発信しています︕
フロントエンド刷新を ⼀緒に⾏うメンバーをもっと増やしたい︕
We are hiring! ご応募お待ちしています︕ 採⽤サイトトップ フロントエンドエンジニア (kintoneフロントエンド刷新PJ) https://cybozu.co.jp/recruit/ https://cybozu.co.jp/recruit/entry/careerfront-end-engineer-kintone.html