実装例から見る React のテストの書き方 - Cybozu Inside Out | サイボウズエンジニアのブログ
2024/04/17: 更新 内容を更新した記事を書きましたので、よかったらこちらも併せて、ご覧ください。 zenn.dev こんにちは！フロントエンドエキスパートチームの@nus3_です。 kintone のフロントエンド刷新プロジェクト（フロリア）では、品質を保ったまま開発を加速させるためにフロントエンドのテストを積極的に行っています。 今回はそんなフロントエンドのテストの実装例をいくつか紹介します。この記事がフロントエンドのテストを行う上での参考になれば幸いです。 テストに使用する主なパッケージ コンポーネントのテスト 補足: Testing Library の記法をチェックしてくれるeslint-plugin-testing-library カスタムフックのテスト 補足: React v18 では @testing-library/react の renderHook を使う 参考
最速でフロントエンドを刷新するための開発フロー - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは、フロリアでQAエンジニアをやっている中園です。 現在サイボウズでは kintone のフロントエンドリアーキテクチャプロジェクト（フロリア）と称して、Closure Tools から React へと置き換えるプロジェクトが進行中です。 フロリアの詳細については 次の記事をご覧ください。 今回は、フロリアのチームの一つで、利用者に気づかれない形で React への置き換えを行っている Mira チーム1の開発・テストフローの紹介をします。 "最速で" React に置き換えたい Mira チームはただ React に置き換えるのではなく「最速で React に置き換える」という目標があります。 フロリアの各チームはそれぞれのチームごとにオーナーシップを持っており、チームごとに意思決定を行っています。Mira チームでは「最速で置き換える」という目標に向かって、開発スピードを向上
kintone フロントエンド刷新においての Web パフォーマンス方針 - Cybozu Inside Out | サイボウズエンジニアのブログ
kintone フロントエンド刷新プロジェクトリーダーの @koba04 です。この記事では kintone フロントエンド刷新プロジェクトにおける Web パフォーマンス方針について紹介します。 kintone フロントエンド刷新プロジェクト（フロリア）とは プロジェクトの現状 なぜ Web パフォーマンスに取り組むのか Web パフォーマンスと生産性 kintone においての Web パフォーマンス 誰もが利用可能にするための Web パフォーマンス Core Web Vitals をメトリクスの中心に Core Web Vitals とは ローディングのパフォーマンス インタラクティブ性 レイアウトの安定性 なぜ Core Web Vitals を計測するのか SpeedCurve を活用した計測 Web パフォーマンスに取り組みやすい状態を作る これから 参考 kintone フ
生産性向上は一筋縄ではいかない Q&A [デブサミ2022夏] - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは。生産性向上チームの平木場（@korosuke613）です。最近はよくダーツを投げています。好きな料理は辛麺1です。 この記事では、Developers Summit 2022 Summer で発表した「生産性向上は一筋縄ではいかない 〜改善を進める上で生じる課題との付き合い方〜」に寄せられた質問に対して回答します。 はじめに 先日 Developers Summit 2022 Summer というイベントで生産性向上チームの活動を発表してきました。 タイトルは「生産性向上は一筋縄ではいかない 〜改善を進める上で生じる課題との付き合い方〜」です。 Developers Summit とは翔泳社さんが定期的に開催しているソフトウェア開発者のためのカンファレンスです。 2022/07/21 に開催された Developers Summit 2022 Summer は「アジャイル・De
![生産性向上は一筋縄ではいかない Q&A [デブサミ2022夏] - Cybozu Inside Out | サイボウズエンジニアのブログ](https://cdn-ak-scissors.b.st-hatena.com/image/square/f50c746256022d4a279ab6ba08733c18e5ce1282/height=288;version=1;width=512/https%3A%2F%2Fogimage.blog.st-hatena.com%2F8454420450104491317%2F4207112889907995663%2F1669617091)
アプリが依存している Swift Package ライブラリのライセンスを一覧表示するためにライブラリを作りました - Cybozu Inside Out | サイボウズエンジニアのブログ
はじめに こんにちは、モバイルエンジニアの中村（@Kyomesuke）です。 私が担当している kintone のモバイルアプリ（iOS）では、現在脱レガシーを目指して幾つかの課題に取り組んでいます。 その一つとして、パッケージマネージャーを CocoaPods から Swift Package Manager に移行するリファクタリングに挑戦していたのですが、この移行に際して一つ課題がありました。 kintone モバイルやサイボウズ Office 新着通知アプリなど、サイボウズのモバイルアプリには依存している外部ライブラリのライセンスを一覧表示する画面があるのですが、これまでその機能をAcknowListというライブラリを使用して実現していました。 しかし AcknowList は CocoaPods にしか対応していないため、Swift Package Manager に対応するため
kintoneのアクセシビリティ改善とESLintルールの整備 - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは。Poca11y（ポカリ）チームのSUGI(@blindsoup2p1)と小林(@sukoyakarizumu)です。 わたしたちPoca11yチームは「kintone」のアクセシビリティ改善活動に参加しています。この記事ではkintoneのアクセシビリティを改善するチーム体制について解説します。さらにPoca11yチームとkintone開発チームが協力して整備したアクセシビリティを強化するためのESLintルールについても解説します。 Poca11y（アクセシビリティ）チームとkintoneのアクセシビリティ改善 Poca11yチームとは Poca11yチームはサイボウズ全体の「アクセシビリティ」向上を目的としたチームです。Poca11yチームでは主に以下3種類の活動を行なっています。 社内啓発：アクセシビリティの社内研修・勉強会・ガイドライン作成などを行います。 製品改善：サ
Playwright & Vite ではじめる脱レガシー向け軽量 Visual Regression Test - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは！フロントエンドエキスパートチームの @mugi_uno です。 みなさんは Visual Regression Test は普段活用していますか？ 昨今では事例もよく耳にするようになった印象です。一度使って手放せなくなった方もいるのではないでしょうか。 今回の記事では、通常のプロダクト新規開発とは異なる “脱レガシー” の文脈で Playwright を用いた簡易的な Visual Regression Test を試してみたので、導入に至る経緯と、どのように実施しているかを紹介します。 フロントエンドリアーキテクチャとサイレントリリース 現在サイボウズでは kintone のフロントエンドリアーキテクチャプロジェクトと称して、Closure Tools から React への脱レガシー作業が進行中です。プロジェクトの詳細については @koba04 が書いた次の記事をご覧くださ
そのメール、本当に届いてる？Amazon SESの運用で得た監視プラクティス - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは、kintone.comのバックエンドエンジニアをしている@ueokandeです。 いきなりですが、メールって難しいですよね。 普段HTTPに慣れていると、メール周りのプロトコルの理解は難しく、トラブルにも見舞われることも少なくないです。 またメールプロトコルの性質上、メールを送った後にもトラブルは起こりがちです。 グローバル向けkintone.comはAWSで運用しており、メールの機能はAmazon Simple Email Service（SES）を利用しています。 この記事ではkintone.comのメール基盤の全貌と、Amazon SESを利用する上での運用プラクティスを紹介します。 kintone.comとメール kintone.comでは、ユーザーの招待やkintone上の更新を知らせるためにメールを利用し、メール送信は重要な機能の1つです。 kintone.comは
kintoneのフロントエンド刷新に向けた取り組み - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは。kintone開発チーム Webエンジニアの村田です。 本記事では kintone のフロントエンドの刷新をはじめるに至った経緯と、その取り組みについて紹介します。 はじめに なぜフロントエンドを刷新するのか 小さくはじめる Proof of Concept リリース戦略を考える 移行前と移行後の技術スタック 既存資産の再利用 Closure Library製の複雑なコンポーネントを再利用する E2Eテストを再利用する スタイルを再利用しない 開発体制 フロントエンドエキスパートチームの支援 アクセシビリティチームの支援 生産性向上チームの支援 これからの活動 おわりに はじめに 現在 kintone 開発チームでは、フロントエンドの開発に使用している Closure Tools (Closure Compiler、Closure Library、Closure Templat
Macのゼロタッチデプロイはじめました - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは。情報システム部のあおてつ（@ao_Tetsu）です。 今回はInside Outとしては珍しく情シスの取り組みを紹介したいと思います。 サイボウズの情シスは「誰でも、いつでも、どこでも最高の仕事ができるITシステムを作る」というミッションを掲げて業務を行っています。 会社で貸与するPCが４種類＋２種類から選べるのもそのミッションに基づいた施策の一つです。 100人100通りの働き方を支えるサイボウズ流情報システム部門の在り方 from ao Tetsu www.slideshare.net そして今年（2021年）の2月から、Macのセットアップはゼロタッチデプロイで提供する運用を開始しました。その経緯や仕組み、実際にやってみてどうだったか？というリアルを公開いたします！ ゼロタッチデプロイ導入の経緯 サイボウズでは社員へ貸与しているMacは以前よりMDMを利用して社内外問わず
2021年のエンジニア新人研修の講義資料を公開しました - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは。開発本部 オンボーディングチームの酒井（@sakay_y）です。社内のオンボーディングコンテンツを、どんどん社外へ公開することを夢見ています。 2021年もエンジニア新人研修を行いましたので、軽い紹介と、講義資料および一部講義動画（New!）を公開いたします。 2021年のエンジニア研修について 講義資料公開 Webアプリケーション基礎 HTTP/DNS ソフトウェアライセンス ソフトウェアテスト テスト自動化 アクセシビリティ Docker Chrome Developer Toolsの使い方 サイボウズのアジャイル・クオリティ デザインの役割と関わりかた データベース CI/CD セキュリティ モブに早く慣れたい人のためのガイド ITコミュニティ文化と情報発信に共通する成長と貢献の要素 正規表現 Kubernetesを使った開発入門 モニタリング入門 gRPC入門 日本語話
魔窟と化した全文検索サーバーとふっかつのじゅもん - Cybozu Inside Out | サイボウズエンジニアのブログ
サイボウズのクラウド黎明期から運用し続けていたSolrサーバーを Elasticsearchに置き換えるプロジェクトが先日完了しました。 プロジェクト完了報告もかねてプロジェクトのあらましを公開したいと思います。 はじめに このプロジェクトの主軸は『魔窟と化したレガシー技術をどう捌くか？』になります。 このプロジェクトの報告をする前に、いくつかエクスキューズをさせていただきます。 クラウド黎明期を支えてくれたSolrには畏敬の念に近い感謝をもっています レガシーな技術に対してマウントやディスリスペクトの意図はありません 魔窟にかかわることになってしまった人に対して負の感情は一切ありません 今回の採用している構成はElasticsearchのあるべきアーキテクチャではありません 今後、Neco 環境への移行を通して継続的に改善していきます サイボウズでのSolrの使い方と用語説明 サイボウズ
MySQL 8.0 への移行が完了しました ～さようなら全ての MySQL 5.7～ - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは。クラウド運用チームの飯塚です。 私たちは cybozu.com 本番環境の MySQL を昨年末から順次 8.0 系へアップグレードしており、前回の定期メンテナンスにおいて全てのインスタンスのアップグレードを完了しました。この記事では、私たちが MySQL 8.0 への移行に取り組んだ理由と必要になった対応について紹介します。 なぜ MySQL 8.0 へ移行したのか GTID-based レプリケーションにおける制限の緩和 再起動時に AUTO_INCREMENT のカウンタが巻き戻る問題の解消 実際に対応が必要だった MySQL 8.0 の変更点 utf8mb4 の照合順序のデフォルト値の変更 SQL_CALC_FOUND_ROWS と FOUND_ROWS() が deprecated に Connector/J のメタデータ取得処理の性能低下 sys.innodb_lo
「さよなら Flaky 。不安定なテストの探し方」というお話 - Cybozu Inside Out | サイボウズエンジニアのブログ
みなさんこんにちは。サイボウズの三苫です。 本日は特にどこのイベントでも発表する予定もなく、実際に発表されなかった、不安定なテスト(Flaky Test)対策のお話をスライド & トークスクリプト形式で公開します。 不安定なテスト対策は、どこの現場でも継続的にされているかと思いますが私たちの一つの事例が皆様の対策の一助となれば幸いです。 さよなら Flaky 。不安定なテストの探し方 皆さんこんにちは。サイボウズの三苫と申します。本日は「さよなら Flaky 。不安定なテストの探し方」というお話をします。 私たちのお悩みごと 早速ですが私たちが抱えていた悩み、つまり前提となる課題からお話します。 サイボウズの kintone.com 基盤チーム(私の所属するチーム)はE2Eテストを使って AWS 上に構築した基盤上で kintone というサービスの動作保証をしようとしていました。 幸運に
プロダクト支援チームでkintoneのStorybookをホスティングした話 - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは。生産性向上チーム&フロントエンドエキスパートチームです。 今回は私たちプロダクト支援チームが普段どのようにプロダクトチームを支援しているかの一例として、kintoneのStorybookを社内からいつでも確認できるようにホスティングするまでの流れを紹介します。 支援チームとプロダクトチームの関わり まずは私たち支援チームとプロダクトチームが社内でどのように関わり、開発しているのかを紹介します。 プロダクト支援チームはプロダクトチームに属しておらず、さまざまなプロダクトの課題解決のために動いています。 例えば、プロダクトチームが手の回っていない最新技術への追従や開発体験の改善を行っています。 生産性向上チームとフロントエンドエキスパートチームの詳細については、それぞれ以下の紹介記事を参照してください。 生産性向上チームの紹介 フロントエンドエキスパートチームの紹介 今回はその支援
GitHub Sponsorsを使って「企業」として寄付をした話 - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは。OSS推進チームの平野（@shisama_）です。 2020年12月にGitHub Sponsorsを利用して企業からOSSや個人へ寄付できるようになりました。 www.publickey1.jp この記事では企業からOSSや開発者へGitHub Sponsorsにて寄付する方法について紹介します。 社外のOSSや開発者を支援するモチベーション サイボウズでは日頃の業務でお世話になっているOSSへの寄付をしています。 tech.cybozu.io サイボウズのプロダクト開発には多くのOSSが利用されており、プロダクトの成長はOSSによって支えられています。そこで、そのOSSのおかげで事業が成長した分を還元していく「フィードバック」として寄付を行い、OSSが持続的に発展できるよう支援しています。 これまでOSSプロジェクトに対してOpen Collectiveなどのプラットフォー
大規模 Closure Tools プロジェクトに Prettier を導入するまでの道のり - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは、フロントエンドエキスパートチームの鈴木(@__sosukesuzuki)です。 弊社のサービスである kintone では、コードのフォーマットを ESLint のみで行っているためプロジェクト内でコーディングスタイルを統一しきれていないという問題を抱えていました。 そこで opinionated なコードフォーマッター Prettier を導入し、コードベース全体でコーディングスタイルを統一するための支援をフロントエンドエキスパートチームで行いました。 2011 年にローンチされた kintone では、フロントエンドの大部分が Closure Tools を使って開発されています。Closure Tools は型の指定方法やクラスの定義方法などに独自システムを採用しており、現在の JavaScript のエコシステムや仕様と一部乖離しています。そのため、Prettier 本
富岳版XbyakがIntelの深層学習ライブラリoneDNNにmergeされる - Cybozu Inside Out | サイボウズエンジニアのブログ
初めに サイボウズ・ラボの光成です。 このたび、Intelの公式深層学習ライブラリoneDNNに、富士通が開発しているスーパーコンピュータ富岳向けのPull Requestがmergeされました。 その開発に関わることになった経緯を紹介します。 目次 概要 Xbyakとは 動機 Intelとの関わり 富士通との関わり 概要 富士通研究所はスーパーコンピュータ富岳で深層学習（ディープラーニング）を高速に処理するためのソフトウェアを開発してます。 そのためにIntelが開発している深層学習ライブラリoneDNNを富岳に移植して改良しています。 このたび、その成果の一部が本家のoneDNNに取り込まれました。 富岳はA64FXというArm v8-Aにベクトル演算機能SVEが追加されたCPUを持ちます。 oneDNNを富岳に移植するには、私が開発しているXbyakのA64FX用Xbyak_aarc
Node.js Dual Packages (CommonJS/ES Modules) に対応した npm パッケージの開発 - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは。フロントエンドエキスパートの平野（@shisama_）です。 フロントエンドエキスパートチームでは業務時間の 30 % の時間で技術探究を行っています。 今回は探究した技術の中から Node.js の ES Modules（以下 ESM）についてと Dual Package (CommonJS/ES Modules) に対応した npm パッケージの開発について紹介します。 ES Modules の特徴 ESM はブラウザ互換 ESM は Strict モード ESM は非同期 ESM は静的解析可能 Node.js の ESM 対応について Dual Package（CJS/ESM）に対応した npm パッケージの開発 Conditional Exports によるファイルの指定 .mjs と .cjs require など CJS 特有の機能を使う ESMから CJS ファ
生産性向上チームの紹介 - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは、生産性向上チームです。今回は、私たち「生産性向上チーム」について紹介いたします。 生産性向上チームとは サイボウズの技術領域と生産性向上チームの立ち位置 生産性向上チームは主に、次のような業務を行っています。 チームを横断した開発効率を高める基盤の整備 開発チームの業務の自動化や効率化の支援 最新の生産性向上に関わる技術のキャッチアップ、探求 などなど、一言でいうと「サイボウズのエンジニアがつらいと思っている部分を最高にしていく」ために活動しているチームです！ メンバー 生産性向上チームメンバーで記念撮影 生産性向上チームのメンバー数は現在5名です。そのうち3名は他のチームと兼務しており、そのつながりを活かして業務に取り組んでいます。 各メンバーについて、簡単に紹介いたします。 宮田 Twitter: @miyajan 出身：東京 得意なこと、好きなこと CI/CD とか自動化
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
