Slide 1

Slide 1 text

フロントエンド刷新活動の紹介 サイボウズ株式会社 JS Conf 2022 Sponsor LT

Slide 2

Slide 2 text

⾃⼰紹介 ▌⻄川⼤貴 / 2021年⼊社 ▌kintone のフロントエンド刷新 / エンジニア ▌最近の興味 n Rust で書かれた JS ツールチェーン n Rome 推し︕先⽉末からコントリビューションし始めました @nissy_dev @nissy-dev

Slide 3

Slide 3 text

kintone のフロントエンド刷新の活動を もっと知ってもらいたい︕

Slide 4

Slide 4 text

開発の知識がなくても 業務に合わせたシステムを かんたんに作成できる クラウドサービス 東証プライム上場企業の3社に1社が kintone を利⽤中 ※2022年3⽉末時点

Slide 5

Slide 5 text

チームの独⽴性や⾃律性を重視しながら、 kintone の各ページを Closure Tools から React へ移⾏しています。 kintone のフロントエンド刷新 (フロリア) 最近 ロゴもできました︕ チームの独⽴性や⾃律性の観点の詳細は、「kintoneフロントエンドリアーキテクチャプロジェクトで⼤切にしていること」を参照

Slide 6

Slide 6 text

React コンポーネント 共通ヘッダーの React 化 (今まで) ページ単位で React 化を⾏うチームへコンポーネントを提供 npm install

Slide 7

Slide 7 text

共通ヘッダーの React 化 (今まで) Closure Tools 部分の置き換えが難しく、⼆重実装が課題に React コンポーネント npm install

Slide 8

Slide 8 text

React 化された共通ヘッダーを レンダリングするスクリプト script タグでの 読み込み 共通ヘッダーの React 化 (これから) コンポーネント単位での React 化を進めています

Slide 9

Slide 9 text

共通ヘッダーの React 化 (これから) ▌マイクロフロントエンドのプラクティスを 取り⼊れながら進めています ▌共通ヘッダーとページコンテンツ間で 技術的に考えることがたくさん n 結合⽅法 n コミュニケーション⽅法 n 共通ライブラリの扱い⽅ React 化された共通ヘッダーを レンダリングするスクリプト script タグでの 読み込み

Slide 10

Slide 10 text

https://blog.cybozu.io/archive/category/フロリア kintone フロリア 検索 今回紹介した活動以外にも、 フロントエンド刷新の活動を積極的に発信しています︕

Slide 11

Slide 11 text

フロントエンド刷新を ⼀緒に⾏うメンバーをもっと増やしたい︕

Slide 12

Slide 12 text

We are hiring! ご応募お待ちしています︕ 採⽤サイトトップ フロントエンドエンジニア (kintoneフロントエンド刷新PJ) https://cybozu.co.jp/recruit/ https://cybozu.co.jp/recruit/entry/careerfront-end-engineer-kintone.html