機能的凝集とコロケーションで保守しやすい React Router v7 コンポーネント設計
これはなに？ 複数のユーザーロールや類似機能を含むフロントエンドで、コンポーネントをどう分割すべきか悩んだことはありませんか？本記事では「機能的凝集」という考え方と、remix-flat-routes のコロケーション構成を組み合わせることで、条件分岐が散らばりにくく保守しやすい設計を紹介します。 本記事では以下の技術スタックを前提としています。 React Router v7（framework モード、loader / action 使用） remix-flat-routes（Nested folders with flat-files convention） route.tsx をエントリポイントとしたコロケーション構成 本記事の内容を Notebook LM でスライド化したものも公開しています。視覚的に概要を把握したい方はこちらもどうぞ。 本記事のガイドラインを Claude C
Webフロントエンド設計ガイドライン
免責事項 有志で作成したドキュメントである。フューチャーには多様なプロジェクトが存在し、それぞれの状況に合わせて工夫された開発プロセスや高度な開発支援環境が存在する。本ガイドラインはフューチャーの全ての部署／プロジェクトで適用されているわけではなく、有志が観点を持ち寄って新たに整理したものである相容れない部分があればその領域を書き換えて利用することを想定している。プロジェクト固有の背景や要件への配慮は、ガイドライン利用者が最終的に判断すること。本ガイドラインに必ず従うことは求めておらず、設計案の提示と、それらの評価観点を利用者に提供することを主目的としている掲載内容および利用に際して発生した問題、それに伴う損害については、フューチャー株式会社は一切の責務を負わないものとする。掲載している情報は予告なく変更する場合がある はじめに 昨今のWebフロントエンド領域は、単なるHTML、CSS、
ビジネスの構造をアーキテクチャに落とし込みソフトウェアに可変性を注入する
20240522 Findy主催「アーキテクチャを突き詰める」登壇資料 イベントストーミング、ドメインモデリング、CQRS+Event Sourcing
「悪い方が良い」原則と僕の体験談｜Rui Ueyama
ソフトウェアの世界には「悪い方が良い」原則という有名なエッセイがある。キレイにレイヤ分けされた一貫性のある良いデザインよりも、一見手抜きっぽい悪いデザインのほうが実は良いときもあるという話だ。この逆説的なデザイン原則を僕は身をもって体験したことがある。それについてちょっと書いてみようと思う。 僕はlldというリンカの現行バージョンのオリジナル作者だ。リンカというのはコンパイラと組み合わせて使うもので、実行ファイルやDLLを作るのに使用される。lldはプロダクトとしてはかなり成功していて、標準のシステムリンカとして採用しているOSがいくつかあったり、GoogleやFacebookなど皆が知っているような大規模サイトの中で広く使われていたりする。 現在のlldは2世代目で、第1世代のlldは僕がプロジェクトに参加する前から存在していたのだけど、数年前にそれを捨てて一から書き直すということになっ
Reactベストプラクティスの宝庫！「bulletproof-react」が勉強になりすぎる件
Reactアプリケーションのアーキテクチャの一例として公開されているGitHubリポジトリ「bulletproof-react」が大変勉強になるので、私自身の見解を交えつつシェアします。 ※2022年11月追記 記事リリースから1年ほど経過して、新しく出てきた情報や考え方を盛り込んだ続編記事を書いていただいているので、こちらも併せて読んでいただければと想います（@t_keshiさんありがとうございます！）。 ディレクトリ構造が勉強になる まずはプロジェクトごとにバラつきがちなディレクトリ構造について。 ソースコードはsrc以下に入れる bulletproof-reactでは、Reactに関するソースコードはsrcディレクトリ以下に格納されています。逆に言えば、ルートディレクトリにcomponentsやutilsといったディレクトリはありません。 たとえばCreate Next Appで作成
A Philosophy of Software Design：要約 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 概要 内容と動機 これは、「A Philosophy of Software Design」の要約になります。 本書の内容としては、筆者が経験ベースで、ソフトウェアの複雑性の原因とどれにどう向き合うのかをまとめた内容です。 普段チームで開発する中でわかりづらさや、設計に関する違和感を感じることがあります。 その自分の違和感が本当に正しいものなのか、仮にそうだとしたらきちんと言語化してレビューしたいという動機から本書を読むことにしました。 170ページの本書を完璧に要約することは困難なので、幾分自分にとって印象深かったことが選ばれていると
Why write ADRs
AI & MLLearn about artificial intelligence and machine learning across the GitHub ecosystem and the wider industry. Generative AILearn how to build with generative AI. GitHub CopilotChange how you work with GitHub Copilot. LLMsEverything developers need to know about LLMs. Machine learningMachine learning tips, tricks, and best practices. How AI code generation worksExplore the capabilities and be
【テーブル正規化】候補キーから第3正規化までをマスターする - Qiita
この記事は移行しました！最新の内容はこちらをご覧ください😀 はじめに 今週末はデータベーススペシャリスト試験ですね。 DBの正規化について、毎回忘れて勉強し直すのでまとめておこうと思います。 試験でも実務でも第３正規化まで出来れば大概OKですね。 下記順序で進めるのがポイントです。 非正規形 第1正規形にする 候補キーを探す ←ここがミソ！ 主キーを探す ←ここもミソ！ 第2正規形にする 第3正規形にする Qiitaなので記事テーブルを例に考えてみましょう。 記事テーブル（記事ID, 記事タイトル, カテゴリID, カテゴリ名, カテゴリ内での表示順, 作成者ユーザID, コメント番号, コメント本文, コメント投稿者ユーザID） 参考:2017年度春期試験の午後Ⅰ 電子会議投稿（電子会議番号, 議題, 分野番号, 分野名, 表示順, 作成者ユーザID, 投稿番号, 投稿本文, 投稿者ユ
オブジェクト指向のその前に-凝集度と結合度/Coheision-Coupling
Things You Thought You Didn’t Need To Care About That Have a Big Impact On Your Job
みんなRailsのSTIを誤解してないか!? - Qiita
な、なるほど...!? いや、みんなちょっと誤解してるんじゃないか? よーし、お父さん、みんながSTIを使いたくなるようにちょっと頑張っちゃうぞ! STIとは STIは、単一の継承階層に所属するクラス群を、ただひとつのテーブルを使って永続化する手法です。 PofEAA Railsのドキュメントを漁ると、次のような記述が見つかります。 http://api.rubyonrails.org/classes/ActiveRecord/Inheritance.html Note, all the attributes for all the cases are kept in the same table. Read more: www.martinfowler.com/eaaCatalog/singleTableInheritance.html このリンク先は、リファクタリングで有名なMarti
Figma: The Collaborative Interface Design Tool
Downloads Get the desktop, mobile, and font installer apps
深津 貴之 / THE GUILD / note.com on Twitter: "「誰のためのデザイン」「理解の秘密」「マテリアルデザインガイドライン」#Sarahah https://t.co/dBMll73CRo"
「誰のためのデザイン」「理解の秘密」「マテリアルデザインガイドライン」#Sarahah https://t.co/dBMll73CRo
How I write Go HTTP services after seven years
UPDATE: You can watch a video of me giving this talk at Gophercon 2019:
AIP-130: Methods
File Bug View source Edit this page AIP-130 Methods An API is composed of one or more methods, which represent a specific operation that a service can perform on behalf of the consumer. Guidance Categories of Methods The following enumerates multiple categories of methods that exist, often grouped up under some object (e.g. collection or resource) that the method operates upon. Category Name Relat
API design guide | Cloud API Design Guide | Google Cloud Documentation
Send feedback API design guide Stay organized with collections Save and categorize content based on your preferences. Changelog Introduction This is a general design guide for networked APIs. It has been used inside Google since 2014 and is the guide that Google follows when designing Cloud APIs and other Google APIs. This design guide is shared here to inform outside developers and to make it eas
GitBook – Documentation designed for your users and optimized for AI
Intelligent docs that sell, support and scale your product
カスタムメイドのロゴデザインサービス。プロフェッショナルなロゴをオンラインで
創造力豊かなプロのフリーランスデザイナーが、カスタムメイドのロゴを制作。一際輝くデザインで、ビジネスを成功に導きます。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - ByteByteGoHq/system-design-101: Explain complex systems using visuals and simple terms. Help you prepare for system design interviews.
graphql-design-tutorial/TUTORIAL.md at master · Shopify/graphql-design-tutorial
設計の「なぜ」を考える | タイム・コンサルタントの日誌から
