Introduction.
This tutorial details how to build a CI/CD pipeline that deploys a Next.js app from GitHub to S3 Bucket on AWS.
How does this work?
We have an application deployed on Github, and once there is any change made to this application, this change automatically triggers the CI/CD pipeline to build and deploy this application on the S3 Bucket.
What do you need?
An AWS account
CodePipeline
S3 BucketA GitHub account
Next.Js/React application
Step 1 :Create an S3 bucket on AWS
- Go to the AWS S3 console.
- Click on "Create new bucket" and give it a unique name
- Allow public access to the bucket (you might not need this if you don't intend on making your application available on the internet)
- Create Bucket
Step 2 Configure the bucket for static website hosting
- After bucket has been successfully created, click on view details and visit the properties tab
- Enable static website hosting
Step 3
Configure Permissions to allow incoming traffic/website access
- click on view details and visit the permissions tab
- Edit "bucket policy"
Bucket Policy :https://gist.github.com/TomiParucci/c76fc43ca715406cbfe5ee1373359103
- Make sure to edit the default bucket ARN in policy to that of your previously created bucket. (as circled above)
Your Bucket is now fully set up.
Step 4
Setup the pipeline
Go to the AWS S3 console.
- Click on "Codepipeline" and "create new CodePipeline"
- Give it a unique name and ensure you are creating this in the same availability zone as the S3 bucket created earlier.
- leave other settings at default and click on "next"
- move to the add source stage and connect to the code source (here mine is github),if you do not have an existing connection to your code source , you have to create a connection.
Step 5
- Move to the build stage and input all necessary configurations
- Ensure this is in same region as Bucket
- click on new project or attach existing project if any
Step 6
- Move to the deploy stage
- state deploy provider, region and bucket(created earlier)ensure this is in same region as Bucket
The pipeline has been created successfully and has started running, it will pull the application from source and go ahead to deploy it
Top comments (0)