Are you looking to build a real-world, production-ready full-stack app that uses modern tools like Angular, Node.js, Docker, PostgreSQL, and AWS? Youβve come to the right place. Let me introduce you to the Event Booking App β a sleek, modular, and scalable application for managing event registrations and sending confirmation emails.
mahmud-r-farhan / event-booking
A modern, full-stack Event Registration Application designed for seamless user registration, email notifications, and data management. Built with a robust tech stack, this app is responsive, scalable, and ready for deployment.
π Event Registration App
A modern, full-stack Event Registration Application designed for seamless user registration, email notifications, and data management. Built with a robust tech stack, this app is responsive, scalable, and ready for deployment.
β¨ Features
-
π User-Friendly Registration Form: Built with Angular Material for a sleek, modern UI.
-
π€ Backend API Integration: Securely sends form data to a Node.js/Express backend.
-
π¬ Email Notifications: Sends confirmation emails via Gmail using Nodemailer.
-
ποΈ PostgreSQL Database: Stores registration data reliably with Neon.tech or local PostgreSQL.
-
β Real-Time Feedback: Displays toast messages for form submission success or errors.
-
π± Responsive Design: Optimized for mobile and desktop devices.
-
π Deployment-Ready: Configured for easy deployment on popular platforms, including Docker and AWS.
-
π§© Modular Architecture: Standalone Angular components for easy customization.
π¦ Tech Stack
Layer | Technologies |
---|---|
Frontend | Angular, Angular Material |
Backend | Node.js, Express.js |
Database | PostgreSQL (Neon.tech |
π― What is this app?
The Event Registration App is a full-stack web application that allows users to register for events via a responsive form. It handles form submissions, sends confirmation emails, and stores data securely using PostgreSQL.
π Tech Stack
Layer | Tech |
---|---|
Frontend | Angular + Angular Material |
Backend | Node.js + Express.js |
Database | PostgreSQL (via Neon.tech or RDS) |
Nodemailer (Gmail SMTP) |
β¨ Key Features
β
Beautiful, responsive registration form
β
Instant email confirmations via Nodemailer
β
PostgreSQL integration for data persistence
β
Docker support for containerized deployment
β
Full AWS ECS deployment guide using ECR & Fargate
β
Modular codebase with clean architecture
π§± Project Structure
event-booking/ βββ backend/ # Node.js API β βββ controllers/ β βββ routes/ β βββ mailer.js β βββ db.js β βββ server.js β βββ Dockerfile βββ frontend/ # Angular App β βββ src/app/ β βββ styles.css β βββ index.html β βββ Dockerfile βββ docker-compose.yml βββ README.md
π§ Local Setup in 5 Minutes
1. Clone the repo
git clone https://github.com/mahmud-r-farhan/event-booking.git cd event-booking
2. Set up environment variables
Create a .env
file inside /backend
:
PORT=5000 DB_URL=your_postgres_connection_string EMAIL_USER=your_gmail@gmail.com EMAIL_PASS=your_gmail_app_password
3. Run with Docker Compose
docker-compose up --build
Now visit:
- Frontend: http://localhost:4200
- Backend: http://localhost:5000
π³ Containerized Deployment with Docker
Dockerfiles are provided for both backend and frontend. You can build and run containers locally, or push them to AWS ECR for deployment.
docker build -t event-booking-backend ./backend docker build -t event-booking-frontend ./frontend
βοΈ Deploying on AWS (ECS Fargate)
The repo includes a step-by-step guide to deploy the app on AWS:
- Push Docker images to Amazon ECR
- Use AWS ECS (Fargate) to run frontend & backend tasks
- Set up a Load Balancer
- Configure your environment variables
- Connect to PostgreSQL (RDS or Neon.tech)
The guide also includes JSON examples for task definitions, troubleshooting tips, and API integration steps.
π¬ Email Confirmation via Gmail
Use Nodemailer + Gmail SMTP to send confirmation emails. Be sure to use an App Password and not your main Gmail password.
const transporter = nodemailer.createTransport({ service: 'gmail', auth: { user: process.env.EMAIL_USER, pass: process.env.EMAIL_PASS, }, });
π¨ Want to Customize?
Change the form fields in:
frontend/src/app/app.component.html
Update backend logic in:
backend/controllers/registerUser.js
Modify email templates in:
backend/mailer.js
π§ͺ Troubleshooting Tips
- Emails not sending? Double-check your Gmail App Password.
- Database not connecting? Verify your
DB_URL
and access settings. - Frontend can't reach API? Update the frontend API URL to match your backend's public DNS (especially in production).
π§βπ» Contributing
Contributions are welcome!
Fork the repo β Create a branch β Submit a PR π
β Give It a Star
If you like this project or found it helpful, please give it a β on GitHub. It motivates others and helps them find it, too!
π Links
- π GitHub: mahmud-r-farhan/event-booking
- π¬ Email: support@devplus.fun
Thanks for reading! Let me know if you deploy it or have any cool feature suggestions. π
Follow for more! @mahmud-r-farhan who β€ React.jsx!
Top comments (0)