Screenshot of the Web Application
Project Management is a full-stack web application built using the MERN stack (MongoDB, Express, React, Node.js). The application is designed to manage client and project information efficiently.
-
Client and Project Management: Easily add, view, and manage client and project information.
-
User-Friendly Interface: The front page of the application provides a clean and user-friendly interface for quick access to project and client details.
-
Styling with Bootstrap: Bootstrap classes have been utilized to enhance the styling and overall aesthetic appeal of the application.
-
Frontend: React.js is used for the client-side development. The application leverages Bootstrap for responsive and visually appealing UI components. Apollo Client is integrated to write queries to the GraphQL endpoint.
-
Backend: The server is powered by GraphQL, providing a flexible and efficient way to interact with the database.
-
Database: MongoDB serves as the database for storing client and project information.
-
Frontend (Vercel): The client-side of the application is deployed on Vercel. You can access the live version at https://project-management-mern.vercel.app/.
-
Backend (Render): The server-side of the application is deployed on Render. The GraphQL endpoint is hosted at render.com.
-
Clone the repository:
git clone https://github.com/your-username/Project-Management-MERN.git
-
Navigate to the project directory:
cd Project-Management-MERN
-
Install dependencies for both frontend and backend:
cd client && npm install cd ../server && npm install
-
Set up environment variables:
- Create a
.env
file in theserver
directory. - Add the MongoDB connection string and any other necessary variables.
- Create a
-
Run the application:
To run the front end navigate to client directory and issue npm start To run the backend of the app navigate to server directory and issue node index.js (entry point of the backend code). Backend runs localhost: 4000
The application should be accessible at http://localhost:3000/.