|
| 1 | +# DevOps Project: QR Code Generator |
| 2 | + |
| 3 | +An app that converts a URL to a QR Code. The app has three components: Front-end, API and Storage. All 3 components should be hosted in containers utilizing the cloud provider of your choice. The sample application code is provided, your goals is to apply DevOps practices like containerization, CI/CD, observability and monitoring for the application. |
| 4 | + |
| 5 | +- **Front-End Container**: Hosts the website where users can input URLs. |
| 6 | +- **API Container**: Handles the QR code generation for given URLs. |
| 7 | +- **Storage Container**: Stores the generated QR codes. |
| 8 | + |
| 9 | +## Details |
| 10 | + |
| 11 | +### Application |
| 12 | + |
| 13 | +- Front-End: A web application where users can submit URLs. |
| 14 | +- API: An API that receives URLs and generates QR codes. |
| 15 | +The API can store the QR codes in cloud storage(S3 Bucket, Azure Blob Storage, GCP Cloud Buckets). |
| 16 | +- Storage: A storage solution (like Azure Blob Storage, AWS S3 or Google Cloud Storage) to hold the QR codes. Ensure security and accessibility for the stored data. |
| 17 | + |
| 18 | +### Programming |
| 19 | + |
| 20 | +A sample application is available here [rishabkumar7/devops-qr-code](https://github.com/rishabkumar7/devops-qr-code). It has the front-end built in NextJS, uses FastAPI Python framework for the API and AWS S3 for storage. |
| 21 | + |
| 22 | +### To Do |
| 23 | + |
| 24 | +- Containerization: Containerize both the front-end and API by creating a `Dockerfile`. |
| 25 | +- CI/CD: Write CI/CD pipeline to automate deployment of the containers, once your source code is changed. |
| 26 | +- Kubernetes YAML Files: Create deployment and service YAML files for both the Next.js front-end and the FastAPI backend. |
| 27 | + |
| 28 | +#### Optional |
| 29 | + |
| 30 | +Optionally you can customize the already provided app. |
| 31 | +- Front-end: You can use any language of your choice or JavaScript frameworks like React, Vue or NextJS to build the front-end. |
| 32 | +- API/Backend: Build an API for your QR Code generation, frameworks like [Flask](https://flask.palletsprojects.com/en/3.0.x/) or [FastAPI](https://fastapi.tiangolo.com/) will help you to create your Rest API. |
| 33 | +- Storage: Sample app uses AWS S3. You can utilize cloud SDKs/modules (e.g., `boto3` for AWS, `google-cloud` for GCP, `azure` for Azure) to interact with cloud storage service from respective cloud providers. |
| 34 | + |
| 35 | +### Deployment |
| 36 | + |
| 37 | +- Setup Kubernetes service within your cloud provider (Azure AKS, Amazon EKS or GCP GKE). |
| 38 | +- Containerize the front-end, API, and storage using Docker. |
| 39 | +- Deploy these containers to the cluster. |
| 40 | +- Ensure containers are interconnected for seamless data flow. |
| 41 | +- Setup CI/CD pipeline to deploy the containers after source is changed. |
| 42 | + |
| 43 | +### Implementation |
| 44 | + |
| 45 | +- Web-app: Users are able to access the front-end, make sure the web-app is publicly accessible via a URL and has an input field to enter URLs. |
| 46 | +- API: Once the URL is entered by a user, the web-app makes the request to the API container to convert the URL into a QR Code. |
| 47 | +- Storage: The generated QR Code is stored and also displayed on the web-app for user. |
| 48 | +- CI/CD: Setup CI/CD pipeline to deploy the containers and application after the source is changed. You can utilize tools like GitHub Actions or Azure DevOps. |
| 49 | +- Monitoring: Setup monitoring for containers for key metrics and insights. You have Azure Monitor for AKS, Amazon CloudWatch Container Insights for EKS, or take it a step further by setting up Grafana. |
0 commit comments