プラハチャレンジにて、受講生チームから次のような質問がありました。データベース（RDB）のテーブル設計を変更したいテーブル設計を変更する作業中にアプリケーションからデータベースへのアクセスが発生すると困るメンテナンス期間を設けアプリケーションを一時的に停止することで、データベースへのアクセスを防ぐことはできるデータベースを止めることなくテーブル設計を変更する方法はないかこの質問に対して、Expand and Contract patternを紹介しました。この記事では、Expand and Contract patternを用いてテーブル設計を移行する方法を例を交えて紹介...

1人でウミガメのスープを遊べるiOSアプリを作りました。https://apps.apple.com/jp/app/1人でウミガメのスープ/id6544801645 アプリの概要「ウミガメのスープ」は以下のようなゲームです。出題者が問題を出し、他の人は「はい」または「いいえ」で答えられる質問を出す。質問者は、出題者が考えているストーリー、あるいは物を推測して語る。それがすべての謎を説明できたとき、このパズルは解けたことになる。（Wikipedia - シチュエーションパズルより引用）通常は複数人でプレイするゲームですが、このアプリでは出題者をChatGPTに担当してもら...

むかしむかしあるところに※おおむね嘘です めでたくリリース！までは幸せだったボス🧔‍♂️ < 今日から新規プロジェクトを立ち上げる！ボス🧔‍♂️ < まず、君には基幹システムからのデータ連携システムの構築を任せる。ボス🧔‍♂️ < 連携元システムの担当者はxxxさんだ。詳細は彼と詰めてくれたまえ。私👨🏻‍💻 < ラジャ！...私👨🏻‍💻 < でけたっす！ボス🧔‍♂️ < よくやってくれた。では次のタスクを～...。...ボス🧔‍♂️ < 無事リリースだ！お疲れ様！ボス🧔‍♂️ < 早速次のプロジェクトに移っても...

https://nextjs.org/blog/next-15雑に翻訳しました。意訳がめちゃくちゃ含まれているので注意です。Next.js 15が正式に安定版としてリリースされました。このリリースはRC1とRC2のアップデートをベースにしています。安定性に重点を置きながら、気に入っていただけるようなエキサイティングなアップデートを追加しました。今すぐNext.js 15をお試しください。# 新しい自動アップグレードCLIを使用するnpx @next/codemod@canary upgrade latest # もしくは手動でアップグレードするnpm instal...

https://nextjs.org/blog/next-15-rc2雑に翻訳しました。意訳がめちゃくちゃ含まれているので注意です。5月に最初のNext.js 15 リリース候補版を発表した後、皆さまからのフィードバックをもとに、2回目のリリース候補版を準備してきました。 以下がその内容です。@next/codemod upgrade: Next.jsとReactの最新バージョンに簡単にアップグレードできるようになりました。Turbopack for development: パフォーマンスの向上とNext.js 15の安定性を目指した改善。Async Reques...

GitHub前提です！順不同です。 コードを提案する❌divではなく、spanを使ったほうが良いと思いました！✅divではなく、spanを使ったほうが良いと思いました！+ <div>山田</div>- <span>山田</span>文章だけで「ここはこうした方がいい」を説明するより、コードも一緒に提案してあげた方が分かりやすいです。GitHub上だと、以下のように操作するとコードの提案ができます👇️ GitHubのリンクを貼る時はパーマリンクを使う❌https://github.com/prisma...

はじめに連続ログイン記録のようなものは，多くのアプリケーションに実装されています．しかし，いざログから連続記録を算出する機能を実装してみるとなると，かなり複雑なSQLが必要になりました．chito_ngさんの「『継続して○○した日数』とその最大値をSQLで求める」を参考に実装しました．結構苦労したので，備忘録がてら残そうと思います．PostgreSQLを利用します． SQLで連続記録を算出する今回は問題演習アプリを例に取り，連続学習日数を取得しようと思います．以下のようなanswersテーブルから，連続学習日数を取得します．user_idanswer_id...

Chrome DevTools（以下、開発者ツール）は開発者にとって欠かせないツールですが、改めて使い方を調べたことは少ないのではないでしょうか？この記事では開発者ツールの便利な機能をまとめて紹介します！筆者はChromeをメインで使用しているのでChrome DevTools前提ですが、一部拡張機能や他のブラウザの便利な機能を含みます。 スクリーンショットをキャプチャする端末の機能でもスクリーンショットをキャプチャすることはできますが、開発者ツールではより便利なスクリーンショットの機能が提供されています。 特定のノードのスクリーンショットをキャプチャするElements...

「上（下左右），右（左），下，左」で指定されている基本的には上から時計回りで書きます．省略したところは，前に書いたものが適用されます． ケーススタディ padding: 20px;上（下左右）が20px結果： 上下左右が20px padding: 20px 40px;上（下左右）が20px右（左）が40pxで上書き結果： 上下 20px，左右40px padding: 20px 40px 60px;上（下左右）が20px右（左）が40pxで上書き下が60pxで上書き結果： 上 20px，左右 40px，下 60px padding...

ディレクトリツリーを2秒で書けるアプリを作りました。https://dir-maker.netlify.app/ アプリ開発のきっかけPRに説明をつけるとき、自分はよくディレクトリツリーを使います。👇 こんなのです。/└─ src └─ components ├─ button.tsx ├─ button.css.ts └─ button.stories.tsx一から自分でディレクトリツリーを書くのはなかなかの手間なので、👇のようにしていました。既存のディレクトリツリーをコピーしてファイル名の部分だけを変える足りない部分は他...

