Next TS Shadcn Boilerplate

A ready to go boilerplate for starting Web Development project especially with NextJS. Focused on Simplifies the development process, enhancing efficiency and maintainability. Ensures comprehensive coverage of fundamental and common needs. Continuously striving to stay updated.

Run Locally

Clone the project

  git clone < repository link >

Go to the project directory

  cd next-ts-shadcn-boilerplate

Install dependencies

  npm install

Prepare dependencies, optional. Currently just to prepare husky.

  npm run prepare

Start the development server at port 3000

  npm run start:dev

Tech Stack

• next 14
• react 18
• shadcn ui
• tailwindcss
• react-redux
• redux-toolkit
• axios
• react-i18next
• react-lucide
• eslint
• prettier
• husky/lint-staged
• commitlint

Project Structure

public
├── fonts             # Assets for custom fonts
├── images            # Assets for images
src
├── app               # Next app routing
├── components
  ├── atoms           # Shadcn components here
  ├── molecules
  ├── organisms
  └── templates       # layout components
├── config            # App configuration and setting (redux, i18n, etc.)
├── constant          # Constant values (e.g for dropdown data)
├── hooks             # React hooks
├── langs             # languange translation data
├── lib               # Services for axios, browser storage, thirdparty, etc.
├── store             # Redux state management
  └── [feature name]
    ├── index.ts      # Redux feature's slice
    └── extras.ts     # Redux toolkit query for API fetching
├── types             # Typescript data type definition
├── utils             # Utility / helper functions
└── middleware.ts

Authors

• @Diaz-Adrianz

Feedback

If you have any feedback, please reach out me at email

License