はてなブックマーク

こんにちは、キカガクソフトウェアエンジニアの石橋です。 今回はキカガク for Business でのフロントエンドパフォーマンス向上への取り組みに関して共有したいと思います。 キカガク for Business は主にアプリの画面構成を２つに分けることができます。 学習画面（ 受講者が e-Learning を視聴する画面 ） 管理者画面（ 企業様や法人様の管理者が受講者の学習進捗を確認できる画面 ） パフォーマンス改善については上記の２画面でそれぞれ別の課題があり、取り組みを行っていますので紹介していきます。 学習画面での課題 学習画面はざっくり説明すると下記のような構成になっております。 動画 Firestore から Vimeo の ID を参照して iframe を埋め込み 資料 Cloud Storage から HTML を取得して表示 テスト Cloud Storage から

はじめに こんにちは、開発事業部ソフトウェアエンジニアの柳澤です。 今年の春からキカガクにジョインしました。 前職ではWebエンジニアとしてプレーンな CSS を書いていましたが、キカガクではスタイリングのために Chakra UI（ReactのUIコンポーネントフレームワーク）を採用しています。 プレーン CSS ユーザーが、 Chakra UI を使う上で躓いたポイントがいくつかあったので、今回小技集としてまとめました。同じ境遇の方の助けになりますと幸いです。 Chakra UI を学ぶ際に、下記の本が大変参考になりました。 zenn.dev 今回はこちらを読んだ上で、特に難しかった項目をピックアップして書いていきたいと思います。 疑似要素・疑似クラス同士を組み合わせる まず最初に、疑似要素・疑似クラスを組み合わせる書き方です。 Chakra UI では &:hover は _hove

はじめに こんにちは、株式会社キカガクでエンジニアをしている北田です。 ついにキカガク開発チームでも技術ブログを開設しました！（祝） 先日、私たちが提供する E ラーニングプラットフォーム【キカガク】は Vue (Nuxt.js) → React (Next.js) への技術刷新と既存コードの大幅リファクタリングを目的として技術リプレイスを行いました。 今回は、リプレイスの決断理由やリプレイスを通して苦労した点などを書いていこうと思います。 ※ この記事では詳細な実装内容やコードなど、深い技術の話はしません。 対象読者 普段から JavaScript (TypeScript) で開発をしている レガシーな言語からモダンなフロントエンド言語への変更を考えている React、Next.js でプロダクト開発を進めていきたい フロントエンド言語の技術選定に迷っている リプレイスの決断理由 Rea

はじめに やっていただいて嬉しかったこと <入社前> 使用技術についてしっかりと説明する。そのおすすめの勉強法も伝える。 メンターを付けて、入社までの学習もフォローする。 <入社から業務に入るまでのインプット期間> ゴールから逆算して習得すべき知識をリストアップし、学習マップを示す。 メンターとの 1 on 1 を多く実施する。 おわりに はじめに 開発事業部でソフトウェアエンジニアをしている西村と申します。 2022 年の 3 月 1 日に、未経験ながらエンジニアとして採用していただきました。 今回は未経験から入社して 3 ヶ月経った現在を振り返って、受け入れていただく際に、やっていただいてすごく嬉しかったことを紹介させていただきます。 私自身、本当に手厚く受け入れていただいて、キカガクに入社して良かった！っていきなり思いました。 新メンバーの受け入れ方法が固まっていない企業様や、これか

はじめに TL;DR システム概要図 フロントエンド TypeScript Next.js Chakra UI Jest × Firebase Local Emulator Suite バックエンド Firebase Firebase Authentication GCP (Google Cloud Platform) GKE を採用していない理由 悩んでいること データ分析基盤 / BigQuery 開発/コミュニケーションツール おわりに はじめに こんにちは、キカガク CTO の祖父江です。本記事ではキカガクの技術スタックとその選定理由を書いていこうと思います。これまで他社の記事を拝見し、大変参考にさせてもらっているので私たちも次の方へ貢献しようという想いで執筆しています。 これから技術選定フェーズの方が少しでも参考になれば嬉しいですし、キカガクに興味を持っていただけるキッカケになっ

📝 この記事で学べること ヘッドレス CMS のように使える「AWS Amplify」と純粋なヘッドレス CMS である「microCMS」を使った結果、なぜ microCMS を選んだのか こんにちは！株式会社キカガクの開発事業部でソフトウェアエンジニアをしている塚井です。数ヶ月前からフロントエンドエンジニアとなるべく奮闘中です。今回はそんな中で経験したヘッドレス CMS の比較記事を書きたいと思います！ 対象読者 概要 予備知識 なぜ microCMS にしたのか 当初 AWS Amplify を選んだ理由 AWS Amplify を諦めた理由 microCMS に変更した理由 おわりに おまけ 採用情報 対象読者 WordPress などの CMS ではかゆいところに手が届かないなどの理由で、Web サイトを構築したいが、開発コストを抑えたい！でも、非エンジニアが高頻度でコンテンツ

前提 状況 整理整頓 Step0: 前提知識 Step1: 整理の軸を決める Step2: 仕様を整理する Step3: 手段の整理 結論 おわりに こんにちは、開発事業部で PM をしている丸山です。 キカガクでは昨年夏に GCP を中心としたデータ基盤へ移行しました。 データ基盤では現在次のように複数ソースのデータを BigQuery へ集約し、加工していくような構成を取っています。 infra 半年程度運用してデータパイプラインの管理のつらさが表面に浮かんでくる中で、上図にも記載があるワークフロー管理ツールの導入に踏み切ったのですが、その際に無秩序となっていた BigQuery のデータセット/テーブル構成に関してもテコ入れをしましたので、そちらの内容を書いていこうと思います。 前提 本題に入る前に、前提として今回扱っているデータ基盤は下記の規模感のものとなります。 扱うデータソース

キカガクの事業 キカガクが考える教育 開発組織について マイクロチーム×横断チーム スクラム開発の導入 おわりに こんにちは、キカガク CTO の祖父江です。キカガクは AI・機械学習の会社と面接で言われることも多いのですが、「あるべき教育で人の力を解放する」ために 3 本の事業（後述）を軸にしている組織となっています。 教育事業部や fwywd などの他事業からは他媒体でアウトプットされているにも関わらず、開発事業部として技術の話をアウトプットしてきませんでした。エンジニアが急増してきた面白いフェーズの今を知ってほしいという目的でテックブログを開設しようとなりました。これから週 1 持ち回りでメンバーが記事を投稿していきますのでぜひご覧ください。 少しでも興味を持っていただけたなら正社員 / 業務委託の関わり方は問いませんので、一度カジュアルにお話させていただけると幸いです。 www.w