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
9
11k
モバイル【サイボウズ新人研修2025】
cybozuinsideout
PRO
3
3k
Git/GitHub を使う上で知っておくと嬉しいかも Tips【サイボウズ新人研修2025】
cybozuinsideout
PRO
8
7.6k
GitHub Copilot活用【サイボウズ新人研修2025】
cybozuinsideout
PRO
14
12k
ソフトウェアライセンス【サイボウズ新人研修2025】
cybozuinsideout
PRO
10
7.1k
エンジニアのためのアウトプット講座 〜知識をシェアするはじめの一歩〜【サイボウズ新人研修2025】
cybozuinsideout
PRO
6
3.8k
Docker入門【サイボウズ新人研修2025】
cybozuinsideout
PRO
12
9.1k
セキュリティ【サイボウズ新人研修2025】
cybozuinsideout
PRO
2
2.6k
TLS 1.3をざっと理解する【サイボウズ新人研修2025】
cybozuinsideout
PRO
2
1.6k
Other Decks in Technology
See All in Technology
伴走から自律へ: 形式知へと導くSREイネーブリングによる プロダクトチームの信頼性オーナーシップ向上 / SRE NEXT 2025
visional_engineering_and_design
3
460
TLSから見るSREの未来
atpons
2
310
How to Quickly Call American Airlines®️ U.S. Customer Care : Full Guide
flyaahelpguide
0
240
CDK Toolkit Libraryにおけるテストの考え方
smt7174
1
550
How Do I Contact Jetblue Airlines® Reservation Number: Fast Support Guide
thejetblueairhelpsupport
0
150
推し書籍📚 / Books and a QA Engineer
ak1210
0
140
ソフトウェアテストのAI活用_ver1.25
fumisuke
1
610
組織内、組織間の資産保護に必要なアイデンティティ基盤と関連技術の最新動向
fujie
0
270
セキュアなAI活用のためのLiteLLMの可能性
tk3fftk
1
330
Amazon SNSサブスクリプションの誤解除を防ぐ
y_sakata
3
190
全部AI、全員Cursor、ドキュメント駆動開発 〜DevinやGeminiも添えて〜
rinchsan
10
5.1k
Bill One 開発エンジニア 紹介資料
sansan33
PRO
4
13k
Featured
See All Featured
The Pragmatic Product Professional
lauravandoore
35
6.7k
Product Roadmaps are Hard
iamctodd
PRO
54
11k
Facilitating Awesome Meetings
lara
54
6.5k
Fireside Chat
paigeccino
37
3.5k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
181
54k
Building Flexible Design Systems
yeseniaperezcruz
328
39k
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
Build The Right Thing And Hit Your Dates
maggiecrowley
37
2.8k
Why You Should Never Use an ORM
jnunemaker
PRO
58
9.5k
The Art of Programming - Codeland 2020
erikaheidi
54
13k
Scaling GitHub
holman
460
140k
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