A secure and scalable notes-sharing platform built with FastAPI, React, and AWS cloud services — perfect for creating, storing, and sharing notes & images globally!
This project is a cloud-native web application where users can:
- Register & Login securely
- Create and manage notes (with or without images)
- Upload images/files attached to notes
- Access notes globally with low latency via CloudFront CDN
- Store metadata in RDS (MySQL) and files in Amazon S3
Designed with AWS Free Tier in mind, it demonstrates modern cloud architecture with a focus on:
- Scalability
- Security
- Cost optimization
┌────────────────────────┐
│ User Browser / App │
└───────────▲────────────┘
│ HTTPS (Global via CloudFront)
▼
┌────────────────────────────┐
│ CloudFront CDN (Global) │
└───────────┬────────────────┘
│
┌──────────────────────┴─────────────────────────┐
│ │
┌─────────▼─────────┐ ┌─────────▼─────────┐
│ React Frontend │ │ FastAPI Backend │
│ (S3 Static) │ │ (EC2 Instance) │
└────────▲──────────┘ └─────────▲─────────┘
│ (Static assets via CloudFront) │ REST API / Auth
│ │
───────────┘ │
│
┌────────────────┴─────────────┐
│ │
┌─────────▼─────────┐ ┌──────────▼─────────┐
│ Amazon RDS │ │ Amazon S3 │
│ (MySQL) │ │ (Notes & Images) │
└───────────────────┘ └────────────────────┘
- **CloudFront** delivers both static frontend and protected file downloads globally.
- **React** frontend is hosted on S3 for static site hosting.
- **FastAPI** backend is on EC2, exposes REST APIs for frontend, handles auth, CRUD, file upload.
- **RDS MySQL** stores user and note metadata.
- **S3** stores uploaded images/files.
- IAM roles, bucket policies, and signed URLs secure access between components.
- 🔑 Authentication: User registration & login via FastAPI APIs
- 📝 Notes Management: Create, read, and share text-based notes
- 🖼 File Uploads: Attach images/files to notes (stored in S3)
- 🌍 Global Delivery: CloudFront CDN with signed URLs
- 💾 Data Separation: Metadata in RDS (MySQL), files in S3
- 🔒 Secure Access: IAM roles, bucket policies, least-privilege principles
- ⚡ Scalable & Cost-Optimized: Built under AWS Free Tier guidelines
Layer | Technology | Purpose |
---|---|---|
Frontend | React (SPA) | User interface for notes & login |
Backend | FastAPI (Python) | REST APIs for authentication & CRUD |
Database | Amazon RDS (MySQL) | Metadata storage |
Storage | Amazon S3 | Notes, images & attachments |
Delivery | CloudFront | CDN for global content delivery |
Security | IAM & Bucket Policy | Access control & permissions |
Cloud-Based-Notes-Sharing-Platform/
│
├── frontend/ # React Frontend (SPA)
│ ├── public/ # Static assets (index.html, favicon, etc.)
│ └── src/
│ ├── components/ # Reusable UI components (Navbar, NoteCard, etc.)
│ ├── pages/ # App pages (Login, Register, Dashboard, NoteView)
│ ├── services/ # API request logic (axios)
│ ├── hooks/ # Custom React hooks (useAuth, useNotes)
│ ├── styles/ # CSS / SCSS modules
│ ├── utils/ # Helper functions and constants
│ ├── App.js
│ └── index.js
│
├── backend/ # FastAPI Backend (Python)
│ ├── app/
│ │ ├── main.py # FastAPI entrypoint
│ │ ├── routes/ # API endpoints (auth.py, notes.py, users.py)
│ │ ├── models/ # SQLAlchemy models (User, Note)
│ │ ├── database.py # MySQL DB connection logic
│ │ ├── s3_utils.py # Amazon S3 file upload/download helpers
│ │ ├── schemas/ # Pydantic request/response schemas
│ │ └── config.py # App/configuration (env vars, secrets)
│ ├── requirements.txt # Python dependencies
│ └── Dockerfile # For containerizing backend (optional)
│
├── infrastructure/ # AWS IaC and deployment
│ ├── cloudformation-template.yml # AWS CloudFormation template
│ ├── terraform/ # Terraform scripts for AWS resources
│ └── deployment.md # Steps for manual/CI deployment
│
├── README.md # Project documentation
└── .gitignore
git clone https://github.com/your-username/Cloud-Based-Notes-Sharing-Platform.git
cd Cloud-Based-Notes-Sharing-Platform
2. Backend Setup (FastAPI)
cd backend
python3 -m venv env
source env/bin/activate # On Windows: env\Scripts\activate
pip install -r requirements.txt
Configure .env with:
DB_HOST=your-rds-endpoint
DB_USER=your-username
DB_PASS=your-password
DB_NAME=notes_db
AWS_ACCESS_KEY_ID=your-iam-key
AWS_SECRET_ACCESS_KEY=your-iam-secret
S3_BUCKET_NAME=your-s3-bucket
Start the server:
uvicorn app.main:app --host 0.0.0.0 --port 8000
3. Frontend Setup (React)
cd frontend
npm install
npm run build # for production
Upload the /build folder to your S3 bucket with static website hosting enabled.
☁️ AWS Deployment Steps
EC2 Instance: Deployed FastAPI using uvicorn on Ubuntu server.
S3 Buckets:
One for frontend hosting (React build files)
One for notes/images storage
RDS (MySQL): Stores user metadata and file URLs.
CloudFront: Distributes both frontend and file content globally.
IAM Roles & Policies:
EC2 IAM role for S3 access
Bucket policies for secure file retrieval
API Integration: Frontend → FastAPI (EC2) → S3/RDS.
📌 Usage Guide
User signs up → Metadata stored in RDS.
User logs in → Auth token generated (JWT/localStorage).
User creates note → Text saved in RDS, images uploaded to S3.
User fetches notes → API retrieves metadata from RDS, files served via CloudFront.
🔒 Security Features
IAM Roles & Policies: No hardcoded credentials, least-privilege enforced.
Bucket Policies: Controlled access for upload & read.
CloudFront Signed URLs: Protects direct S3 access.
HTTPS Everywhere: Encrypted communication.
📈 Scalability & Cost Optimization
Runs under AWS Free Tier (t2.micro EC2, 20GB S3, 750h RDS free usage)
CloudFront caching reduces direct S3 & EC2 hits
Stateless backend → can scale horizontally with Auto Scaling Groups
Future ready for serverless migration (AWS Lambda, API Gateway)
🌱 Future Enhancements
Add WAF (Web Application Firewall) for extra security
Introduce serverless backend with Lambda + API Gateway
Add multi-region replication for high availability
Implement CI/CD (GitHub Actions → AWS)
🖼 Screenshots
(Add screenshots here when available)
🤝 Contributing
Pull requests are welcome! For major changes, open an issue first to discuss.
📜 License
This project is licensed under the MIT License.
Made with ❤️ using AWS, FastAPI & React