Skip to content

Commit a62c1d7

Browse files
committed
feat: organized scalable folder structure for the project
1 parent 3c04c8c commit a62c1d7

24 files changed

+256
-129
lines changed

.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ pnpm-debug.log*
88
lerna-debug.log*
99

1010
node_modules
11+
pnpm-lock.yaml
1112
dist
1213
dist-ssr
1314
*.local

jsconfig.json

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"compilerOptions": {
3+
"baseUrl": ".",
4+
"paths": {
5+
"@/*": ["./src/*"]
6+
}
7+
}
8+
}

src/App.jsx

Lines changed: 23 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,25 @@
1-
import React, { useEffect, useState } from 'react';
2-
// import '../node_modules/bootstrap/dist/css/bootstrap.min.css';
3-
import './App.css';
4-
import './index.css';
1+
import { useEffect, useState } from "react";
2+
import "./styles/App.css";
3+
import "./styles/index.css";
54
import {
65
BrowserRouter as Router,
76
Routes,
87
Route,
98
Navigate,
10-
useLocation
11-
} from 'react-router-dom';
12-
import SearchResults from './components/search';
13-
import Login from './components/login';
14-
import SignUp from './components/register';
15-
import Home from './components/home';
16-
import Profile from './components/profile';
17-
import { ToastContainer } from 'react-toastify';
18-
import 'react-toastify/dist/ReactToastify.css';
19-
import { auth } from './components/firebase';
20-
import Navbar from './components/Navbar';
21-
import CourseDetail from './components/CourseDetail';
22-
import Dashboard from './components/dashboard';
23-
import courses from './components/courseData';
24-
import Footer from './components/Footer';
9+
} from "react-router-dom";
10+
import SearchResults from "./pages/Search";
11+
import Login from "./pages/Login";
12+
import SignUp from "./pages/Register";
13+
import Home from "./pages/Home";
14+
import Profile from "./pages/Profile";
15+
import { ToastContainer } from "react-toastify";
16+
import "react-toastify/dist/ReactToastify.css";
17+
import { auth } from "./services/firebase";
18+
import Navbar from "./components/Navbar";
19+
import CourseDetail from "./pages/CourseDetail";
20+
import Dashboard from "./pages/Dashboard";
21+
import courses from "./data/courseData";
22+
import Footer from "./components/Footer";
2523

