0% found this document useful (0 votes)
32 views

React Tutorial Guide

Here is the tutorial for react

Uploaded by

nazirashraf274
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
32 views

React Tutorial Guide

Here is the tutorial for react

Uploaded by

nazirashraf274
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 1

How to Create React App

Commands:
npx create-react-app demo
cd demo
npm start
npm install [email protected]

Go to SRC-->index.js
import { BrowserRouter } from 'react-router-dom';
Replace left side with right side:
<React.StrictMode> <BrowserRouter>
<App /> <App />
</React.StrictMode> </BrowserRouter>

Go to SRC-->App.js
1. import { Switch,Route } from 'react-router-dom';
2. remove content of app instead f div tag, then write switch tag and then route like
<Switch>
<Route exact path="/" component={Navbar}/>
</Switch>

make new folder,file, SRC-->Components-->.jsx files


1. install extension Es7 reat/redux/graphQL.....
2. now in jsx files , write "rfc" and press "tab" button, the starting template will be written
3. import all the jsx files in APP.js like
4. import Navbar from './Compunents/navbar';
5. then write routes
<Switch>
<Route exact path="/" component={Navbar}/>
</Switch>
MDB Installation:
npm i mdb-react-ui-kit
npm i @fortawesome/fontawesome-free

1. Public-->index.js
2. add in header section
3. <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"
rel="stylesheet" />
4. paste in your .jsx files
5. import 'mdb-react-ui-kit/dist/css/mdb.min.css';
6. import "@fortawesome/fontawesome-free/css/all.min.css";

You might also like