https://github.com/yoonusajward/task-manager-app
This is a full-stack Task Manager application built with React for the frontend and Node.js (Express) for the backend. It allows users to manage their tasks efficiently by adding, editing, deleting, and filtering tasks.
https://github.com/yoonusajward/task-manager-app
expressjs javascript nodejs react tailwindcss
Last synced: about 2 months ago
JSON representation
This is a full-stack Task Manager application built with React for the frontend and Node.js (Express) for the backend. It allows users to manage their tasks efficiently by adding, editing, deleting, and filtering tasks.
- Host: GitHub
- URL: https://github.com/yoonusajward/task-manager-app
- Owner: yoonusajward
- Created: 2024-12-10T18:50:38.000Z (5 months ago)
- Default Branch: main
- Last Pushed: 2024-12-14T05:27:40.000Z (5 months ago)
- Last Synced: 2025-02-07T06:43:12.921Z (3 months ago)
- Topics: expressjs, javascript, nodejs, react, tailwindcss
- Language: JavaScript
- Homepage:
- Size: 189 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Task Manager App
This is a full-stack Task Manager application built with **React** for the frontend, **Node.js** (Express) for the backend, and **MySQL** for the database. It allows users to manage their tasks efficiently by adding, editing, deleting, and filtering tasks.
## Project Structure
The project consists of two main folders:
- `frontend`: Contains the React application for the frontend.
- `backend`: Contains the Node.js (Express) server and API for the backend.
## Features
- Add, edit, delete, and filter tasks.
- Task management with statuses (e.g., completed, pending).
- Full-stack architecture with React and Node.js.
## Screenshots
Below are some screenshots showcasing the functionality and design of the Task Manager App:
1. Home Page (Status - All)
2. Add Task
3. Update Task
4. Filter Status - Completed
5. Filter Status - Not Completed
## Prerequisites
Before running the project, make sure you have the following installed on your machine:
- [Node.js](https://nodejs.org/en/) (with npm)
- [Git](https://git-scm.com/)
- A code editor such as [Visual Studio Code](https://code.visualstudio.com/)
## Setup Instructions
### 1. Clone the Repository
Clone the repository to your local machine:
1. Clone the repository:
```bash
git clone https://github.com/yoonusajward/task-manager-app.git
2. Navigate to the project directory:
```bash
cd task-manager-app
### 2. Backend Setup
1. Navigate to the backend directory:
```bash
cd backend
2. Install the backend dependencies:
```bash
npm install
3. Create a .env file in the backend folder (you can use .env.example as a reference), and configure any necessary environment variables.
4. Start the backend server:
```bash
npm start
The backend should now be running on http://localhost:5000 (or any other port defined in your .env file).
### 3. Frontend Setup
1. Navigate to the frontend directory:
```bash
cd ../frontend
2. Install the frontend dependencies:
```bash
npm install
3. Start the frontend development server:
```bash
npm start
The frontend should now be running on http://localhost:3000.
## Technologies Used
- Frontend: React, Tailwind CSS
- Backend: Node.js, Express.js
- Database: MongoDB
## Contributing
If you'd like to contribute to this project, feel free to fork the repository and submit a pull request. Please make sure to follow the coding guidelines and include appropriate tests for new features.