Skip to main content

Migration from legacy

WIP

The article is in the process of writing

To bring the release of the article closer, you can:


🍰 Stay tuned!

The article aggregates the experience of several companies and projects on moving to feature-sliced with different initial conditions

Why?

How much does the move need? "Death by a thousand cuts" and those debt. What is missing? How can the methodology help?

See the talk of Ilya Klimov about the need and procedure for refactoring

approaches-themed-bordered

What's the plan?

1. Unification of the code base

- β”œβ”€β”€ products/
- | β”œβ”€β”€ components/
- | β”œβ”€β”€ containers/
- | β”œβ”€β”€ store/
- | β”œβ”€β”€ styles/
- β”œβ”€β”€ checkout/
- | β”œβ”€β”€ components/
- | β”œβ”€β”€ containers/
- | β”œβ”€β”€ helpers/
- | β”œβ”€β”€ styles/
+ └── src/
β”œβ”€β”€ actions/
β”œβ”€β”€ api/
+ β”œβ”€β”€ components/
+ β”œβ”€β”€ containers/
β”œβ”€β”€ constants/
β”œβ”€β”€ epics/
+ β”œβ”€β”€ i18n/
β”œβ”€β”€ modules/
+ β”œβ”€β”€ helpers/
+ β”œβ”€β”€ pages/
- β”œβ”€β”€ routes/
- β”œβ”€β”€ utils/
β”œβ”€β”€ reducers/
- β”œβ”€β”€ redux/
β”œβ”€β”€ selectors/
+ β”œβ”€β”€ store
+ β”œβ”€β”€ styles/
β”œβ”€β”€ App.jsx
└── index.jsx

2. Putting together the destructive decoupled

  └── src/
- β”œβ”€β”€ actions/
β”œβ”€β”€ api/
- β”œβ”€β”€ components/
- β”œβ”€β”€ containers/
- β”œβ”€β”€ constants/
- β”œβ”€β”€ epics/
+ β”œβ”€β”€ entities/{...}
+ | β”œβ”€β”€ ui
+ | β”œβ”€β”€ model/{actions, selectors, ...}
+ | β”œβ”€β”€ lib
β”œβ”€β”€ i18n/
| # We can temporarily put the remaining segments here
+ β”œβ”€β”€ modules/{helpers, constants}
- β”œβ”€β”€ helpers/
β”œβ”€β”€ pages/
- β”œβ”€β”€ reducers/
- β”œβ”€β”€ selectors/
- β”œβ”€β”€ store/
β”œβ”€β”€ styles/
β”œβ”€β”€ App.jsx
└── index.jsx

3. Allocate scopes of responsibility

 └── src/
- β”œβ”€β”€ api/
+ β”œβ”€β”€ app/
+ | β”œβ”€β”€ index.jsx
+ | β”œβ”€β”€ style.css
β”œβ”€β”€ pages/
+ β”œβ”€β”€ features/
+ | β”œβ”€β”€ add-to-cart/{ui, model, lib}
+ | β”œβ”€β”€ choose-delivery/{ui, model, lib}
+ β”œβ”€β”€ entities/{...}
+ | β”œβ”€β”€ delivery/{ui, model, lib}
+ | β”œβ”€β”€ cart/{ui, model, lib}
+ | β”œβ”€β”€ product/{ui, model, lib}
+ β”œβ”€β”€ shared/
+ | β”œβ”€β”€ api/
+ | β”œβ”€β”€ lib/ # helpers
+ | | β”œβ”€β”€ i18n/
+ | β”œβ”€β”€ config/ # constants
- β”œβ”€β”€ i18n/
- β”œβ”€β”€ modules/{helpers, constants}
└── index.jsx

4. Final ?

About the remaining problems and how much it is worth eliminating them

See also