Welcome to KeepIt, a full-stack Todo List application built with Vite, React, TypeScript, and MongoDB. This application allows users to sign up, sign in, and manage their todo lists efficiently. The backend is powered by Express and MongoDB, ensuring robust performance and scalability.
- Frontend: Built with Vite, React, TypeScript, and Tailwind CSS.
- Backend: Implemented with Express and MongoDB.
- Authentication: Simple email and password-based authentication.
- Deployment: Hosted on Render.
The project is deployed and can be accessed here.
- User authentication (Sign up, Sign in).
- Create, read, and delete todos.
- Real-time updates to todo lists.
- Responsive design.
- Node.js and npm installed.
- MongoDB instance running (can be local or MongoDB Atlas).
-
Clone the repository:
git clone https://github.com/hasanpeal/Keepit.git cd Keepit
-
Install frontend dependencies:
cd client npm install
-
Install backend dependencies:
cd ../server npm install
Create a .env
file in the root directory of the server
folder and add the following environment variables:
MONGO_USERNAME=your_mongo_username
MONGO_PASSWORD=your_mongo_password
-
Start the backend server:
cd server npm start
-
Start the frontend development server:
cd ../client npm run dev
The application should now be running on
https://localhost:3000
.
- Navigate to the Sign Up page.
- Enter your email and password to create an account.
- Navigate to the Sign In page.
- Enter your registered email and password to log in.
- After logging in, you can add new todos by entering text and clicking the "Add" button.
- Existing todos are displayed in a list where you can delete them by clicking the delete button.
client
: Contains the React frontend code.server
: Contains the Express backend code.database
: MongoDB models and database connection.services
: Business logic for user and todo operations.
- Frontend: Vite, React, TypeScript, Tailwind CSS.
- Backend: Express, MongoDB, Mongoose.
- State Management: React Hooks.
- HTTP Client: Axios.
- Styling: Tailwind CSS.
- Icons: Phosphor Icons.
- Deployment: Render.
We welcome contributions to improve this project! Here’s how you can help:
- Fork the repository.
- Create a new branch (
git checkout -b feature-branch
). - Make your changes and commit them (
git commit -m 'Add new feature'
). - Push to the branch (
git push origin feature-branch
). - Create a pull request.
This project is licensed under the MIT License. See the LICENSE file for more details.
If you have any questions or suggestions, feel free to reach out via GitHub Issues.
We hope you find KeepIt useful for managing your tasks and improving your productivity. Thank you for checking out our project!
Note: This README file is designed to give recruiters and contributors a comprehensive overview of the project, its setup, and usage. The project is actively maintained, and we appreciate any feedback or contributions.