https://github.com/mahabubx7/react-spa-starter-kit

React (SPA) starter kit (using @react-18) with Vite, TypeScript, and Redux/RTK/Query
https://github.com/mahabubx7/react-spa-starter-kit

client-side commitlint csr eslint prettier react react-18 react-router-v6 redux redux-query redux-toolkit sass scss-modules single-page-applications spa tailwindcss tsx typescript vite

Last synced: 1 day ago
JSON representation

React (SPA) starter kit (using @react-18) with Vite, TypeScript, and Redux/RTK/Query

• Host: GitHub
• URL: https://github.com/mahabubx7/react-spa-starter-kit
• Owner: mahabubx7
• License: mit
• Created: 2024-01-14T13:24:55.000Z (10 months ago)
• Default Branch: main
• Last Pushed: 2024-01-15T18:59:44.000Z (10 months ago)
• Last Synced: 2024-01-15T22:50:00.157Z (10 months ago)
• Topics: client-side, commitlint, csr, eslint, prettier, react, react-18, react-router-v6, redux, redux-query, redux-toolkit, sass, scss-modules, single-page-applications, spa, tailwindcss, tsx, typescript, vite
• Language: TypeScript
• Homepage: https://react18-spa-starter.netlify.app/
• Size: 92.8 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# React SPA starter kit

> SPA: Single Page Application (CSR: Client Side Rendering)

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

[![Netlify Status](https://api.netlify.com/api/v1/badges/6c881c75-2100-42b2-baa2-aa945a249ec3/deploy-status)](https://app.netlify.com/sites/react18-spa-starter/deploys)

[Live preview](https://react18-spa-starter.netlify.app/)

> This project is not finished yet. It is in-development ...

### Core Features

- [x] React v18 with (updated) `react-router-dom@v6` 

- [x] Multiple layouts as initial scaffolding (i.e. Default & Dashboard)

- [x] Error handling HOC as `ErrorBoundary`

- [x] Code splitting with `Suspense` & `lazy` import for components (i.e. pages)

- [x] Linters for maintaining code quality (i.e. ESLint, Prettier, Commitlint)

- [x] TypeScript for type-safe codes

- [x] Styling `css-in-js` approach with css-module (`.scss as module`) & `TailwindCSS`

- [ ] Redux integration for global state management with `RTK` & `RTK/query` for API calls 

- [ ] Storybook integration for the components

- [ ] Testing setup & initial demos (unit, integration, and e2e)

- [ ] Testing code coverage setup with reports

- [ ] Dockerize with `Dockerfile` as example

- [ ] Optimizing assets on building process

- [ ] Making sure of lighthouse good score

Coded with :heart: by Mahabub ([@mahabubx7](https://github.com/mahabubx7))