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
7
7.1k
モバイル【サイボウズ新人研修2025】
cybozuinsideout
PRO
3
2k
Git/GitHub を使う上で知っておくと嬉しいかも Tips【サイボウズ新人研修2025】
cybozuinsideout
PRO
3
3.2k
GitHub Copilot活用【サイボウズ新人研修2025】
cybozuinsideout
PRO
6
6.5k
ソフトウェアライセンス【サイボウズ新人研修2025】
cybozuinsideout
PRO
7
5.7k
エンジニアのためのアウトプット講座 〜知識をシェアするはじめの一歩〜【サイボウズ新人研修2025】
cybozuinsideout
PRO
4
1.8k
Docker入門【サイボウズ新人研修2025】
cybozuinsideout
PRO
3
2.5k
セキュリティ【サイボウズ新人研修2025】
cybozuinsideout
PRO
1
1.7k
TLS 1.3をざっと理解する【サイボウズ新人研修2025】
cybozuinsideout
PRO
2
920
Other Decks in Technology
See All in Technology
SaaS型なのに自由度の高い本格CMSでサイト構築と運用のコスパ&タイパUP! MovableType.net の便利機能とユーザー事例のご紹介
masakah
0
110
Delta airlines®️ USA Contact Numbers: Complete 2025 Support Guide
airtravelguide
0
340
MobileActOsaka_250704.pdf
akaitadaaki
0
120
自律的なスケーリング手法FASTにおけるVPoEとしてのアカウンタビリティ / dev-productivity-con-2025
yoshikiiida
1
16k
ゼロからはじめる採用広報
yutadayo
3
910
LangChain Interrupt & LangChain Ambassadors meetingレポート
os1ma
2
310
ビギナーであり続ける/beginning
ikuodanaka
3
750
Delta airlines Customer®️ USA Contact Numbers: Complete 2025 Support Guide
deltahelp
0
680
Delegating the chores of authenticating users to Keycloak
ahus1
0
140
Tokyo_reInforce_2025_recap_iam_access_analyzer
hiashisan
0
180
SEQUENCE object comparison - db tech showcase 2025 LT2
nori_shinoda
0
130
Backlog ユーザー棚卸しRTA、多分これが一番早いと思います
__allllllllez__
1
150
Featured
See All Featured
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
35
2.4k
Optimizing for Happiness
mojombo
379
70k
The Straight Up "How To Draw Better" Workshop
denniskardys
234
140k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
29
9.6k
The World Runs on Bad Software
bkeepers
PRO
69
11k
Practical Orchestrator
shlominoach
189
11k
Producing Creativity
orderedlist
PRO
346
40k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
138
34k
Typedesign – Prime Four
hannesfritz
42
2.7k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
Thoughts on Productivity
jonyablonski
69
4.7k
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