Notes Taking Web Application

A simple, modern web-based notes taking application built with Python Flask and SQLite database. This project demonstrates UI design and database integration without requiring any subscription services.

Features

• ✨ Modern UI: Beautiful, responsive design with gradient backgrounds and smooth animations
• 📝 CRUD Operations: Create, Read, Update, and Delete notes
• 💾 SQLite Database: Lightweight, file-based database (no subscription required)
• 🎨 Bootstrap Styling: Professional UI components with Font Awesome icons
• 📱 Responsive Design: Works on desktop, tablet, and mobile devices
• ⚡ Real-time Updates: Instant feedback with flash messages
• 🔍 Note Preview: Quick preview of note content on the main page

Technology Stack

• Backend: Python Flask
• Database: SQLite (no subscription required)
• Frontend: HTML5, CSS3, Bootstrap 5
• Icons: Font Awesome 6
• ORM: Flask-SQLAlchemy

Installation & Setup

Prerequisites

• Python 3.7 or higher
• pip (Python package installer)

Step 1: Clone or Download

Download the project files to your local machine.

Step 2: Install Dependencies

pip install -r requirements.txt

Step 3: Run the Application

python app.py

Step 4: Access the Application

Open your web browser and navigate to:

http://localhost:5000

Project Structure

notes-app/
├── app.py                 # Main Flask application
├── requirements.txt      # Python dependencies
├── README.md            # Project documentation
├── templates/           # HTML templates
│   ├── base.html        # Base template with common layout
│   ├── index.html       # Home page with notes list
│   ├── add_note.html    # Add new note form
│   ├── edit_note.html   # Edit existing note form
│   └── view_note.html   # View individual note
└── notes.db             # SQLite database (created automatically)

Database Schema

The application uses a simple SQLite database with one table:

Notes Table

• id (Integer, Primary Key)
• title (String, 200 characters)
• content (Text)
• created_at (DateTime)
• updated_at (DateTime)

Usage Guide

Creating a Note

1. Click the "Add New Note" button
2. Enter a title and content
3. Click "Save Note"

Viewing Notes

• All notes are displayed on the home page
• Click "View" to see the full note content
• Notes are sorted by most recently updated

Editing a Note

1. Click "Edit" on any note
2. Modify the title or content
3. Click "Update Note"

Deleting a Note

1. Click "Delete" on any note
2. Confirm the deletion in the popup dialog

API Endpoints

The application also provides REST API endpoints:

• GET /api/notes - Get all notes as JSON
• DELETE /api/notes/<id> - Delete a note by ID

Customization

Changing the Database

To use a different database, modify the SQLALCHEMY_DATABASE_URI in app.py:

# For PostgreSQL
app.config['SQLALCHEMY_DATABASE_URI'] = 'postgresql://user:password@localhost/notes'

# For MySQL
app.config['SQLALCHEMY_DATABASE_URI'] = 'mysql://user:password@localhost/notes'

Styling

The application uses custom CSS in the base.html template. You can modify the styles to match your preferences.

Security Notes

• Change the SECRET_KEY in production
• Consider using environment variables for sensitive configuration
• Add authentication if needed for multi-user scenarios

Troubleshooting

Common Issues

1. Port already in use: Change the port in app.py:

   app.run(debug=True, port=5001)

2. Database errors: Delete notes.db and restart the application to recreate the database

3. Template not found: Ensure the templates folder is in the same directory as app.py

Future Enhancements

• User authentication and authorization
• Note categories and tags
• Search functionality
• Note sharing
• Export to PDF/Word
• Rich text editor
• Note attachments
• Dark mode toggle

License

This project is open source and available under the MIT License.

Contributing

Feel free to fork this project and submit pull requests for any improvements.