Tasks Maestro

Tasks Maestro is a full-stack web application for managing tasks, built with React, Bootstrap, Django Rest Framework, and Supabase PostgreSQL. It allows user to list, add, edit, mark complete and delete tasks seamlessly.

Features

Task Management:

• List tasks with details
• Add new tasks
• Edit existing tasks
• Mark tasks complete
• Delete tasks

API Endpoints

• GET /api/tasks/ - List all tasks
• GET /api/tasks/<task_id>/ - Get task by its id
• POST /api/tasks/ - Add new task
• PUT /api/tasks/<task_id>/ - Edit existing task by its id
• DELETE /api/tasks/<task_id>/ - Delete task by its id

Technology Stack:

Front End:

• React
• Bootstrap
• Hosted on AWS S3 and distributed via AWS CloudFront

Back End:

• Django Rest Framework
• Supabase PostgreSQL
• Deployed on AWS EC2

Deployment

Front End Deployment

1. Build Setup:

# Install dependencies
npm install

# Compiles and hot-reloads for development
npm start

# Compiles and minifies for production
npm run build

2. Deployment to AWS:

• Upload the build artifacts (build folder) to AWS S3 bucket.
• Configure AWS CloudFront to serve the static content from the S3 bucket.

Back End Deployment

1. Setup Environment:

• Set up a virtual environment and activate it.

python -m venv myenv
source myenv/bin/activate

• Install dependencies:

pip install -r requirements.txt

2. Database Configuration:

• Set up a Supabase PostgreSQL database instance.
• Configure database settings in settings.py:

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.postgresql',
        'NAME': 'your_database_name',
        'USER': 'your_database_user',
        'PASSWORD': 'your_database_password',
        'HOST': 'database_host_url',
        'PORT': 'database_port',
    }
}

3. Make and apply migrations

python manage.py makemigrations
python manage.py migrate

4. Run Django Server:

• Start the Django server:

python manage.py runserver

5. Deployment to AWS EC2:

• Provision an EC2 instance.
• Deploy the Django application using a Git clone on the EC2 instance.

Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.

Screenshots

Click on image to open full-size version

• Dashboard showing task list

• Adding a new task interface

• Task edit page

• Deleting task confirm window

Contributing

Contributions are welcome! Please fork this repository and submit a pull request with your changes.

License

This project is licensed under the MIT License - see the LICENSE file for details.

Acknowledgments

• Built using React, Django, and Supabase PostgreSQL.
• Deployed on AWS for scalability and reliability.