https://github.com/venkata-kiran-adapa/task_manager
Task Manger Full Stack Project
https://github.com/venkata-kiran-adapa/task_manager
bootstrap css express html javascript mongodb mongoose node postman rest-api typescript webpack
Last synced: 6 months ago
JSON representation
Task Manger Full Stack Project
- Host: GitHub
- URL: https://github.com/venkata-kiran-adapa/task_manager
- Owner: Venkata-Kiran-Adapa
- Created: 2025-01-26T13:44:37.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2025-01-26T13:48:59.000Z (over 1 year ago)
- Last Synced: 2025-06-18T06:34:40.061Z (about 1 year ago)
- Topics: bootstrap, css, express, html, javascript, mongodb, mongoose, node, postman, rest-api, typescript, webpack
- Language: TypeScript
- Homepage:
- Size: 16.7 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Task Manager
This is a robust task management application built with Node.js, Express, MongoDB, and TypeScript. It empowers users to effectively organize and track their tasks, fostering increased productivity and efficiency.
**Key Features:**
* **Comprehensive Task Management:**
* **Creation :** Effortlessly create new tasks with detailed descriptions, set deadlines, and assign priorities (High, Medium, Low).
* **Categorization:** Organize tasks into intuitive categories (e.g., Personal, Work, Home, School) for better clarity and focus.
* **Prioritization:** Prioritize tasks effectively using a clear priority system to ensure timely completion of critical tasks.
* **Deadline Tracking:** Set and track deadlines for each task to maintain focus and avoid missing important commitments.
* **Task Deletion:** Easily remove completed or irrelevant tasks to declutter your workspace.
* **User-Friendly Interface:**
* **Intuitive Design:** A clean and intuitive user interface ensures a smooth and enjoyable user experience.
* **Clear Task Display:** Tasks are presented in a visually appealing and informative manner, highlighting key details like name, description, deadline, priority, and category.
* **Visual Cues:** Utilize color-coded badges or other visual cues to quickly identify task priorities and deadlines.
* **Robust User Authentication:**
* **Secure Registration:** Create user accounts with strong passwords (hashed using bcrypt for enhanced security).
* **Secure Login:** Log in with your credentials and access your personalized task list.
* **JWT Authentication:** Securely authenticate user sessions using JSON Web Tokens (JWTs) for enhanced security.
* **Backend Infrastructure:**
* **Node.js & Express.js:** A robust and efficient backend built with Node.js and the Express.js framework.
* **MongoDB:** A flexible NoSQL database for storing user data and tasks.
* **Mongoose ODM:** An Object Data Modeling library that simplifies interactions with MongoDB.
* **TypeScript:** Enhances code maintainability, readability, and reduces the likelihood of errors through static type checking.
### Prerequisites
Make sure you have the following installed:
- [Node.js](https://nodejs.org/)
- [MongoDB](https://www.mongodb.com/try/download/community) (or use a cloud-based MongoDB service like [MongoDB Atlas](https://www.mongodb.com/cloud/atlas))
## Tech Stack
This project utilizes the following technologies:
**Backend:**
* **Node.js:** A powerful and versatile JavaScript runtime environment.
* **Express.js:** A lightweight and flexible web framework for building Node.js applications.
* **MongoDB:** A flexible and scalable NoSQL database for storing user data and tasks.
* **Mongoose:** An Object Data Modeling (ODM) library that simplifies interactions with MongoDB.
* **TypeScript:** A superset of JavaScript that enhances code maintainability, readability, and reduces the likelihood of errors through static type checking.
* **bcrypt:** A library for securely hashing and comparing passwords.
* **jsonwebtoken:** A library for generating and verifying JSON Web Tokens (JWT) for secure authentication.
**Frontend:**
* **HTML, CSS, JavaScript:** Core web technologies for building the user interface.
* **Bootstrap:** A popular front-end framework that provides pre-built CSS components and JavaScript plugins for faster and more efficient development.
* **TypeScript:** Used for writing type-safe JavaScript code in the frontend to improve code quality and maintainability.
* **Webpack:** A module bundler for managing and bundling frontend assets (JavaScript, CSS).
This combination of technologies provides a robust foundation for building a scalable and maintainable task management application.
## Installation & Setup
1. **Clone the Repository:**
```bash
git clone https://github.com/Venkata-Kiran-Adapa/Task_Manager.git
```
2. **Navigate to the Backend Directory:**
```bash
cd backend
```
3. **Install Backend Dependencies:**
```bash
npm i
```
4. **Start the development server:**
```bash
npm start
```
5. **Open New Terminal window**
6. **Navigate to the frontend Directory:**
```bash
cd frontend/src
```
7. **Install dependencies:**
```bash
npm i
```
8. **Build the Project**
```bash
npm run build
```
9. **Start the development server:**
```bash
npm start
```
10. Open the app in your browser at http://localhost:8080.
## Webpack Configuration
Webpack is used to bundle the TypeScript files. The webpack.config.js file handles the following:
- **Entry:** Specifies the entry point (app.ts) for the application.
- **Output:** Bundles the TypeScript files into a single JavaScript file (app.js).
- **Loaders:** Uses ts-loader to transpile TypeScript files into JavaScript.
- **DevServer:** Configures Webpack's development server to serve the app.
- **Source Maps:** Enables inline source maps for easier debugging
# Task Manager API Reference
This document outlines the API endpoints available for interacting with the Task Manager application.
## Authentication
* **Login:**
* **Endpoint:** `POST /api/auth/login`
* **Request Body:**
* `email`: string (Required)
* `password`: string (Required)
* **Response:**
* On success:
* `status`: 200
* `body`:
* `token`: string (JWT token)
* On failure:
* `status`: 401
* `message`: "Invalid credentials"
* **Register:** (Assuming this functionality is based on your code)
* **Endpoint:** `POST /api/auth/signup`
* **Request Body:**
* `username`: string (Required)
* `email`: string (Required)
* `password`: string (Required)
* **Response:**
* On success:
* `status`: 201
* `message`: "User registered successfully"
* On failure:
* `status`: 400
* `message`: "Validation error" or specific error message
## Tasks
* **Get All Tasks by Category:**
* **Endpoint:** `GET /api/tasks/category/:category`
* **Headers:**
* `Authorization`: `Bearer ` (Required)
* **Parameters:**
* `category`: string (Required)
* **Response:**
* `status`: 200
* `body`: Array of task objects for the specified category
* `status`: 404
* `message`: "Category not found"
* **Create Task:**
* **Endpoint:** `POST /api/tasks`
* **Headers:**
* `Authorization`: `Bearer ` (Required)
* **Request Body:**
* `taskName`: string (Required)
* `taskDescription`: string (Optional)
* `taskDeadline`: string (ISO 8601 format expected by the server, but the code attempts to convert it to YYYY-MM-DD format) (Optional)
* `taskCategory`: string or array of strings (Required)
* `taskPriority`: string (e.g., "high", "medium", "low") (Optional)
* **Response:**
* `status`: 201
* `body`: Created task object
* `status`: 400
* `message`: "Enter all Task Detail" (if validation fails or request body is empty)
* **Delete Task:**
* **Endpoint:** `DELETE /api/tasks/:taskname/:category`
* **Headers:**
* `Authorization`: `Bearer ` (Required)
* **Parameters:**
* `taskname`: string (Required)
* `category`: string (Required)
* **Response:**
* `status`: 200
* `body`: Deleted task object (if successful)
* `status`: 404
* `message`: "Task not found"
## File Structure
**Backend:**
* **controllers:** Contains controllers for handling HTTP requests (task.js, user.js).
* **middlewares:** Implements cross-cutting concerns like authentication and authorization (auth.js).
* **models:** Defines the structure of data in the database (e.g., User, Task).
* **routes:** Defines API endpoints for different functionalities (e.g., user registration, task creation).
* **service:** Encapsulates business logic (e.g., user authentication, task creation).
* **package.json:** Manages backend dependencies.
**Frontend:**
* **TypeScript:** Used for writing type-safe JavaScript code.
* **Webpack:** Bundles and manages frontend assets.
* **`index.html`:** The main HTML file for the application.
This structure provides a clear separation of concerns and makes the project easier to maintain and scale.