Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Ghaith-amdouni/Study-hub

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Study Hub

Description:

Study Hub is a simple yet powerful web-based notes management application built using Flask, SQLite, HTML, CSS, and Bootstrap 5.

Study Hub allows users to:

  • Add new study notes with a title and detailed content.
  • View all saved notes organized in a beautiful card layout.
  • Edit existing notes easily.
  • Delete notes (with a confirmation to prevent mistakes).
  • Search through notes by title using the search bar.
  • Enjoy a responsive and user-friendly interface on both desktop and mobile devices.

Project Files:

  • app.py: The main Flask application handling all routing, database interactions, and template rendering.
  • templates/layout.html: Base layout that other pages extend. It includes the navigation bar, search functionality, and footer.
  • templates/index.html: Main page for adding, viewing, and managing notes.
  • templates/edit.html: Edit page where users can modify existing notes.
  • static/style.css: Custom styles applied on top of Bootstrap for better aesthetics.
  • notes.db: SQLite database file (automatically generated when running the app for the first time).

Design Choices:

  • Bootstrap 5 was used for styling and responsive layout, ensuring a modern and clean design.
  • The application uses Flask’s Jinja2 templating to organize HTML efficiently with template inheritance (layout.html as the base).
  • SQLite was chosen for simple, file-based database management.
  • Confirmation pop-up when deleting a note to avoid accidental deletions.
  • Search functionality for easy and fast retrieval of notes based on titles.
  • Custom CSS was added to polish the visual experience further.

Technologies Used:

  • Python 3
  • Flask
  • SQLite3
  • HTML5
  • CSS3
  • Bootstrap 5

📌 How It Works

  1. Run app.py to start the Flask server.
  2. The app automatically creates a notes.db database on the first run.
  3. Navigate to http://localhost:5000 in your browser.
  4. Add, view, edit, or delete notes directly in the interface.

💡 Design Decisions

  • Bootstrap 5 for clean styling and responsive layout.
  • Jinja2 Templates for maintainable and modular HTML.
  • Confirmation Prompts before deletion to prevent data loss.
  • Custom CSS enhancements for a better UI/UX.

This project, Study Hub, demonstrates a real-world CRUD (Create, Read, Update, Delete) web application. It was developed fully by me, following the skills and knowledge learned through CS50x.

I hope Study Hub can be a small but meaningful contribution towards making study organization easier!

About

Study webapp that reshapes the future of education

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published