Skip to content

Commit 279e6d6

Browse files
RabbitDaCoderRabbitDaCoder
committed
refactor: replace TanStack Router with React Router DOM
- Removed TanStack Router due to complexity in handling admin vs public routes - Integrated React Router DOM for simpler route layouts - Added support for admin routes with sidebar + outlet - Public routes now share header & footer layout
1 parent 91fdaee commit 279e6d6

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

64 files changed

+5857
-1562
lines changed

‎client/README.md‎

Lines changed: 202 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -1,54 +1,203 @@
1-
# React + TypeScript + Vite
2-
3-
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
4-
5-
Currently, two official plugins are available:
6-
7-
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) for Fast Refresh
8-
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
9-
10-
## Expanding the ESLint configuration
11-
12-
If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
13-
14-
```js
15-
export default tseslint.config({
16-
extends: [
17-
// Remove ...tseslint.configs.recommended and replace with this
18-
...tseslint.configs.recommendedTypeChecked,
19-
// Alternatively, use this for stricter rules
20-
...tseslint.configs.strictTypeChecked,
21-
// Optionally, add this for stylistic rules
22-
...tseslint.configs.stylisticTypeChecked,
23-
],
24-
languageOptions: {
25-
// other options...
26-
parserOptions: {
27-
project: ['./tsconfig.node.json', './tsconfig.app.json'],
28-
tsconfigRootDir: import.meta.dirname,
29-
},
30-
},
31-
})
32-
```
33-
34-
You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:
35-
36-
```js
37-
// eslint.config.js
38-
import reactX from 'eslint-plugin-react-x'
39-
import reactDom from 'eslint-plugin-react-dom'
40-
41-
export default tseslint.config({
42-
plugins: {
43-
// Add the react-x and react-dom plugins
44-
'react-x': reactX,
45-
'react-dom': reactDom,
46-
},
47-
rules: {
48-
// other rules...
49-
// Enable its recommended typescript rules
50-
...reactX.configs['recommended-typescript'].rules,
51-
...reactDom.configs.recommended.rules,
52-
},
53-
})
1+
Perfect! Here's a detailed and well-explained `README.md` installation guide message for your boilerplate repo that includes multiple boilerplate options (MERN, React, Laravel, Python, etc.). This will help **any developer understand how to clone and use your boilerplate project** with ease.
2+
3+
---
4+
5+
## 🚀 Boilerplate Project Setup Guide
6+
7+
Welcome to the **Multi-Stack Boilerplate Repository** — a powerful starting point for your next project. This repo supports multiple technology stacks including:
8+
9+
- ✅ MERN Stack (MongoDB, Express, React, Node.js)
10+
- ✅ React Only (Vite + Tailwind)
11+
- ✅ React + Laravel (PHP)
12+
- ✅ React + Django (Python)
13+
- ✅ React + C#/.NET
14+
- ✅ React + Java (Spring Boot)
15+
- ✅ Vanilla JavaScript Projects
16+
17+
---
18+
19+
### 📦 Cloning the Project
20+
21+
To get started, **clone the boilerplate repository**:
22+
23+
```bash
24+
git clone https://github.com/your-username/your-boilerplate-repo.git
25+
```
26+
27+
Then, navigate into the specific stack folder you want to use:
28+
29+
```bash
30+
cd your-boilerplate-repo/<stack-name>
31+
```
32+
33+
> 🔁 Example:
34+
35+
```bash
36+
cd your-boilerplate-repo/mern
37+
```
38+
39+
---
40+
41+
### 🛠️ Project Structure
42+
43+
The repository may contain folders like:
44+
45+
```
46+
boilerplate/
47+
├── mern/ → Full-stack MERN (client + server)
48+
├── react/ → React-only (Vite + Tailwind)
49+
├── react-laravel/ → React frontend + Laravel backend
50+
├── react-django/ → React + Django REST
51+
├── react-dotnet/ → React + .NET Core Web API
52+
├── react-java/ → React + Spring Boot
53+
├── vanilla-js/ → Vanilla HTML/CSS/JS Starter
54+
```
55+
56+
---
57+
58+
### 📁 How to Use a Specific Stack
59+
60+
#### ✅ MERN Boilerplate
61+
62+
```bash
63+
cd mern/client
64+
npm install
65+
66+
cd ../server
67+
npm install
68+
```
69+
70+
To run both:
71+
72+
```bash
73+
# In one terminal
74+
cd mern/client
75+
npm run dev
76+
77+
# In another terminal
78+
cd mern/server
79+
npm run dev
80+
```
81+
82+
> Make sure MongoDB is running locally or update the connection URI in `.env`.
83+
84+
---
85+
86+
#### ✅ React Only (Vite + Tailwind)
87+
88+
```bash
89+
cd react
90+
npm install
91+
npm run dev
92+
```
93+
94+
TailwindCSS v4 is pre-installed with dark mode plugin.
95+
96+
---
97+
98+
#### ✅ React + Laravel (PHP)
99+
100+
```bash
101+
cd react-laravel
102+
103+
# React Frontend
104+
cd client
105+
npm install
106+
npm run dev
107+
108+
# Laravel Backend
109+
cd ../backend
110+
composer install
111+
cp .env.example .env
112+
php artisan key:generate
113+
php artisan serve
114+
```
115+
116+
> Make sure to configure your database in the Laravel `.env` file.
117+
118+
---
119+
120+
#### ✅ React + Django
121+
122+
```bash
123+
cd react-django
124+
125+
# React Frontend
126+
cd frontend
127+
npm install
128+
npm run dev
129+
130+
# Django Backend
131+
cd ../backend
132+
pip install -r requirements.txt
133+
python manage.py runserver
134+
```
135+
136+
---
137+
138+
#### ✅ React + .NET
139+
140+
```bash
141+
cd react-dotnet
142+
143+
# React Frontend
144+
cd client
145+
npm install
146+
npm run dev
147+
148+
# .NET Backend
149+
cd ../server
150+
dotnet run
151+
```
152+
153+
---
154+
155+
#### ✅ React + Java Spring Boot
156+
157+
```bash
158+
cd react-java
159+
160+
# React Frontend
161+
cd frontend
162+
npm install
163+
npm run dev
164+
165+
# Java Backend
166+
cd ../backend
167+
./mvnw spring-boot:run
54168
```
169+
170+
---
171+
172+
### 🧪 Testing (Optional)
173+
174+
Each stack may come with its own testing tools like:
175+
176+
- Vitest/Jest for React
177+
- PHPUnit for Laravel
178+
- Pytest for Django
179+
- xUnit for .NET
180+
181+
Refer to each folder’s README or `package.json`/`composer.json` for details.
182+
183+
---
184+
185+
### 🤝 Contribution
186+
187+
Feel free to contribute by improving any stack boilerplate or adding new ones!
188+
189+
---
190+
191+
### 📄 License
192+
193+
This boilerplate repository is open-source and free to use under the [MIT License](LICENSE).
194+
195+
---
196+
197+
### ✅ Final Words
198+
199+
> Clone once, build anything.
200+
> Just `cd` into the stack you need, install, and run.
201+
> Happy hacking! 🧠⚙️💻
202+
203+
---

‎client/components.json‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
{
2+
"$schema": "https://ui.shadcn.com/schema.json",
3+
"style": "new-york",
4+
"rsc": false,
5+
"tsx": true,
6+
"tailwind": {
7+
"config": "",
8+
"css": "src/App.css",
9+
"baseColor": "zinc",
10+
"cssVariables": true,
11+
"prefix": ""
12+
},
13+
"aliases": {
14+
"components": "../components",
15+
"utils": "../../lib/utils",
16+
"ui": "../components/ui",
17+
"lib": "../../lib",
18+
"hooks": "../../hooks"
19+
},
20+
"iconLibrary": "lucide"
21+
}

‎client/index.html‎

Lines changed: 56 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,66 @@
1-
<!doctype html>
1+
<!DOCTYPE html>
22
<html lang="en">
33
<head>
44
<meta charset="UTF-8" />
5-
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
5+
6+
<!-- favicon -->
7+
<link rel="icon" type="image/png" href="/favicon.png" />
8+
9+
<!-- responsive scaling for mobile -->
610
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7-
<title>Vite + React + TS</title>
11+
12+
<!-- browser tab title -->
13+
<title>AegisExpressLogistics | Delivery Website</title>
14+
15+
<!-- SEO -->
16+
<meta
17+
name="description"
18+
content="Fast, reliable, and secure delivery services with AegisExpressLogistics. Track your packages and enjoy seamless logistics solutions."
19+
/>
20+
<meta
21+
name="keywords"
22+
content="delivery, logistics, courier, shipping, package tracking, AegisExpress"
23+
/>
24+
<meta name="author" content="AegisExpressLogistics" />
25+
<meta name="robots" content="index, follow" />
26+
27+
<!-- Open Graph / Facebook -->
28+
<meta property="og:title" content="AegisExpressLogistics" />
29+
<meta
30+
property="og:description"
31+
content="Fast, reliable, and secure delivery services with real-time package tracking."
32+
/>
33+
<meta property="og:image" content="/preview.png" />
34+
<meta property="og:url" content="https://aegisexpress.com" />
35+
<meta property="og:type" content="website" />
36+
37+
<!-- Twitter -->
38+
<meta name="twitter:card" content="summary_large_image" />
39+
<meta name="twitter:title" content="AegisExpressLogistics" />
40+
<meta
41+
name="twitter:description"
42+
content="Delivering packages safely and quickly with AegisExpressLogistics."
43+
/>
44+
<meta name="twitter:image" content="/preview.png" />
45+
46+
<!-- PWA / Mobile -->
47+
<meta name="theme-color" content="#16a34a" />
48+
<meta name="apple-mobile-web-app-capable" content="yes" />
49+
<meta
50+
name="apple-mobile-web-app-status-bar-style"
51+
content="black-translucent"
52+
/>
53+
<meta name="apple-mobile-web-app-title" content="AegisExpressLogistics" />
54+
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
55+
56+
<!-- Manifest (optional for PWA) -->
57+
<link rel="manifest" href="/manifest.json" />
858
</head>
959
<body>
60+
<!-- React app root -->
1061
<div id="root"></div>
62+
63+
<!-- Vite injects your React bundle here -->
1164
<script type="module" src="/src/main.tsx"></script>
1265
</body>
1366
</html>

0 commit comments

Comments
 (0)