1
/
5

テックブログ

CypressでE2Eテストどやってみた!【株式会社ライトコード】

はじめに最近テストの重要性を感じて、特にE2Eテストを導入したいなーって思ってました。そこで、Cypressを使って実際にプロジェクト作りながら学んでみることにしました!プロジェクト概要Docker Composeで構築フロントエンドはRemix、バックエンドはGoで実装PostgreSQLを使用Nginxをリバースプロキシとして設定Cypressを使ってE2Eテストを実装GitHub ActionsでCI/CDを設定やりたいことAPIテストE2EテストビジュアルテストGitHub Actionsで自動テストさっそく始めよう!今回はシンプルなブログアプリを作ってみます。APIのエンドポイ...

KubernetesでHTTPS通信をやってみる①【ローカル編】【株式会社ライトコード】

MinikubeとIngressで自己署名証明書を使ったHTTPS通信を実現するこの記事では、ローカル環境のMinikubeを使い、自己署名証明書(オレオレ証明書)とIngressでHTTPS通信を実現する流れを見ていきます。前編としてローカルでIngressを使ったHTTPS通信を確認し、後編ではGoogleCloud上にk8sリソースを作成して同様にHTTPS通信ができるところまで確認します。前編後編を通してk8sでのネットワーク(L4, L7)について少し詳しくなろうという試みです。1. はじめに:なぜHTTPSが必要なのか?現代のウェブサービスにおいて、HTTPSは必須です。ユー...

自作のChrome拡張を使って業務効率化をしてみる【株式会社ライトコード】

ちょっとした作業を効率化するためにシェルスクリプトや簡単なコードを作って楽をすることはエンジニアではよくあることかと思います。その一環としてChromeの拡張機能を作るのも意外と便利だよ、というお話です。作りたいもの今回作るのはGitHubのプルリクエストに対する拡張です。プルリクエストが大きくなると、全てのコメントに対応したかどうか分かり辛くなることがあるので指摘数を一目でわかるようなブラウザ拡張を作ってみようと思います。具体的にはFiles changedタブを開いた際に画面の適当な部分にコメント数や解決数を表示してくれる、といったものを目指します。必要な手順manifest.jso...

【Android】GitHub ActionsからワンクリックでFirebase App Distributionにアプリをデプロイする【株式会社ライトコード】

前回は、GitHub Actionsを使ってAndroidアプリのバージョン番号(versionName と versionCode)を自動で更新し、プルリクエストを作成するワークフローについて解説しました。▼ 前回の記事(まだの方はこちらからどうぞ!)2025.02.07【Android】GitHub Actionsでアプリのバージョン情報を更新するはじめにこんにちは!株式会社ライトコードの福岡本社でモバイルエンジニアやってる こー です!現在、個人開発しているAn...開発中では、テスターやチームメンバーに対して動作確認用としてAPKファイルを配信することが多くあると思います。ですが...

Cloud Run運用術:遅延も異常も見逃さない監視と通知【株式会社ライトコード】

今日からできる!Cloud Runサービスの運用のコツこんにちは、最近、個人開発用のMacBookPro(M4)を新調し、バッテリーの持ちの良さに感動した "こやまん" です。今回は、Google Cloudの運用で役立つロギング、トレース、モニタリングアラートについて解説します。ユーザー体験を左右する「レイテンシ」とは?速さが価値になるウェブサービスを運用する上で、特に注目したいのがリクエストのレイテンシです。もしレイテンシが遅いと、せっかく良いサービスでもユーザーは離れてしまいます。時は金なりとも言いますね。レイテンシのざっくりした分類は次の通りです。レイテンシは複数のステップで発生...

【dbt × BigQuery】増分更新について挙動を詳しく確認してみる【insert_overwrite(Dynamic partitions), append】株式会社ライトコード

こんにちは!普段データ関連のお仕事をしています。現在所属しているチームではデータマートの作成の際にdbtを使用しており、コスト削減のために差分更新の対応中です。差分更新処理を書いていると「あれ?どんな挙動になるんだっけ?」ということが多いので、そんな自分に向けて増分更新の詳しい挙動を確認して、備忘録がてらブログを書いていきたいと思います。環境・準備BigQuerydbt差分更新の種類僕が所属しているチームでは「insert_overwrite(Dynamic partitions)」方式と「append」方式を採用しているので、今回はその2つについて挙動を見ていきたいと思います。inse...

Pythonのパッケージ管理ツール「uv」を試してみた【株式会社ライトコード】

概要Pythonのパッケージ管理ツールuvを使ってみたので、使い心地をざっくり書いてみます。記事の要約趣味プロジェクトのパッケージ管理ツールをuvへ移行させた使ってみたらとても便利だったので、普段の開発ユースケースでどう運用するのが良さそうか整理したいuvはいいぞ環境Python: 3.13.2uv: 0.7.8背景もとい前置きPythonは主に趣味で触っていましたが、パッケージ管理で苦戦することが多かったです。Dockerを使うとIDEと噛み合わせが悪かったり、いろんなツールを試すと仮想環境とパッケージ管理が複雑になってきてメンテナンスが大変になったりと、色々迷走してきました。Pyth...

【ReactNative】Reduxで状態管理【株式会社ライトコード】

