{"id":15896844,"url":"https://github.com/mk4levi/server-side-rendering-react","last_synced_at":"2025-07-07T13:41:10.217Z","repository":{"id":181220811,"uuid":"666320115","full_name":"Mk4Levi/Server-Side-Rendering-React","owner":"Mk4Levi","description":"It 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. ","archived":false,"fork":false,"pushed_at":"2024-08-21T22:39:55.000Z","size":2157,"stargazers_count":7,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-03T13:51:11.309Z","etag":null,"topics":["expressjs","javascript","react-effects","react-query","react-states","reactjs","server","server-side-rendering"],"latest_commit_sha":null,"homepage":"https://adopt-pet-mk.vercel.app","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Mk4Levi.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-07-14T08:15:26.000Z","updated_at":"2024-08-22T02:53:00.000Z","dependencies_parsed_at":"2024-08-11T06:33:12.851Z","dependency_job_id":"600d7ee8-bea4-4fb2-948a-195482f0d37e","html_url":"https://github.com/Mk4Levi/Server-Side-Rendering-React","commit_stats":null,"previous_names":["mk4levi/server-side-rendering-react"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Mk4Levi/Server-Side-Rendering-React","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Mk4Levi%2FServer-Side-Rendering-React","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Mk4Levi%2FServer-Side-Rendering-React/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Mk4Levi%2FServer-Side-Rendering-React/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Mk4Levi%2FServer-Side-Rendering-React/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Mk4Levi","download_url":"https://codeload.github.com/Mk4Levi/Server-Side-Rendering-React/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Mk4Levi%2FServer-Side-Rendering-React/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":264087087,"owners_count":23555395,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["expressjs","javascript","react-effects","react-query","react-states","reactjs","server","server-side-rendering"],"created_at":"2024-10-06T09:23:27.956Z","updated_at":"2025-07-07T13:41:10.158Z","avatar_url":"https://github.com/Mk4Levi.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Server-Side-Rendering in React-App\n\n## =\u003e 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.\n\n## Website Link =\u003e https://adopt-pet-mk.vercel.app/\n\n## Project's Screenshots =\u003e\n\n![image](./src/assets/ss1.png)\n![image](./src/assets/ss2.png)\n![image](./src/assets/ss3.png)\n\n\u003ch2\u003eGetting Started\u003c/h2\u003e\n\n1. To get started with this project, you will need to have `Node.js` and `NPM` installed on your system.\n\n2. First, you need to open a `Terminal` in your system and `Clone` this repository by using :\n\n```bash\ngit clone https://github.com/Mk4Levi/Server-Side-Rendering-React.git\n```\n\n3. Navigate to the Project's directory :\n\n```bash\ncd Server-Side-Rendering-React\n```\n\n4. Install all Dependencies used in this Project :\n\n```bash\nnpm install\n```\n\n5. Run Build for the Client-Side :\n\n```bash\nnpm run build:client\n```\n\n6. Run Build for the Server-Side :\n\n```bash\nnpm run build:server\n```\n\n7. Finally, host it on local server :\n\n```bash\nnpm run start\n```\n\n8. Now just search this link in your browser to view the live running application in your Local sysytem :\n\n```bash\nhttp://localhost:3001\n```\n\n\u003ch2\u003ePaths \u0026 Files\u003c/h2\u003e\n\n### Structure of the Folders \u0026 Files in this Repo :\n\n```text\n.\n├── public/\n├── src\n│   ├── assets/\n│   ├── components/\n|         └── App.jsx\n|         └── Carousel.jsx\n|         └── Details.jsx\n│         └── ErrorBoundary.jsx\n│         └── Modal.jsx\n│         └── Pet.jsx\n|         └── Results.jsx\n│         └── SearchParams.jsx\n│         └── fetchBreedList.js\n│         └── fetchPet.js\n│         └── fetchSearch.js\n│         └── useBreedList.js\n│\n│   ├── contexts/\n|         └── AdoptedPetContext.jsx\n│\n│   ├──  css/\n│         └── style.css\n|\n│   ├── index.jsx\n|   ├── index.html\n│   ├── vercel.json\n│\n├── .eslintrc.json\n├── .gitattributes\n├── .gitignore\n├── package-lock.json\n├── package.json\n├── README.md\n├── vite.config.js\n\n```\n\n# Thank You\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmk4levi%2Fserver-side-rendering-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmk4levi%2Fserver-side-rendering-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmk4levi%2Fserver-side-rendering-react/lists"}