=> Adopt-Pet-SSR is a dynamic web application that incorporates Server-Side-Rendering (SSR). By rendering components on the server before sending them to the client, it ensures faster initial page loads and improves search engine optimization. Experience the benefits of server-side rendering in this innovative React project.
Website Link => https://adopt-pet-mk.vercel.app/
-
To get started with this project, you will need to have
Node.js
andNPM
installed on your system. -
First, you need to open a
Terminal
in your system andClone
this repository by using :
git clone https://github.com/Mk4Levi/Server-Side-Rendering-React.git
- Navigate to the Project's directory :
cd Server-Side-Rendering-React
- Install all Dependencies used in this Project :
npm install
- Run Build for the Client-Side :
npm run build:client
- Run Build for the Server-Side :
npm run build:server
- Finally, host it on local server :
npm run start
- Now just search this link in your browser to view the live running application in your Local sysytem :
http://localhost:3001
.
├── public/
├── src
│ ├── assets/
│ ├── components/
| └── App.jsx
| └── Carousel.jsx
| └── Details.jsx
│ └── ErrorBoundary.jsx
│ └── Modal.jsx
│ └── Pet.jsx
| └── Results.jsx
│ └── SearchParams.jsx
│ └── fetchBreedList.js
│ └── fetchPet.js
│ └── fetchSearch.js
│ └── useBreedList.js
│
│ ├── contexts/
| └── AdoptedPetContext.jsx
│
│ ├── css/
│ └── style.css
|
│ ├── index.jsx
| ├── index.html
│ ├── vercel.json
│
├── .eslintrc.json
├── .gitattributes
├── .gitignore
├── package-lock.json
├── package.json
├── README.md
├── vite.config.js