フロリア

フロントエンドリアーキテクチャ(部分刷新)を素早く終わらせるために取り組んだこと

※この記事は Cybozu Frontend Advent Calendar 2023 の 25 日目の記事です ! こんにちは、サイボウズでスクラムマスターとして働いている村田です。2023 年 8 月から新規機能を開発するチームに移動し、週3日(火水木)勤務で専任スクラムマスターとして活動し…

持続可能なフロントエンドのテストコードを書くために大切にしていること

こんにちは、kintone フロントエンドリアーキテクチャプロジェクト(フロリア)でエンジニアをしているはた丸です。 昨今は何かとSDGsが話題になる世の中なので、フロントエンドのテストコードも持続可能なものを作っていきたいと考えています。 この記事で…

入社1ヶ月のQAエンジニアにフロントエンド刷新チームのテスト業務について聞いてみた!

こんにちは!kintone フロントエンド刷新プロジェクト(フロリア)のReactoneチームでQAエンジニアとして活動しているTsuneです。 本記事では、10月に配属された新メンバーのMiyakeさんに、入社から1ヶ月経ってみての率直な感想や現在の業務についてインタビ…

JavaScript のグローバルオブジェクトに立ち向かう

こんにちは kintone のフロントエンド刷新プロジェクトでフロントエンドエンジニアをしている Nokogiri です 現在 kintone ではフロントエンドのレガシーコードの刷新に取り組んでいます。 このプロジェクトでグローバルスコープの JS オブジェクト(以降グ…

社内で使う npm パッケージの作成に Deno を採用した話

こんにちわ。フロントエンドエキスパートチームの@nus3_です。 最近、社内用の npm パッケージを作る必要があり、そのパッケージは依存が少なく、実装もシンプルだったので、npm パッケージの作成には Deno と dnt を採用しました。 dnt とは dnt は Deno で…

新卒 1 年目が kintone のフロントエンド刷新プロジェクトで取り組んでいること

こんにちは!kintone フロントエンド刷新プロジェクト(通称フロリア)にてエンジニアをしている キム テフンです。今日は フロントエンド職で新卒入社後にできることの一例として、「フロリア」の「Mira チーム」に合流してから 2 ヶ月間やってきたこと、そ…

React 化した共通ヘッダーを kintone の全ページに適用しました!

こんにちは!kintone フロントエンドリアーキテクチャプロジェクト (フロリア) で、エンジニアとして活動している @nissy_dev です。 以前投稿したチーム紹介記事の中で、コンポーネント単位での共通ヘッダー部分の React 化に取り組んでいることを紹介しま…

結合テストの自動化にQAはどうかかわっていったか

こんにちは、サイボウズの永田です。 私は、サイボウズの開発本部、アジャイル・クオリティで、アジャイルの品質を探求する活動をしています。 この記事では、2023年3月9日、JaSST Tokyo 2023のテクノロジーセッションで発表させていただいた内容を、より解…

Storybook をフル活用してテストを実装した話

サムネイル こんにちは、フロリアでエンジニアとして活動している irico です。 現在 kintone ではフロリアというプロジェクトの中で、Closure Tools から React への移行作業に取り組んでいます。 今回は、そのフロリアのチームの 1 つである Reactone チー…

kintone アプリ作成フォームの UI の状態管理のライブラリ選定

サムネイル こんにちは!kintone のフロントエンド刷新プロジェクト(フロリア)の@nkgrnkgrです。 フロリアでは、kintone のフロントエンドの ClosureToolsで書かれたコードを React に置き換えています。 本記事では フォーム画面の UI の状態管理に使うラ…

新卒でマイクロフロントエンドを経験してみて

新卒でマイクロフロントエンドを経験してみて こんにちは!kintone フロントエンドリアーキテクチャプロジェクト(フロリア) の AppShell チームで活動している 22 新卒のアルベスです。この記事は、Cybozu Advent Calendar 2022 の 21 日目です。 AppShell…

エンジニアとの距離が近くなっていいことたくさんだったQAの話

この記事は Cybozu Advent Calendar 2022 の20日目の記事です。 はじめまして、QAエンジニアのなかたです。 私はkintoneのフロントエンドリアーキテクチャプロジェクト(フロリア)の共通ヘッダー部分のReact化を担当するAppShellチームに参加しています。 A…

フロントエンド刷新プロジェクトの開発サイクルを加速するデプロイパイプラインの改善

フロリアでは開発版 kintone の動作確認に自社インフラ上のテスト環境を利用しています。 従来のテスト環境へのデプロイ手順には手作業や待ち時間が多く、開発メンバーの負担になっていました。 そのためPull Request (PR) から簡単にテスト環境へデプロイで…

チームメトリクスと感情データを活用した「ふりかえり」の手引き

みなさんこんにちは。kintone フロントエンドリアーキテクチャプロジェクト(フロリア)で、エンジニア兼スクラムマスターとして活動している村田(@kuroppe1819)です。 この記事は、Cybozu Advent Calendar 2022 の 18 日目です。 17 日目はこちら → バン…

kintone の共通ヘッダー部分の React 化に責任を持つチームの紹介!

こんにちは!kintone フロントエンドリアーキテクチャプロジェクト (フロリア) で、エンジニアとして活動している西川 @nissy_dev です。 フロリアは、現在 4 つのクロスファンクショナルチーム体制で、それぞれが独立したスクラムチームとして活動していま…

フロントエンドのテストコードを書くときに大切にしていること

こんにちは、フロントエンドエキスパートチームの @mugi_unoです! kintone では フロントエンドの刷新プロジェクト(通称フロリア)が進行中です。 blog.cybozu.io kintone の開発では E2E 主体の自動テストを整備していましたが、 フロントエンドの刷新に…

フロントエンド刷新プロジェクトを成功に導くためのテスト手法の紹介

こんにちは、フロリアでQAエンジニアをやっている中園です。 現在サイボウズではkintoneのフロントエンドリアーキテクチャプロジェクト(フロリア)と称して、Closure Tools から React へと置き換えるプロジェクトが進行中です。 今回は、フロリアのチーム…

新卒で飛び込んだフロントエンド刷新プロジェクトが学びだらけだった話

こんにちは、kintone フロントエンドリアーキテクチャプロジェクト (フロリア) に所属している 21 新卒の西川 (@nissy_dev) と左治木 (@sajikix) です。 フロントエンド刷新プロジェクトへの配属から約 1 年が経ち、プロジェクトに関わる中で多くの学びがあ…

実装例から見る React のテストの書き方

こんにちは!フロントエンドエキスパートチームの@nus3_です。 kintone のフロントエンド刷新プロジェクト(フロリア)では、品質を保ったまま開発を加速させるためにフロントエンドのテストを積極的に行っています。 今回はそんなフロントエンドのテストの…

kintone フロントエンド刷新においての Web パフォーマンス方針

kintone フロントエンド刷新プロジェクトリーダーの @koba04 です。この記事では kintone フロントエンド刷新プロジェクトにおける Web パフォーマンス方針について紹介します。 kintone フロントエンド刷新プロジェクト(フロリア)とは プロジェクトの現状…

最速でフロントエンドを刷新するための開発フロー

こんにちは、フロリアでQAエンジニアをやっている中園です。 現在サイボウズでは kintone のフロントエンドリアーキテクチャプロジェクト(フロリア)と称して、Closure Tools から React へと置き換えるプロジェクトが進行中です。 フロリアの詳細について…

スクラムチームで実践しているソロプロとモブプロを両立したスウォーミングの紹介

みなさんこんにちは。kintone フロントエンドリアーキテクチャプロジェクト(フロリア)で、エンジニア兼スクラムマスターとして活動している村田(@kuroppe1819)です。 現在、フロリアには兼務も含めて約 30 人のメンバーが参加しています。フロリアは小さ…

30人が参加するプロジェクトで桁違いのパフォーマンスを発揮するためのチームデザイン

こんにちは。シニアスクラムマスター(初めて名乗った!)の天野 @ama_ch です。開発本部に所属するアジャイルコーチとして、組織内を横断的に支援しています。最近は、 kintone フロントエンドリアーキテクチャ(フロリア)プロジェクトの支援に注力してい…

kintoneのアクセシビリティ改善とESLintルールの整備

こんにちは。Poca11y(ポカリ)チームのSUGI(@blindsoup2p1)と小林(@sukoyakarizumu)です。 わたしたちPoca11yチームは「kintone」のアクセシビリティ改善活動に参加しています。この記事ではkintoneのアクセシビリティを改善するチーム体制について解説しま…

kintoneの内部を(こっそり)Reactに置き換えるチームがあるってホント?

こんにちは!フロントエンドエキスパートチーム兼 Mira チームで活動している@nus3_です。 サイボウズが提供するkintoneは 10 年以上にわたり多くのユーザーにご利用頂いています。現在、kintone の開発が引き続きスケールできるように、Closure Toolsから R…

typescript-generatorを利用して、HTML に埋め込んだ JSON データをフロントエンドで型安全に扱う

こんにちは!kintone フロントエンドリアーキテクチャチーム (フロリア) の西川 @nissy_dev です。 最近のフロントエンド開発で導入されることの多い TypeScript ですが、開発期間の長いプロジェクトに導入する際にはバックエンドとの結合部分の型定義をどう…

Playwright & Vite ではじめる脱レガシー向け軽量 Visual Regression Test

こんにちは!フロントエンドエキスパートチームの @mugi_uno です。 みなさんは Visual Regression Test は普段活用していますか? 昨今では事例もよく耳にするようになった印象です。一度使って手放せなくなった方もいるのではないでしょうか。 今回の記事…

ユーザー体験を最高にするkintone Design Systemsをつくってます

春ですね〜、ユーザー体験を最高にするチームプロジェクトオーナーのsakitoです。 以前、kintone フロントエンドリアーキテクチャプロジェクトをスタートさせたブログ記事が公開されました。 今回はこの取り組みの一つのチームである「ユーザー体験を最高に…

kintone フロントエンドリアーキテクチャプロジェクトで大切にしていること

kintone フロントエンドリアーキテクチャプロジェクトリーダーの @koba04です。 昨年末から、kintone フロントエンドリアーキテクチャをプロジェクト(フロリア)として再構成してスタートさせました。フロリアという名前は社内での公募により決定しました。…