xxxxxxxxxx
return (
< Router>
<div className="App" >
<Routes>
<Route path='/'
element={
<Fragment>
< NavBar />
< NewsLetterCard />
< TestimonialsCard />
< ServicesCard />
< ContactsCard />
< Footer />
</Fragment>
}
/>
</Routes>
</div>
</Router>
);
}
xxxxxxxxxx
<script crossorigin src="https://unpkg.com/react@18/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
xxxxxxxxxx
// I would suggest using function components react hooks
// if you use react version > 16.8. React function components have
// various advantages over React class. Check them out here:
// https://reactjs.org/docs/hooks-intro.html
import React, { useState } from 'react';
const Example = (props) => {
// Declare a new state variable, which we'll call "count"
const [count, setCount] = useState(0);
return (
<div>
<p>Hello {props.name}. You clicked {count} times</p>
<button onClick={() => setCount(count + 1)}>
Click me
</button>
</div>
);
}
xxxxxxxxxx
React is a free and open-source front-end JavaScript library for building user interfaces based on UI components. It is maintained by Meta and a community of individual developers and companies.
To start with react: install node in your device
then open terminal and run :
npx create-react-app my-app
cd my-app
npm start
xxxxxxxxxx
A JS Library that is considered one of the best frameworks/libraries of JS, Thi is Made by Facebook, If u want check out Clever Programmer, the god of React in Youtube
xxxxxxxxxx
ReactDOM.render(JSX, document.getElementById("challenge-node"));