はじめにこんにちは！バックエンドとプラットフォームエンジニアのビクトルです。この記事では、Google Cloud Runをロガーする方法についてお話しし、マイクロサービスアーキテクチャでトレーシングを使用するために試してみたいと思います。 トレーシングとロギングオブザーバビリティは、トレース、ログ、およびメトリクスを収集および集約することによって分散トレーシングを実現します。トレースは、リクエストを受信するとそのリクエストがどのようにして始まり、ソースから宛先までどのように流れるかを示し、リクエストの各部分間の遅延を測定します。ログは、開発者がデバッグを行い、アプリで...

はじめに久しぶりです、ビクトルです年末はどうでしょうか！サンタさんからたくさんお土産をもらいましたか？ 🎅私、サンタさんが少し遅くなって、12月27日Google Cloud Developer認定試験をもら。。。受かりました。あまり認定試験や面接のコードチャレンジなどは小学生のようにすごく苦手ですが、試験を受ける理由は。。。G.I.Gプログラム初めてG.I.Gと聞くと。。。昔のアメリカのアニメを思い思い出しました。 G.I.GとはGoogle Cloud Innovators Gymというプログラムで、Google Cloud Platform (GCP)で他...

はじめにディレクトリ移動をするとNode.jsのバージョンを自動で切り替えてくれるバージョンマネージャーの存在って嬉しいですよね。私はRust製のVoltaを使っているのですが……「Voltaでも.node-versionや.nvmrcを使ってNode.jsのバージョン切り替えがしたい！」「でもチームメンバーはVoltaを使っていないのでpackage.jsonを汚染するのはいやだ！」そう思ったことはありませんか？https://github.com/volta-cli/volta/issues/282https://github.com/volta-cli/volta...

はじめにCloud Runのドキュメントに以下の記述があるのを見つけました。ファイル システムへのアクセス各コンテナ内のファイル システムは書き込み可能で、次の動作の影響を受けます。これはインメモリ ファイル システムであるため、書き込みにはインスタンスのメモリが使用されます。インスタンスが停止すると、ファイル システムに書き込まれたデータは保持されません。出典: コンテナ ランタイムの契約HTTP 500 / HTTP 503: コンテナ インスタンスがメモリの上限を超えている(...中略...)Cloud Run では、ローカル ファイル システムに書...

はじめにこの記事は『Picture perfect images with the modern img element』という記事を参考に画像最適化に関しての重要な観点をまとめたものです。https://stackoverflow.blog/2022/12/27/picture-perfect-images-with-the-modern-element/画像はWEBにおいても重要な役割を担っており、2021年時点で1つ以上の画像を含むWEBサイトは95.9%、faviconなども含めて1回でも画像取得のリクエストを送信するWEBサイトは99.9%であるという調査もあります。...

はじめにこんにちは。夏休みは新潟からフェリーで北海道に行く予定を立てている@yug1224です。最近はTwitterの突発的な仕様変更により、Twitter以外の分散型SNSも注目されるようになってきましたね。自分もちょうどBlueskyの招待コードをいただいたので登録して遊んでいます。今回はGitHubでStarを付けたらBlueskyに投稿するプログラムを作ってみたので紹介します！ Blueskyとは？🤔まずそもそもBlueskyとは何か？BlueskyとはTwitterの創業者であるジャック・ドーシー氏が支援する分散型SNSであり、現在はプライベートベータ中のサ...

はじめにこの記事はDominikさんが執筆された「Thinking in React Query」を参考にReact Queryの考え方をまとめたものになります。DominikさんはTanStack Query（以下ではReact Queryと呼ぶ）のコアメンテナーであり、彼のブログからReact Queryについての知見を吸収することができます。https://tkdodo.eu/blog 目次React QueryはデータフェッチライブラリではないではReact Queryとは何か？Client StateとServer Stateの違いReact Query...

はじめにこの記事は、Alan Alickovicさんの著書「React Application Architecture for Production」をまとめたものになります。Alanさんと言えばZennで最も人気のある記事「bulletproof-react」の作者であり、彼のprojectから学ぶことはとても多い印象です。https://zenn.dev/manalink_dev/articles/bulletproof-react-is-best-architecture今回紹介する本は2023年1月に公開されたため、bulletproof-react以後のReactア...

はじめにJSONで表現されたデータをExcelファイルに変換したい場合に、ストリームで行うことでメモリ消費量を抑えることができます。本記事ではサンプルコードを用いてその方法を紹介します。なおサンプルはGoで実装しています。 アプローチJSONファイルからExcelファイルを作る際、以下のようなアプローチが考えられます。JSONファイルを構造体としてメモリ上に読み込む構造体をExcelファイルとして書き出す JSONをストリームで読み込むJSONファイルを読み込む際、JSON全体を一括で読み込むとそれだけのメモリを必要としてしまいます。一括ではなく部分的にストリ...

はじめに本記事ではOpenAPIからclientコードを自動生成するライブラリ『Orval』を紹介します。そしてOrvalの強みを明らかにし、どのような場合に選定するべきかを提案できたらと考えます。https://orval.dev/いきなりですが簡潔に結論を述べます。!REST設計で状態管理にTanStack QueryやSWRのようなライブラリを使用している場合、Orvalは高い価値を発揮する。これはOrvalの作者自身がswagger codegenといった他の自動生成ライブラリに物足りなさを感じ、特定の技術の上で最適なコード生成をしたいというモチベーションが根底...

