技術選定の成功 2年間を振り返る TypeScript,Hono,Nest.js,React,GraphQL
技術選定の成功 2年間を振り返る TypeScript,Hono,Nest.js,React,GraphQL 技術選定に失敗はない 技術選定に失敗はありません。 仮説を立て、検証し、結果の分析からNext Actionを考える。検証の結果がどうであれ、それは過程に過ぎません。 机上の空論だけで全てを理解できるほど、我々人間は賢くないのです。（注意: これは人類全体を誹謗中傷する意味ではありません。） この記事では、この２年間で行った技術選定の成功例をその理由と共に紹介していこうと思います。 申し訳遅れましたが、私、YadaYadaKonnanYadaといいます。私は今回初めて記事を書いたので、どうぞお手柔らかに。 Twitterエンジニア垢作りました。エンジニアのお友達がいません。 @uncode_jp 前提 技術選定に結論はありません。組織毎に前提が違うのだから当然のことです。みんな違っ
あなたのパフォーマンスを倍にする Frontend Ops はいかがですか.md あなたのプロジェクトに Frontend Ops の傭兵を。 [経営者の方へ] ウェブサイトが遅くなっていませんか?機能追加が遅くなっていませんか？ 私 @mizchi は Node.js とフロントエンドのエキスパートです。もし私を知らなければ、御社のフロントエンド担当に mizchi とは誰か聞いてみてください。それが一番早いと思います。 Frontend Ops の専門家として御社のプロダクトの改善にご協力します。 Frontend Ops は、ウェブサイトのロード時間を改善したり、開発者の基盤に手を入れることで一日に何度機能を追加できるかという指標に貢献するロールです。その結果としてUXを改善し、ビジネスを前進させます。 成果報酬で、費用はざっくり 100万円*達成率 となります。(詳細は後述) 仕事
Web標準のバックエンドアプリのテスト
ここで言う「Web標準のバックエンドアプリ」とはCloudflare Workers、Deno、BunなどのWeb標準をサポートするランタイム上で動くWebアプリです。もしくは、Node.jsでもWeb標準のAPIをサポートしているので、これから紹介するアプリとテストコード自体はNode.js上も動きます。 これらのテストを書く、実行するのは実にシンプルで、拍子抜けしてしまうほどです。ですが、現在、20,000行あるHonoのテストコードは、これらのやり方と全く同じ方法を取っています。注目すべき点は、実際のサーバーを立ち上げることがなく、抽象化されたリクエストとレスポンスのやり取りを試験するだけで、品質が保たれる点です。Honoのテストでは、ランタイムによっては一部実サーバーを立ち上げますが、コアの20,000行ではサーバーを立ち上げていません。この抽象化はPythonのWSGI、Ruby
Remix on CloudflarePages + Prisma + Supabase で銀の弾丸を目指す 20240828
自分が思う最強の(かつ貧者の)構成を目指したログ。流行りの技術選定ってやつしたかった。 結論だけ言うと、まだ綺麗ではないが現実的に動く。動かし方を理解してないと事故る、かも。 この記事は自分がたどり着いた結論を順を追って記述するが、自分にとって自明な場所の差分を記録してないので、コードをなぞるより変更意図を追って各々自分で組み立てる、ということを推奨する。 動いてるリポジトリはここ。ただこの記事の説明を読まないと、その意図が伝わらない。 追記 20240829: DATABASE_URL で Connection Pool を有効にするのに ?pgbouncer=true を追加 https://supabase.com/partners/integrations/prisma このスタックの意図 Remix on cloudflare-pages コストとパフォーマンスを両立できる、20
こんにちは、yebis0942です。 先日、@basemachina/bm-view-previewというツールをnpmで公開しました。ベースマキナのビュー機能のソースコードをローカル環境で編集しながら、Next.jsのnpm run devのようにライブプレビューで動作を確認できるツールです。 ライブプレビューはPlaywrightによってコントロールされたChromiumで表示しています。PlaywrightをE2Eテストや自動化以外の用途で使うのは珍しい事例かと思いますので、その背景と実装の裏側についてご紹介します。 ビュー機能とは ローカル環境で開発したい bm-view-previewの内部構成 ライブラリとしてのPlaywright ブラウザを人の手で操作できるようにする ウィンドウを表示する ウィンドウのリサイズに対応する ダイアログを自動で閉じない できなかったこと アプリ
webpack互換のRust製高速バンドラ「Rspack」が正式版となるバージョン1.0に到達。webpackより10倍高速と
webpack互換のRust製高速バンドラ「Rspack」が正式版となるバージョン1.0に到達。webpackより10倍高速と webpack互換のRust製高速バンドラ「Rspack」が正式版となる「Rspack 1.0」としてリリースされました。 Announcing Rspack 1.0 - the next generation JavaScript bundler written in Rust, webpack compatible, 10x faster. Check out the release blog for more details:https://t.co/nOVJjKMRBo — Rspack (@rspack_dev) August 28, 2024 RspackはTikTokで知られるByteDanceが中心となってオープンソースで開発されています。 バンド
Reactが初回マウントされるまでの仕組みを理解する
今回はReactが初回マウントされるまでの実装を私自身が学習した流れに沿って解説したいと思います。「React Internals Deep Dive」というブログ記事がReactの内部実装を知るのに大変参考になります。 また、「React Internals Explorer」を使うとReactが実行するプロセスを視覚的に理解することができるため、大変おすすめです。 はじめに 本記事では以下の構成に従って解説をしていきます。 前提として理解するべき要素 FiberNodeの種類 4つの実行フェーズ currentとworkInProgress Trigger フェーズの実装 Render フェーズの実装 Commit フェーズの実装 初回マウントに関する内容は主にこちらのブログを参照しています。 なぜ初回マウントに限定するのか 今回はReactの実行の中でも初回マウントに限定して解説をし
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
あなたのパフォーマンスを倍にする Frontend Ops の傭兵はいかがですか
Playwrightでライブプレビューツールを実装する - ベースマキナ エンジニアブログ