Installation
npx create-react-app appName
OR with typescript
npx create-react-app appName --template typescript
Absolute path
Absolute path help us to not care about the folder structure changes even in the middle of development or frequent folder structure changes as it can access files from the root or src
folder
Create a file as jsconfig.json
in the root of application and paste the code below:
{
"compilerOptions": {
"baseUrl": "src"
},
"include": ["src"]
}
Don't go with CSS
SCSS
instead of inbuilt CSS
Just include the below line in the dependencies
inside the package.json
file
"node-sass": "npm:sass@^1.49.9"
Ignore the above if you are using any style system
Choose any UI library like bootstrap
Make page attractive even if its a assignment or learning based project
Paste it inside index.html
<!-- CSS only -->
<link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi"
crossorigin="anonymous"
/>
optional
Router Config
import { BrowserRouter, Routes, Route, NavLink } from "react-router-dom";
Set the config of path
<BrowserRouter>
<div className="container">
<Nav />
<Routes>
<Route index path="/" element={<Landing />} />
<Route path="about" element={<About />} />
<Route path="profile" element={<Profile />} />
</Routes>
</div>
</BrowserRouter>
Use them
<NavLink to="/" className="nav-link"> Home </NavLink>
Top comments (0)