This full-stack application is a customer dashboard where users can register, login, upload profile pictures, manage customer information, and access a small section of dashboard insights with customer info charts. The application was built using a variety of technologies and best practices to ensure high quality, maintainability, and scalability.
A strong emphasis has been placed on the DevOps side of the project, ensuring seamless integration, testing, and deployment.
DEMO: https://www.full-stack-react.awsfernandopresa.com/
One of the main highlights of this project is the significant emphasis on DevOps and continuous integration/continuous deployment (CI/CD) practices:
- Docker: Used for containerization of the application, ensuring the application runs uniformly across all environments.
-
Local Testing Environment: Docker is used to create a local testing environment that matches the production environment as closely as possible. This allows for thorough testing and reduces the chances of environment-specific bugs.
-
Automated Testing: Both the backend and frontend of the application have a suite of unit and integration tests. These tests are automatically run in GitHub Actions whenever a push is made to the repository, helping to ensure code quality and catch potential issues early.
-
Automatic Deployment: The application is set up to automatically deploy after any push to the main branch, utilizing AWS Amplify for the frontend and AWS EC2 for the backend. This means any validated changes can be rapidly reflected in the live application.
-
Database Migrations: Flyway is used to handle database migrations, ensuring that changes to the database schema are properly managed and versioned.
-
AWS IAM Policies: Implemented strict AWS IAM policies to manage access to AWS services and resources securely.
-
SSH Key Usage: Utilized SSH keys for secure connection to production servers, demonstrating an understanding of best practices in secure server access.
With Spring Boot 3 and Spring Boot Security in mind, the application was built using the following technologies:
-
HTTP & API Development: The application exposes an API that the frontend consumes.
-
Database & PostgreSQL: Used for efficient data storage and retrieval.
-
Spring Data JPA and JDBC:Used for handling database operations.
-
Flyway: For seamless database migrations.
-
Unit Tests and Integration Tests: Tests have been written to ensure the functionality and integrity of the application.
-
Spring Security 6: Used for building secure and authenticated applications.
-
JWT: JWT tokens are used for maintaining user sessions and authentication.
-
AWS S3: For storing user and website images.
-
Docker: Used for containerization and deployment.
-
AWS EC2 and Elastic Beanstalk AWS Amplify: Used for hosting the application in the cloud.
-
GitHub Actions: Used for CI/CD, automated testing and deployment.
-
User Registration & Login: Users can create an account and log in.
The application is divided into several key components:
- Authentication: The AuthenticationService class handles the core authentication logic, using JWT for token generation and management.
- Customer Management: The CustomerService class is responsible for managing customer information. The customer images are stored in AWS S3.
- Security: The SecurityConfig class handles the application's security configuration, ensuring that all endpoints are properly authenticated and CORS policies are respected.
- Backend: The backend is organized into different packages for authentication, customer management, JWT token management, S3 file handling, and security configuration.
- Frontend: The frontend is designed with React and JavaScript, following best practices for component structure and state management.
This project showcases a robust full-stack application built with a variety of technologies and best practices. The application places a strong emphasis on the DevOps side, using automated workflows for testing and deployment with incorporation of best security practices, like AWS IAM policies and SSH keys