DEV Community

Adomas S
Adomas S

Posted on

Q: How would you structure project code?

Note: new here at dev.to, and couldn't quickly find a similar post/thread

How would you structure project code? (I'm talking mostly about directories here)

I mainly work in web development with React, but I have worked on multiple project in varying size and longevity.

One thing that always annoys me is when I see, what I call, (maybe there's a proper word for it) MVC architecture (explained below). The (only?) other way of structuring code is with what I call Feature based architecture, which I think is far more superior.

"MVC architecture"

src/
  models/
    Post.code
  views/
    Post.code
  controllers/
    Post.code
Enter fullscreen mode Exit fullscreen mode

or

src/
  reducers/
  actions/
  components/
Enter fullscreen mode Exit fullscreen mode

It's when code is structured by layers and in my experience structuring code in this way have two main issues:

  1. Hard to find related code - if I'm trying to pin down code for a specific logic and start at views/PostActions.code I will be lucky if the code I'm looking for is in models/PostActions.code, but most of the cases PostActions will have multiple actions which will do different things in model layer, good luck finding it by names alone.
  2. Collaboration and code reuse - If I need to do something new in views/PostActions, I'll look there, and will only see code related to it's view, but when adding new code I'm less likely to find a model/Something, which I could reuse and not re-implement.

Feature based architecture

Where code is structured by logical parts or domains if you will.

src/
  post/
    View.code
    Model.code
    Controller.code
Enter fullscreen mode Exit fullscreen mode

I find this way better since it's easier to see the whole code that is related to the post, which greatly reduces both issues I mentioned in "MVC architecture". If code needs to be reused it can be extracted above post which will indicate that this file can be used in all files "bellow".

What do you use?

So, let me know what you think of these? Are there any other way to structure code? Which you prefer? And do you even care?

Sentry image

Hands-on debugging session: instrument, monitor, and fix

Join Lazar for a hands-on session where you’ll build it, break it, debug it, and fix it. You’ll set up Sentry, track errors, use Session Replay and Tracing, and leverage some good ol’ AI to find and fix issues fast.

RSVP here →

Top comments (0)

The Most Contextual AI Development Assistant

Pieces.app image

Our centralized storage agent works on-device, unifying various developer tools to proactively capture and enrich useful materials, streamline collaboration, and solve complex problems through a contextual understanding of your unique workflow.

👥 Ideal for solo developers, teams, and cross-company projects

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay