---
title: "The Vertical Codebase"
url: https://daily.dev/posts/the-vertical-codebase-kioev85i9
source_url: https://tkdodo.eu/blog/the-vertical-codebase
type: article
source: "TkDodo"
published: 2026-04-20T13:19:40.201Z
updated: 2026-04-20T13:23:13.163Z
tags: ["general-programming", "react", "typescript"]
reading_time: 9
upvotes: 73
comments: 5
language: en
---

> ## Documentation Index
> Fetch the complete documentation index at: https://daily.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# The Vertical Codebase

**[TkDodo](https://daily.dev/sources/tkdodo)** · 9 min read · 73 upvotes · 5 comments

## Summary

Horizontal codebase structures that group code by type (components, hooks, utils, types) create poor cohesion and make large codebases hard to navigate. The alternative is a vertical structure that groups code by domain or feature — everything related to 'widgets' lives in src/widgets/, regardless of whether it's a component, hook, or utility. This mirrors how product teams are organized and reduces cognitive load. Shared code that spans multiple features becomes its own vertical. To enforce boundaries between verticals, tools like pnpm workspaces, Nx dependency rules, or eslint-plugin-boundaries can define public interfaces and prevent unintended coupling. The tradeoffs include difficulty choosing the right vertical and risk of duplicated implementations across teams.

## Full article

daily.dev links to this article rather than hosting it. Read it at the original source: <https://tkdodo.eu/blog/the-vertical-codebase>

## Community discussion

Top comments from developers on daily.dev.

**@fredyns** · 5 upvotes

> aggree on this.

**@ghost** · 3 upvotes

> That’s why i hate file based routers because they force me to put page component to specific directory instead having it with all other code related to a page

**@zetasol** · 3 upvotes

> good

**@fullstackkraken** · 2 upvotes

> Interesting article

## Similar posts on daily.dev

- [How I Learned to Structure React Projects Around Change, Not Folders](https://daily.dev/posts/how-i-learned-to-structure-react-projects-around-change-not-folders-ccelaqkhn) · Medium · 120 upvotes · 5 comments

---

Tags: [#general-programming](https://daily.dev/tags/general-programming), [#react](https://daily.dev/tags/react), [#typescript](https://daily.dev/tags/typescript)

[View this post on daily.dev](https://daily.dev/posts/the-vertical-codebase-kioev85i9)