{"id":16470819,"url":"https://github.com/preetiraj3697/reactjs-integration-with-backend","last_synced_at":"2026-04-13T19:31:38.922Z","repository":{"id":226486087,"uuid":"768816340","full_name":"Preetiraj3697/ReactJS-Integration-with-Backend","owner":"Preetiraj3697","description":"This project showcases the integration of React frontend with Express backend for managing user data. Features include CRUD operations via RESTful APIs, React Router navigation, MongoDB integration, and separate READMEs for frontend and backend setup.","archived":false,"fork":false,"pushed_at":"2024-03-15T19:08:52.000Z","size":69,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-02-28T07:37:38.793Z","etag":null,"topics":["axios","backend","cors","crud","expressjs","frontend","full-stack","mongodb","mongodb-atlas","mongoose","nodejs","react","react-router","restful-api"],"latest_commit_sha":null,"homepage":"https://react-js-integration-with-frontend-backend.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/Preetiraj3697.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":"2024-03-07T19:37:35.000Z","updated_at":"2024-03-15T18:45:12.000Z","dependencies_parsed_at":"2024-10-11T12:11:58.705Z","dependency_job_id":"5a7cfb49-e692-4b79-96ee-eba96ffa74b7","html_url":"https://github.com/Preetiraj3697/ReactJS-Integration-with-Backend","commit_stats":null,"previous_names":["preetiraj3697/reactjs-integration-with-backend"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Preetiraj3697/ReactJS-Integration-with-Backend","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Preetiraj3697%2FReactJS-Integration-with-Backend","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Preetiraj3697%2FReactJS-Integration-with-Backend/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Preetiraj3697%2FReactJS-Integration-with-Backend/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Preetiraj3697%2FReactJS-Integration-with-Backend/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Preetiraj3697","download_url":"https://codeload.github.com/Preetiraj3697/ReactJS-Integration-with-Backend/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Preetiraj3697%2FReactJS-Integration-with-Backend/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31768635,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-13T15:25:13.801Z","status":"ssl_error","status_checked_at":"2026-04-13T15:25:09.162Z","response_time":93,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["axios","backend","cors","crud","expressjs","frontend","full-stack","mongodb","mongodb-atlas","mongoose","nodejs","react","react-router","restful-api"],"created_at":"2024-10-11T12:11:50.527Z","updated_at":"2026-04-13T19:31:38.903Z","avatar_url":"https://github.com/Preetiraj3697.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"**Frontend README**\n\n---\n\n# React-Express User Data Manager\n\n## Frontend - ReactJS Integration with Backend APIs\n\nThis project demonstrates the integration of a ReactJS frontend with backend APIs for managing user data.\n\n### Deploy Link:\n```bash\nhttps://react-js-integration-with-frontend-backend.vercel.app\n```\n\n### Features\n\n- Displaying user data fetched from the backend API.\n- Adding new entries to the user data through the frontend interface.\n- Updating existing user data using the provided form.\n- Displaying counts of add and update operations.\n\n### Technologies Used\n\n- ReactJS\n- Axios for HTTP requests\n- React Router for navigation\n\n### Setup Instructions\n\n1. Clone the repository to your local machine:\n\n```bash\ngit clone https://github.com/Preetiraj3697/ReactJS-Integration-with-Backend.git\n```\n\n2. Navigate to the frontend directory:\n\n```bash\ncd client\n```\n\n3. Install dependencies:\n\n```bash\nnpm install\n```\n\n4. Start the development server:\n\n```bash\nnpm start\n```\n\n5. Open your browser and visit [http://localhost:3000](http://localhost:3000) to view the application.\n\n### Usage\n\n- Navigate between different pages using the navigation links.\n- Use the \"AddEntry\" page to add new entries to the user data.\n- Use the \"Home\" page to view the existing user data and update entries if needed.\n\n### Responsive Design\n\nThe application is designed to be responsive on various devices:\n\n- Mobile\n- Tablet\n- Desktop\n\n**Backend README**\n\n---\n\n# React-Express User Data Manager\n\n## Backend - ExpressJS API for User Data Management\n\nThis project provides an ExpressJS backend API for managing user data.\n\n### Deploy Link:\n```bash\nhttps://react-js-integration-with-backend-yaf6.vercel.app/api/entries\n```\n\n### Features\n\n- API endpoints for adding new entries and updating existing entries in the user data.\n- API endpoint for fetching the count of add and update operations.\n- MongoDB database integration for storing user data.\n\n### Technologies Used\n\n- ExpressJS\n- MongoDB\n- Mongoose for MongoDB integration\n- cors\n- nodemon\n\n### Setup Instructions\n\n1. Clone the repository to your local machine:\n\n```bash\ngit clone https://github.com/Preetiraj3697/ReactJS-Integration-with-Backend.git\n```\n\n2. Navigate to the backend directory:\n\n```bash\ncd server\n```\n\n3. Install dependencies:\n\n```bash\nnpm install\n```\n\n4. Set up your MongoDB database and update the connection URL in app.js if needed.\n\n5. Start the server:\n\n```bash\nnpm start\n```\n\n6. The server will start running on [http://localhost:3000](http://localhost:3000).\n\n### API Endpoints\n\n- POST  /api/entries/add: Add a new entry to the user data.\n- POST /api/entries/update/:id: Update an existing entry in the user data.\n- GET  /api/entries: Get the user data.\n- GET /api/entries/count: Get the count of add and update operations.\n- Delete /api/entries/:id: Delete the user data from existing user Data.\n\n### Usage\n\n- Send HTTP requests to the appropriate endpoints to add or update user data.\n- Use the provided count endpoint to monitor the number of add and update operations.\n\n---\n\nFeel free to reach out if you have any questions or need further assistance!\n## 🌐 Connect with me:\n\u003cp align=\"left\"\u003e\n\u003ca href=\"mailto:preetiraj122000@gmail.com\" style=\"text-decoration:none\"\u003e\n  \u003cimg height=\"30\" src = \"https://img.shields.io/badge/gmail-c14438?\u0026style=for-the-badge\u0026logo=gmail\u0026logoColor=white\"\u003e\n\u003c/a\u003e\n\u003ca href=\"https://preetiraj3697.github.io/\" target=\"_blank\"\u003e\n   \u003cimg src=\"https://img.shields.io/badge/My%20Portfolio%20%E2%86%92-gray.svg?colorA=655BE1\u0026colorB=4F44D6\u0026style=for-the-badge\"/\u003e\n\u003c/a\u003e\n\u003ca href=\"https://www.linkedin.com/in/preetiraj3697\" style=\"text-decoration:none\"\u003e\n  \u003cimg height=\"30\" src=\"https://img.shields.io/badge/linkedin-blue.svg?\u0026style=for-the-badge\u0026logo=linkedin\u0026logoColor=white\" /\u003e\n\u003c/a\u003e\n\u003ca href=\"https://github.com/Preetiraj3697\" style=\"text-decoration:none\"\u003e\n  \u003cimg height=\"30\" src=\"https://img.shields.io/badge/Github-grey.svg?\u0026style=for-the-badge\u0026logo=Github\u0026logoColor=white\" /\u003e\n\u003c/a\u003e","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpreetiraj3697%2Freactjs-integration-with-backend","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpreetiraj3697%2Freactjs-integration-with-backend","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpreetiraj3697%2Freactjs-integration-with-backend/lists"}