loading...
Cover image for Celebrating 100 🌟 on React Boilerplate

Celebrating 100 🌟 on React Boilerplate

gkhan205 profile image Ghazi Khan ・1 min read

Last month I shared a React boilerplate which for me worked as the best architecture. I have not expected it to get 100 🌟 but in a month my repository reached this milestone.

I feel proud that people are liking the way I structured my apps.

I was to create a typescript version but couldn't as I was super busy with my office's work.

This milestone has encouraged me to create a typescript version soon.

You can check the written blog here for full explanation:- https://codewithghazi.com/best-scalable-react-app-architecture-2020/

You can check the repo here:-

GitHub logo gkhan205 / cwg-react-starter

Pre-configured and Ready to use React Starter App. To save time in settings things up for new project. Almost everything needed is already configured. Just clone and start developing without wasting time in doing same stuffs for every project. (#codewithghazi)

GitHub license GitHub stars GitHub issues

CWG React Starter

Pre-configured and Ready to use React Starter App. To save time in settings things up for new project. Almost everything needed is already configured. Just clone and start developing without wasting time in doing same stuffs for every project

Read detailed explanation here

Overview

Things included in this starter app

  • Folder Structure
  • Axios Interceptor
  • Redux with Redux-Thunk
  • Router with Private Route
  • Confugured for SCSS/SASS
  • Eslint & Prettier
  • Pre-commit Hook
  • Absolute Imports

Please follow this import style for better code readability

Folder Structure

Big and extensive React application should have well planned and organized project structure. Best way is to use a mix of strategies to achieve better results as I am going to describe next.

Top level project architecture (which is under src/ folder) should be organized by type. No files should be here, just folders. This way it will be clear and understandable. Similar to a…

Discussion

pic
Editor guide