2624
function App() {
2725
const [user, setUser] = useState(null);
@@ -49,12 +47,14 @@ function App() {
4947
<Router basename={import.meta.env.BASE_URL}>
5048
{/* <RedirectWithState /> */}
5149
<div className="App">
52-
<Navbar loggedin={user ? 'true' : 'false'} />
50+
<Navbar loggedin={user ? "true" : "false"} />
5351
<div className="auth-wrapper">
5452
<div className="auth-inner">
55-
5653
<Routes>
57-
<Route path="/" element={user ? <Navigate to="/profile" /> : <Login />} />
54+
<Route
55+
path="/"
56+
element={user ? <Navigate to="/profile" /> : <Login />}
57+
/>
5858
<Route path="/home" element={<Home />} />
5959
<Route
6060
path="/login"
@@ -68,13 +68,12 @@ function App() {
6868
<Route path="/courses/:courseName" element={<CourseDetail />} />
6969
<Route path="/" element={<Dashboard courses={courses} />} />
7070
<Route path="/search" element={<SearchResults />} />
71-
7271
</Routes>
7372
<ToastContainer />
7473
</div>
7574
</div>
7675
</div>
77-
<Footer />
76+
<Footer />
7877
</Router>
7978
);
8079
}

src/components/CourseDetail.jsx

Lines changed: 0 additions & 35 deletions
This file was deleted.

src/components/Navbar.jsx

Lines changed: 83 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1-
import React, { useState } from 'react';
2-
import logo from '../assets/images/logo.png';
3-
import { Link, useNavigate } from 'react-router-dom';
4-
import courses from './courseData';
1+
import React, { useState } from "react";
2+
import logo from "@/assets/images/logo.png";
3+
import { Link, useNavigate } from "react-router-dom";
4+
import courses from "@/data/courseData";
55

66
function Navbar({ loggedin }) {
7-
const [searchTerm, setSearchTerm] = useState('');
7+
const [searchTerm, setSearchTerm] = useState("");
88
const [suggestions, setSuggestions] = useState([]);
99
const navigate = useNavigate();
1010

@@ -16,7 +16,7 @@ function Navbar({ loggedin }) {
1616

1717
if (searchInput.trim()) {
1818
const filteredSuggestions = coursesArray.filter((course) =>
19-
course.title.toLowerCase().includes(searchInput.toLowerCase())
19+
course.title.toLowerCase().includes(searchInput.toLowerCase()),
2020
);
2121
setSuggestions(filteredSuggestions);
2222
} else {
@@ -28,7 +28,7 @@ function Navbar({ loggedin }) {
2828
event.preventDefault();
2929
if (searchTerm.trim()) {
3030
navigate(`/search?query=${encodeURIComponent(searchTerm)}`);
31-
setSuggestions([]);
31+
setSuggestions([]);
3232
}
3333
};
3434

@@ -41,43 +41,90 @@ function Navbar({ loggedin }) {
4141
return (
4242
<nav className="navbar navbar-expand-lg sticky-top bg-body-tertiary">
4343
<div className="container-fluid">
44-
<button className="navbar-toggler" type="button" data-bs-toggle="collapse"
45-
data-bs-target="#navbarExample" aria-controls="navbarExample" aria-expanded="false" aria-label="Toggle navigation">
44+
<button
45+
className="navbar-toggler"
46+
type="button"
47+
data-bs-toggle="collapse"
48+
data-bs-target="#navbarExample"
49+
aria-controls="navbarExample"
50+
aria-expanded="false"
51+
aria-label="Toggle navigation"
52+
>
4653
<span className="navbar-toggler-icon"></span>
4754
</button>
48-
<Link className="navbar-brand" to="/"><img src={logo} width="36" alt="Logo" className="rounded-circle" /></Link>
55+
<Link className="navbar-brand" to="/">
56+
<img src={logo} width="36" alt="Logo" className="rounded-circle" />
57+
</Link>
4958
<div className="collapse navbar-collapse" id="navbarExample">
5059
<ul className="navbar-nav me-auto mb-0">
51-
{loggedin === 'true' ? (
60+
{loggedin === "true" ? (
5261
<li className="nav-item">
53-
<Link className="nav-link active" aria-current="page" to="/home">Home</Link>
62+
<Link
63+
className="nav-link active"
64+
aria-current="page"
65+
to="/home"
66+
>
67+
Home
68+
</Link>
5469
</li>
5570
) : (
5671
<li className="nav-item">
57-
<Link className="nav-link active" aria-current="page" to="/">Home</Link>
72+
<Link className="nav-link active" aria-current="page" to="/">
73+
Home
74+
</Link>
5875
</li>
5976
)}
6077
<li className="nav-item">
61-
<Link className="nav-link" aria-current="page" to="/events">Events</Link>
78+
<Link className="nav-link" aria-current="page" to="/events">
79+
Events
80+
</Link>
6281
</li>
6382
<li className="nav-item dropdown">
64-
<Link className="nav-link dropdown-toggle" to="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Courses</Link>
83+
<Link
84+
className="nav-link dropdown-toggle"
85+
to="#"
86+
role="button"
87+
data-bs-toggle="dropdown"
88+
aria-expanded="false"
89+
>
90+
Courses
91+
</Link>
6592
<ul className="dropdown-menu">
66-
<li><Link className="dropdown-item" to="/programming-languages">Programming Languages</Link></li>
67-
<li><Link className="dropdown-item" to="/frameworks">Frameworks</Link></li>
68-
<li><hr className="dropdown-divider" /></li>
69-
<li><Link className="dropdown-item" to="/roadmaps">Roadmaps</Link></li>
93+
<li>
94+
<Link className="dropdown-item" to="/programming-languages">
95+
Programming Languages
96+
</Link>
97+
</li>
98+
<li>
99+
<Link className="dropdown-item" to="/frameworks">
100+
Frameworks
101+
</Link>
102+
</li>
103+
<li>
104+
<hr className="dropdown-divider" />
105+
</li>
106+
<li>
107+
<Link className="dropdown-item" to="/roadmaps">
108+
Roadmaps
109+
</Link>
110+
</li>
70111
</ul>
71112
</li>
72113
</ul>
73114

74-
{loggedin === 'true' ? (
115+
{loggedin === "true" ? (
75116
<div className="d-flex align-items-center flex-column flex-lg-row">
76-
77117
<div className="me-2 mb-2 mb-lg-0 position-relative">
78118
<form className="input-group" onSubmit={handleSearchSubmit}>
79119
<span className="input-group-text" id="basic-addon1">
80-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" className="bi bi-search" viewBox="0 0 16 16">
120+
<svg
121+
xmlns="http://www.w3.org/2000/svg"
122+
width="16"
123+
height="16"
124+
fill="currentColor"
125+
className="bi bi-search"
126+
viewBox="0 0 16 16"
127+
>
81128
<path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001q.044.06.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1 1 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0"></path>
82129
</svg>
83130
</span>
@@ -91,24 +138,34 @@ function Navbar({ loggedin }) {
91138
</form>
92139

93140
{suggestions.length > 0 && (
94-
<ul className="list-group position-absolute w-100 mt-1 z-index-1000" style={{ zIndex: '1000' }}>
141+
<ul
142+
className="list-group position-absolute w-100 mt-1 z-index-1000"
143+
style={{ zIndex: "1000" }}
144+
>
95145
{suggestions.map((suggestion, index) => (
96146
<li
97147
key={index}
98148
className="list-group-item"
99149
onClick={() => handleSuggestionClick(suggestion)}
100-
style={{ cursor: 'pointer' }}
150+
style={{ cursor: "pointer" }}
101151
>
102152
{suggestion.title}
103153
</li>
104154
))}
105155
</ul>
106156
)}
107157
</div>
108-
<span><Link className="btn clk rounded-circle" to="/profile"><i className="fa-regular fa-user"></i></Link> Profile</span>
158+
<span>
159+
<Link className="btn clk rounded-circle" to="/profile">
160+
<i className="fa-regular fa-user"></i>
161+
</Link>{" "}
162+
Profile
163+
</span>
109164
</div>
110165
) : (
111-
<Link className="btn btn-primary clk" to="/login">Sign up</Link>
166+
<Link className="btn btn-primary clk" to="/login">
167+
Sign up
168+
</Link>
112169
)}
113170
</div>
114171
</div>

src/components/home.jsx

Lines changed: 0 additions & 11 deletions
This file was deleted.

src/context/ThemeContext.jsx

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import { createContext, useState, useContext } from "react";
2+
3+
const ThemeContext = createContext();
4+
5+
export const ThemeProvider = ({ children }) => {
6+
const [theme, setTheme] = useState("light");
7+
8+
const toggleTheme = () => {
9+
setTheme((prevTheme) => (prevTheme === "light" ? "dark" : "light"));
10+
};
11+
12+
return (
13+
<ThemeContext.Provider value={{ theme, toggleTheme }}>
14+
{children}
15+
</ThemeContext.Provider>
16+
);
17+
};
18+
19+
export const useTheme = () => {
20+
return useContext(ThemeContext);
21+
};
File renamed without changes.

src/hooks/useDemo.jsx

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import { useState } from "react";
2+
3+
const useDemo = (initialValue = 0) => {
4+
const [count, setCount] = useState(initialValue);
5+
6+
const increment = () => {
7+
setCount((prevCount) => prevCount + 1);
8+
};
9+
10+
const decrement = () => {
11+
setCount((prevCount) => prevCount - 1);
12+
};
13+
14+
const reset = () => {
15+
setCount(initialValue);
16+
};
17+
18+
return { count, increment, decrement, reset };
19+
};
20+
21+
export default useDemo;

src/main.jsx

Lines changed: 8 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,12 @@
1-
import { StrictMode } from 'react'
2-
import { createRoot } from 'react-dom/client'
3-
import App from './App.jsx'
4-
import './index.css'
5-
import 'bootstrap/dist/css/bootstrap.min.css';
6-
import 'bootstrap/dist/js/bootstrap.bundle.min.js';
1+
import { StrictMode } from "react";
2+
import { createRoot } from "react-dom/client";
3+
import App from "./App.jsx";
4+
import "./styles/index.css";
5+
import "bootstrap/dist/css/bootstrap.min.css";
6+
import "bootstrap/dist/js/bootstrap.bundle.min.js";
77

8-
9-
createRoot(document.getElementById('root')).render(
8+
createRoot(document.getElementById("root")).render(
109
<StrictMode>
1110
<App />
1211
</StrictMode>,
13-
)
12+
);

0 commit comments

Comments
 (0)