はじめにReact Native のアプリ開発で状態管理に Redux を使用しています。今回は、Redux の導入と基本的な使い方について備忘録としてまとめました。Redux とはRedux は、グローバルな状態管理のための JavaScript ライブラリです。主に React と ReactNative の状態管理に使用されます。React の状態管理方法としては他にも様々な選択肢がありますが、React に関する年次開発者調査を行っている Devographics の 2024 年調査によると、React の状態管理には useState に次いで Redux(Redux Too...

Next.js, TailwindCSSでscroll-behaviorを使い分ける【株式会社ライトコード】

はじめにスムーズスクロール対応のため、html要素にscroll-behavior: smooth;のclass(以下、TailwindCSSのscroll-smooth)を付与したい時があります。ただ、scroll-behavior: auto;を使いたいページを要求されたらどうするか心配になるものです。Next.js App routerNext.js App routerでは<html>タグをroot layoutで記述する必要がありますが、Route Groupsを使い複数のroot layoutをを用いることができます。app├── (scroll-auto)│ └── l...

Vitest のモック(vi.fn, vi.spyOn, vi.mock)の使い分けについて【株式会社ライトコード】

背景Vitest でテストを書く際、公式ドキュメントを見るとモックに関するユーティリティが多数存在し、最初はどれを使うべきか悩んでしまいます。この記事では、テストができれば良いという状態から、テストの目的に合わせたモックユーティリティの使い分けができるような状態へのステップアップを目指します。ゴールvi.fn,vi.spyOn,vi.mockのそれぞれの特徴と適した用途を理解する実際のサンプルコードを通して、実践的な使い分け方や注意点を学ぶ環境vitest: 3.0.8jsdom: 26.0.0用語の確認ソフトウェアテストで用いる一般的なモックに関する用語の定義を確認します。スタブ: 関...

【ReactNative】GoogleMapを表示するページがWebViewでInvalidKeyMapErrorになってしまう【株式会社ライトコード】

今回はReactNativeのWebViewで表示した時だけGoogleMapがエラー表示になってしまい、InvalidKeyMapErrorなのにAPIキーは間違っていないという問題に遭遇した話です。概要軽く確認したところ以下のような感じです。(何もしてないのに壊れたiOS・Androidのどちらでも発生し、実機・シミュレータ関係なく発生するブラウザで該当ページを開いてもエラーにはならないStaging環境のみで発生、ローカルや本番環境では発生しないエラーが発生する前にReactNativeアプリ側も、GoogleMapを表示する該当ページ側も変更を入れていない幸い本番には問題が発生し...

GitHub Copilot Agent Modeを使ってToDoアプリを作ってみた!【株式会社ライトコード】

こんにちは!生成AIの台頭が凄まじいですよね。我々WEBエンジニアにとって死活問題になりうる存在ですので、日々キャッチアップして行かなければと少々焦っておりますが、ついていけていない感が否めません…そんな中、Xで生成AIの1つであるGitHub Copilotのさらなる進化といったつぶやきを見かけ(てしまい)ました。ということで、今回はつい先日プレビュー公開された「GitHub Copilot Agent Mode」を使用してみたいと思います。環境・準備VS Code Insiderのダンロードこの記事を作成している2025年2月11日の段階では普通のVS Codeでは使用できず、「VS...

PDFを分割、結合しよう【株式会社ライトコード】

はじめにPDFの一部のページのみを分割したい時や、複数のPDFファイルを結合したい時がしばしば訪れるものです。PDFを分割WebブラウザやPDF Readerで分割するFirefoxなどのWebブラウザやPDF Readerで対象のPDFファイルを開き、プリントメニューからSave to PDFなどに出力先を設定し、必要なページを指定して出力することで分割できます。pdftkを利用して分割するCLIで操作したい場合、多くのOS/Distributionで利用できるpdftkもしくはpdftk-javaが便利です。インストール方法Ubuntu/Debian の場合sudo apt inst...

Text Mesh Proで日本語を表示させてみた【株式会社ライトコード】

はじめにこんにちは!今回は、Text Mesh Proで日本語を表示する方法についてブログにまとめました。Text Mesh Proで日本語を設定すると、文字が四角(いわゆるtofu)になってしまう問題に直面するため、今後Text Mesh Proで日本語を使用したい方の参考になれば幸いです!tofu問題とはtofu問題とは、Text Mesh Proで日本語を表示しようとした際に、文字が四角で表示されてしまう現象を指します。以下の画像は、Unityのシュミレーター画面でText Mesh Proに日本語を設定した際の例です。このように、入力した文字が四角になってしまいます。tofu問題...

【Android】GitHub Actionsでアプリのバージョン情報を更新する【株式会社ライトコード】

はじめに現在、個人開発しているAndroidアプリでFirebase App Distributionへの自動デプロイする際に利用している、GitHub Actionsを利用したアプリバージョン情報の更新 について解説していこうと思います。次の記事では、実際に今回の方法と組み合わせて 1クリックでバージョン更新 & Firebase App Distributionにアプリをデプロイする方法 について執筆予定です。それでは早速見ていきましょう!どうしてやったの?Androidアプリを継続リリースするためには、リリースAPKをビルドする前にアプリのバージョン情報を更新する必要があります。バ...

4,974Followers
289Posts

Spaces

Spaces

エンジニア初心者向け記事

注目のストーリー

ライトコード技術記事

社員の声

フリーランス応援