はじめにJavaScriptにおけるテストのベストプラクティスをまとめた「javascript-testing-best-practices」というGitHubレポジトリが大変勉強になったため、特に参考になった内容をまとめて共有したいと思います。（補足）本レポジトリにはfrontendのみならずbackendのテストに関する情報もありますが、今回はfrontendに焦点を当てて共有します。そのため扱うSectionは以下の4つです。Section 0: The Golden RuleSection 1: The Test AnatomySection 3: Fronten...

はじめにこんにちは。株式会社HRBrainでインターンをしている安井です。この記事では今業務で採用しているReact Queryの特性を生かした設計を考察してまとめていきます。本記事はHRBrain Advent Calendar 2022の24日目の記事です。https://qiita.com/advent-calendar/2022/hrbrain 前提本記事で使用するライブラリ等のversionReact: v18.2.0TypeScript: v4.9.3React Query（TanStack Query）: v4.19.1axios: v1.2.1...

こんにちは。株式会社HRBrainでフロントエンドエンジニアをしているしっぽくんです。私たち HRBrain では週に1度30分、フロントエンドトークという「1週間の間に発見したフロントエンドに関するネタを共有もしくは相談する会」を社内で開催しています。今回は公開第 8 回目です。過去の記事はこちら。 news Vue2.7 Releasehttps://blog.vuejs.org/posts/vue-2-7-naruto.htmlVue2 系最後のマイナーバージョンである 2.7 がリリースしました。Vue3 系からいくつかの機能がバックポートされました。...

こんにちは。株式会社HRBrainでフロントエンドエンジニアをしているしっぽくんです。私たち HRBrain では週に1度30分、フロントエンドトークという「1週間の間に発見したフロントエンドに関するネタを共有もしくは相談する会」を社内で開催しています。先週はお休みでしたが、引き続き更新していきます。今回は公開第 7 回目です。過去の記事はこちら。 news New in Chrome 103https://developer.chrome.com/blog/new-in-chrome-103/ HTTP 103 status code 103 - early...

こんにちは。株式会社HRBrainでフロントエンドエンジニアをしているしっぽくんです。私たち HRBrain では週に1度30分、フロントエンドトークという「1週間の間に発見したフロントエンドに関するネタを共有もしくは相談する会」を社内で開催しています。今回は公開第 6 回目です。過去の記事はこちら。 news Announcing TypeScript 4.7https://devblogs.microsoft.com/typescript/announcing-typescript-4-7今週は先週に続き、TS4.7 の情報について深掘りをしていきました。...

こんにちは。株式会社HRBrainでフロントエンドエンジニアをしているしっぽくんです。私たち HRBrain では週に1度30分、フロントエンドトークという「1週間の間に発見したフロントエンドに関するネタを共有もしくは相談する会」を社内で開催しています。今回は公開第 5 回目です。過去の記事はこちら。 news Safari 16 new featurehttps://webkit.org/blog/12824/news-from-wwdc-webkit-features-in-safari-16-beta/Safari 16 beta が公開されました。過去の...

こんにちは。株式会社HRBrainでフロントエンドエンジニアをしているしっぽくんです。私たち HRBrain では週に1度30分、フロントエンドトークという「1週間の間に発見したフロントエンドに関するネタを共有もしくは相談する会」を社内で開催しています。今回は公開第 4 回目です。過去の記事はこちら。 news React Spectrum May 31, 2022 Releasehttps://react-spectrum.adobe.com/releases/2022-05-27.htmlAdobe のデザインシステムである React Spectrum のリ...

こんにちは。株式会社HRBrainでフロントエンドエンジニアをしているしっぽくんです。私たち HRBrain では週に1度30分、フロントエンドトークという「1週間の間に発見したフロントエンドに関するネタを共有もしくは相談する会」を社内で開催しています。今回は公開第 3 回目です。過去の記事はこちら。 news Storybook v6.5 リリースブログが公開https://storybook.js.org/blog/storybook-6-5/前回のフロントエンドトーク でも触れた Storybook v6.5 のリリースブログが公開されました。前回触れてい...

こんにちは。株式会社HRBrainでフロントエンドエンジニアをしているしっぽくんです。私たち HRBrain では週に1度30分、フロントエンドトークという「1週間の間に発見したフロントエンドに関するネタを共有もしくは相談する会」を社内で開催しています。今回は公開第 2 回目です。過去の記事はこちら。 topic Storybook v6.5.0 Release！https://github.com/storybookjs/storybook/releases/tag/v6.5.0特に気になるトピックについていくつか話しました。Webpack 5 lazy c...

こんにちは。株式会社HRBrainでフロントエンドエンジニアをしているしっぽくんです。私たち HRBrain では週に1度30分、フロントエンドトークという「1週間の間に発見したフロントエンドに関するネタを共有もしくは相談する会」を社内で開催しています。今回は公開第 1 回目です。過去の記事はこちら。 topic React の公式的には zero runtime もしくは CSS modules を推奨してる？という話https://github.com/reactwg/react-18/discussions/110React の開発チームのセバスチャンさんが...