会社でNeverThrowというライブラリを使っています。とても便利なので、とても便利だよ〜という記事を書きます。 NeverThrowとは？NeverThrowは、TypeScriptで「Result型」を実現できるライブラリです。 Result型とは？Result型は、関数の中でエラーをthrowする代わりに、エラーを戻り値として返すようにすればいいじゃね？な仕組みのことをいいます。もっと噛み砕いて説明します。たとえば「50%の確率で足し算してくれるけど、50％の確率で💩をthrowする」という関数があるとします。コードで表すと👇になります。function a...

はじめにTypeScriptでClassを定義する場合、みなさんはどのように初期化を行っていますか？コンストラクタに引数を並べる方法が一般的だと思いますが、引数が多い場合や、引数の順番を間違えるとバグの原因になります。class User { public readonly id: number; public readonly firstName: string; public readonly lastName: string; public constructor(id: number, firstName: string, lastName: st...

社内のプチ発表に使った資料です。 文章のコツ前置きフルリモートでは、文章でのやり取りがメインになる。なので、文章がヒドいと「この人と仕事するのキツイ」と思われちゃう😢そう思われないための色々思ったことを自戒メモ。 なるべく箇条書きにする❌パソコンには、デスクトップパソコンとノートパソコンの２種類があります。✅パソコンには、以下の２種類があります。- デスクトップパソコン- ノートパソコン 漢字をひらく❌必要な時だけ実行される為、費用を安くする事が出来ます。✅必要な時だけ実行されるため、費用を安くすることができます。「漢字がギッ...

https://nextjs.org/blog/next-15-rc雑に翻訳しました。意訳がめちゃくちゃ含まれているので注意です。Next.js 15 リリース候補 (RC) が利用可能になりました。この初期バージョンでは、今後の安定版リリースの前に最新の機能をテストできます。React: React 19 RCをサポート。React Compiler (Experimental)の登場及び、ハイドレーションエラーの改善。Caching: fetchリクエスト、GETルートハンドラー、クライアントナビゲーションはデフォルトではキャッシュされなくなりました。Partial ...

はじめにNext.jsや他Webフレームワークでは，データフェッチの設計を適切に行わないとN+1問題が起きてしまいます．このN+1問題を解決するために，GraphQLのバックエンド実装でよく利用されているDataLoaderライブラリを使用するアイデアを紹介します． 準備この章では，今回解決するフロントエンドにおけるN+1問題と，利用するライブラリであるDataLoaderについて紹介します コンポーネントの責務とN+1問題!この章はN+1問題と，よく見られる回避法の解説になっているので，読み飛ばしても構いません． N+1問題って？N+1問題とは，あるデータ...

GitHub Actionsとは？GitHub Actionsは、GitHubが提供する「スクリプトを動かしてあげるよ～」なサービスです。具体的に言うと、リポジトリに以下のようなディレクトリを作って、その中に「こういうときにこれを実行してね」なYAMLファイルを設置しておくだけで、GitHubが「お！これを実行したらええんやな！」と認識してくれます。📁.github └📁workflows └📄hoge.yml 👈これの中身が実行される 料金（2024年05月現在）publicリポジトリだと無料で使い放題です。すごい。privateリポジトリでも無料枠が2,0...

株式会社プラハは2022年、株式会社アガルートによるM&Aで子会社となりました。この変化の一環として、アガルート社長自らがプロダクトオーナーのひとりとして参加する新規プロダクト開発が始まりました。プロダクトの開発はプラハの私たちが担当し、私も「開発チームのリーダー」としてそのチームに加わることになりました。私はこれまで開発メンバーとしての経験しかありませんでしたが、エクストリームプログラミングとかレガシーコードからの脱却とかめっちゃ好きで、本で学んだプラクティスをリーダーとして実践できる機会が与えられて最高にハッピーでした。しかも、プロダクトオーナーの一人として参加するアガル...

タイトルの通りです。OriginAccessControlのnameに64文字以上のテキストを入れるとデプロイ時にコケます。表示されるエラーは下記のように、情報量皆無なメッセージのみです。Resource handler returned message: "Invalid request provided: AWS::CloudFront::OriginAccessControl" (RequestToken: 5b95a26b-63e0-ac0a-fe8e-3b51ea24ebd1, HandlerErrorCode: InvalidRequest) 対策文字列が一定の長...

「ここ間違ってるよ！」があれば、コメントで指摘して頂けるとうれしいです。 フォーマッターフォーマッターは「俺が決めた書き方に修正してやるぜ」なツールです。たとえば「この行は文字数が多すぎるから改行してやるぜ」とかをしてくれます。現状は、Prettierがよく使われているようです。フォーマットするルールは自分で追加できますが、公式には「フォーマットルールを議論することは無駄です」的なことが書かれてるので、暗にデフォルト設定のまま使うことを推奨している気がします。 リンターリンターは「その書き方はやめたほうが身のためだぜ」を警告してくれるツールです。警告するルールは自分で...

!この記事はPrettierを使用している人を非難したり、脱Prettierを推奨する事を目的としていません。こういった考え方もあるということをひとつの意見としてご覧いただければ幸いです。!勘違いしている人が多そうなので追記します。Prettierを使わないというのは私が独断で決めた事ではないです。チームが発足する際の技術選定で合意は取れていますし、私が関与していない別のチームでも同様にPrettier無しで開発しています。私達のチームはメンバー同士を互いに信頼していますし、細いスタイルで喧嘩を始めるようなメンバーは居ないので安心してください。 はじめにPrett...