Deploying an App With AWS App Runner

Deploying applications can be a hassle, especially when managing servers and infrastructure. That's where AWS App Runner comes in! In this article, I'll walk you through how I deployed my Pantry Tracker App using Docker and AWS App Runner, making the entire process seamless.

Prerequisites

• Node.js

• Docker

• VsCode (IDE)

• Next.js

• Tailwind CSS

• Firebase Console

Why Use AWS App Runner?

AWS App Runner is a fully managed service that makes it easy to deploy containerized applications without worrying about server management. Here’s why I chose it:

• Infrastructure management: No need to provision or maintain servers.

• Scalability: It automatically scales based on demand.

• Fast deployment: Just push your container image, and App Runner takes care of the rest.

• Load Balancing: Built-in load balancing handles traffic efficiently without extra configurations.

Why Dockerize Your App?

Before deploying, I Dockerized my Next.js-based Pantry Tracker App. Why?

• Portability: Works the same in any environment.

• Consistency: Avoids the "works on my machine" problem.

• Easy deployment: Package the app with its dependencies in one container.

Setting Up the Project

Technologies Used

• Frontend: Next.js, React, Tailwind CSS.

• Backend: Firebase (Firestore for database).

• Deployment: AWS App Runner, AWS Elastic Container Registry (for container image repository), Docker.

Before starting, make sure you have:

• Node.js

• Docker

• VsCode (IDE)

Clone the Repository

git clone https://github.com/ijayhub/pantry-tracker-app.git
cd pantry-tracker-app

Install Dependencies

npm install

Run the Application Locally

npm start

The app will be available at http://localhost:3000/.

Docker Setup

To containerize the application for deployment:

Create a Dockerfile

FROM node:18-alpine
WORKDIR /app
COPY package.json package-lock.json ./
RUN npm install
COPY . .
EXPOSE 3000
CMD ["npm", "run", "start"]

Build and Run the Docker Container

docker build -t pantry-tracker-app .
docker run -p 3000:3000 pantry-tracker-app

1. Push Docker Image to AWS Elastic Container Registry (ECR)

AWS App Runner pulls images from ECR, so we need to push our Docker image there.

Push Docker Image to AWS Elastic Container Registry (ECR)

aws ecr create-repository --repository-name pantry-tracker-app
aws ecr get-login-password --region <your-region> | docker login --username AWS --password-stdin <aws-account-id>.dkr.ecr.<your-region>.amazonaws.com
docker tag pantry-tracker-app:latest <aws-account-id>.dkr.ecr.<your-region>.amazonaws.com/pantry-tracker-app:latest
docker push <aws-account-id>.dkr.ecr.<your-region>.amazonaws.com/pantry-tracker-app:latest

2. Deploy to AWS App Runner

• Go to the AWS App Runner Console.

• Create a new service and select Container Registry.

• Choose your ECR repository and select the latest image.

• Configure environment variables and deployment settings.

• Click Deploy and let App Runner handle the rest!

The visual output

Conclusion

Using AWS App Runner, I deployed my Pantry Tracker App without managing servers or dealing with complex configurations. By Dockerizing the app, I ensured consistency and portability, making deployment smooth and hassle-free.

If you're looking for an easy way to deploy your applications, Docker + AWS App Runner is the way to go!

You can find the Git repository here: pantry-tracker-app

If you found this article helpful, share it with others who may find it interesting.

Stay updated with my projects by following me on Twitter, LinkedIn, and GitHub.

Thank you for reading.