<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>Forem: Abhishek Rajendra Wagh</title>
    <description>The latest articles on Forem by Abhishek Rajendra Wagh (@iabhishek07).</description>
    <link>https://forem.com/iabhishek07</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F298963%2F5cd2c4af-47b0-4700-af51-2f4457856eaf.jpeg</url>
      <title>Forem: Abhishek Rajendra Wagh</title>
      <link>https://forem.com/iabhishek07</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/iabhishek07"/>
    <language>en</language>
    <item>
      <title>AWS Community Builders on a Holiday</title>
      <dc:creator>Abhishek Rajendra Wagh</dc:creator>
      <pubDate>Tue, 20 Dec 2022 08:00:00 +0000</pubDate>
      <link>https://forem.com/aws-builders/aws-community-builders-on-a-holiday-5626</link>
      <guid>https://forem.com/aws-builders/aws-community-builders-on-a-holiday-5626</guid>
      <description>&lt;p&gt;Hello 👋, this is Abhishek and I am community builder for 3 consecutive years. Here are my few cents on the community builders program!&lt;/p&gt;

&lt;h2&gt;
  
  
  What surprises you most about the Community Builders Program?
&lt;/h2&gt;

&lt;p&gt;The sheer amount of helpful content produced by the community builders helping a lot of folks out there without expecting anything in return is commendable and to be praised for always.&lt;/p&gt;

&lt;h2&gt;
  
  
  What’s your background and your experience with AWS?
&lt;/h2&gt;

&lt;p&gt;I am a platform engineer by profession and also a backend engineer. Since I started working I only used AWS as my go to cloud provider because of the amount of services and solutions it provides and the community support for the same.&lt;/p&gt;

&lt;h2&gt;
  
  
  What’s the biggest benefit you see from the program?
&lt;/h2&gt;

&lt;p&gt;The biggest benefit I see is this program brings the community builders around the globe under one roof and it gives everyone huge opportunity to network with like minded people and the solutions they are building on AWS.&lt;/p&gt;

&lt;h2&gt;
  
  
  What’s the next swag item that you would like to get?
&lt;/h2&gt;

&lt;p&gt;I would like to add a builders hoodie or the tumbler which was given out at re:invent to my swag collection. Although Jason and team always surprise with the new items, so open for surprises.&lt;/p&gt;

&lt;h2&gt;
  
  
  What are you eating for dinner today? Share the recipe!
&lt;/h2&gt;

&lt;p&gt;I am eating butter chicken today for dinner! For the recipe head over to - &lt;a href="https://www.indianhealthyrecipes.com/butter-chicken/" rel="noopener noreferrer"&gt;Butter Chicken&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Do you have anything else to say about the community builders programme in 2022?
&lt;/h2&gt;

&lt;p&gt;I can't thank enough Jason and team to bring this program to us. Because of this program I am able to grow and reach out to fellow community builders and learn a lot from them. Whenever I feel low on motivation, I go back to Community Builders Slack channel and see what everyone's doing and get my motivation high.&lt;/p&gt;

</description>
      <category>watercooler</category>
    </item>
    <item>
      <title>How to build Serverless GraphQL API using AWS AppSync</title>
      <dc:creator>Abhishek Rajendra Wagh</dc:creator>
      <pubDate>Sun, 25 Sep 2022 12:00:06 +0000</pubDate>
      <link>https://forem.com/aws-builders/how-to-build-serverless-graphql-api-using-aws-appsync-5cfj</link>
      <guid>https://forem.com/aws-builders/how-to-build-serverless-graphql-api-using-aws-appsync-5cfj</guid>
      <description>&lt;h2&gt;
  
  
  What is GraphQL?
&lt;/h2&gt;

&lt;p&gt;GraphQL is a query language for APIs which provides a complete and understandable description of the data in the API. GraphQL APIs give the exact data that the client wants, nothing more or less.&lt;/p&gt;

&lt;p&gt;GraphQL is fast and flexible to use as compared to REST. GraphQL allows clients to decide what data to be returned unlike servers in REST. GraphQL reduces the number of HTTP requests since it can get you all the data required by your app in a single request. According to official documentation, apps using GraphQL can be quick even on slow mobile network connections.&lt;/p&gt;

&lt;h2&gt;
  
  
  GraphQL Operations
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Query&lt;/strong&gt; - Used to fetch the data from the GraphQL API, same as GET request&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Mutation&lt;/strong&gt; - Used to manipulate the data, same as CREATE, UPDATE, DELETE&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Subscription&lt;/strong&gt; - Used to listen or subscribe to the changes to the data&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  What is AppSync?
&lt;/h2&gt;

&lt;p&gt;AWS AppSync is a fully managed, serverless GraphQL API service offered by Amazon Web Services. AppSync allows developers to build GraphQL APIs without much hassle; it takes care of the parsing and resolution of requests.&lt;/p&gt;

&lt;p&gt;It also natively supports integration with other AWS services like AWS Lambda, NoSQL and SQL databases, and HTTP APIs to gather backend data for the API.&lt;/p&gt;

&lt;h2&gt;
  
  
  What are we going to build?
&lt;/h2&gt;

&lt;p&gt;We will build a GraphQL API using AWS AppSync to perform CRUD operations. For example, we will make an API that will allow us to create, read, update and delete a blog. We will use DynamoDB to store our blog data to achieve the functionality of the CRUD API we will use Lambda. To configure our resources we will use &lt;a href="https://www.serverless.com/" rel="noopener noreferrer"&gt;Serverless Framework&lt;/a&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  Initialising the project
&lt;/h2&gt;

&lt;p&gt;First of all, create an empty directory and we will create a new serverless project in this directory. You can use the following command to do that.&lt;/p&gt;

&lt;p&gt;&lt;code&gt;serverless create --template aws-nodejs&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;The above command will create a new serverless project for you from scratch and you can find the &lt;code&gt;serverless.yml&lt;/code&gt; file in the editor. This file is the heart of the project, where we will define all our infrastructure.&lt;/p&gt;

&lt;p&gt;This is how the &lt;code&gt;serverless.yml&lt;/code&gt; file will look after all the resources are defined. I will explain each section of this file further.&lt;/p&gt;


&lt;div class="ltag_gist-liquid-tag"&gt;
  
&lt;/div&gt;


&lt;p&gt;Firstly, start defining the basics like region, stage, and global configuration variables in the provider section.&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;

provider:
  name: aws
  runtime: nodejs12.x
  lambdaHashingVersion: 20201221
  region: ${env:REGION, 'ap-south-1'}
  stage: ${opt:stage, 'dev'}
  timeout: 30



&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;p&gt;Then, we define global-level environment variables, as defined in the image below.&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;

  # Environment variables
  environment:
    STAGE: ${self:provider.stage}
    REGION: ${self:provider.region}
    SERVICE_NAME: ${self:service}-${self:provider.stage}
    DYNAMODB: ${self:service}-${self:provider.stage}


&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;
&lt;h2&gt;
  
  
  IAM role statements
&lt;/h2&gt;

&lt;p&gt;Since we are going to use DynamoDB to store the data and it will be integrated with the lambda function, we will need to define IAM role statements to give permission to the lambda function to access our DynamoDB table.&lt;/p&gt;
&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;

# IAM statements
  iamRoleStatements:
    - Effect: Allow
      Action:
        - dynamodb:GetItem
        - dynamodb:UpdateItem
        - dynamodb:DeleteItem
        - dynamodb:PutItem
      Resource: "arn:aws:dynamodb:${opt:region, self:provider.region}:*:table/${self:provider.environment.DYNAMODB}"
    - Effect: Allow
      Action:
        - lambda:invokeFunction
      Resource: "*"


&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;
&lt;h2&gt;
  
  
  serverless-appsync-plugin
&lt;/h2&gt;

&lt;p&gt;serverless-appsync-plugin allows us to deploy AppSync API without much hassle, it provides a lot of configurations to set up your API on AppSync.&lt;/p&gt;
&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;

plugins:
  - serverless-appsync-plugin


&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;
&lt;h2&gt;
  
  
  Lambda Functions
&lt;/h2&gt;
&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;

functions:
  createBlog:
    handler: createBlog/index.handler
    name: createBlog-${self:provider.stage}
  getBlog:
    handler: getBlog/index.handler
    name: getBlog-${self:provider.stage}
  updateBlog:
    handler: updateBlog/index.handler
    name: updateBlog-${self:provider.stage}
  deleteBlog:
    handler: deleteBlog/index.handler
    name: deleteBlog-${self:provider.stage}


&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;p&gt;Now, it's time to set up the appsync configuration provided by serverless-appsync-plugin, this plugin has a lot of configurations available, in the below code snippet you can find some of them. In the custom section of the serverless.yml file, we can define the configurations.&lt;/p&gt;

&lt;p&gt;To know more about what each of these configuration parameters does, head over to this &lt;a href="https://www.npmjs.com/package/serverless-appsync-plugin" rel="noopener noreferrer"&gt;link&lt;/a&gt;.&lt;/p&gt;


&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;

&lt;p&gt;custom:&lt;br&gt;
  appSync:&lt;br&gt;
    name: appsync-crud-api&lt;br&gt;
    schema: schema.api.graphql&lt;br&gt;
    authenticationType: API_KEY&lt;br&gt;
    apiKeys:&lt;br&gt;
      - apiKey&lt;br&gt;
    dataSources:&lt;br&gt;
      - type: AWS_LAMBDA&lt;br&gt;
        name: createBlog&lt;br&gt;
        description: 'Lambda'&lt;br&gt;
        config:&lt;br&gt;
          functionName: createBlog&lt;br&gt;&lt;br&gt;
      - type: AWS_LAMBDA&lt;br&gt;
        name: getBlog&lt;br&gt;
        description: 'Lambda'&lt;br&gt;
        config:&lt;br&gt;
          functionName: getBlog&lt;br&gt;
      - type: AWS_LAMBDA&lt;br&gt;
        name: updateBlog&lt;br&gt;
        description: 'Lambda'&lt;br&gt;
        config:&lt;br&gt;
          functionName: updateBlog&lt;br&gt;
      - type: AWS_LAMBDA&lt;br&gt;
        name: deleteBlog&lt;br&gt;
        description: 'Lambda'&lt;br&gt;
        config:&lt;br&gt;
          functionName: deleteBlog&lt;/p&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;
&lt;h2&gt;
&lt;br&gt;
  &lt;br&gt;
  &lt;br&gt;
  DynamoDB Table&lt;br&gt;
&lt;/h2&gt;

&lt;p&gt;To store the blog data we are using the dynamodb table which can be configured like the below:&lt;/p&gt;


&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;

&lt;p&gt;resources:&lt;br&gt;
  Resources:&lt;br&gt;
    BlogsTable:&lt;br&gt;
      Type: 'AWS::DynamoDB::Table'&lt;br&gt;
      Properties:&lt;br&gt;
        AttributeDefinitions:&lt;br&gt;
          - AttributeName: id&lt;br&gt;
            AttributeType: S&lt;br&gt;
        KeySchema:&lt;br&gt;
          - AttributeName: id&lt;br&gt;
            KeyType: HASH&lt;br&gt;
        ProvisionedThroughput:&lt;br&gt;
          ReadCapacityUnits: 1&lt;br&gt;
          WriteCapacityUnits: 1&lt;br&gt;
        TableName: ${self:provider.environment.DYNAMODB}&lt;/p&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;
&lt;h2&gt;
&lt;br&gt;
  &lt;br&gt;
  &lt;br&gt;
  GraphQL Schema&lt;br&gt;
&lt;/h2&gt;

&lt;p&gt;Every graphql API needs a schema where we define all the operations(query, mutation, subscription). We will need to create a file named &lt;code&gt;schema.api.graphql&lt;/code&gt;. This same file we have referred to in the appsync plugin configuration is in the custom section. The file should look something like this:&lt;/p&gt;


&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;

&lt;p&gt;schema {&lt;br&gt;
    query: Query&lt;br&gt;
    mutation: Mutation&lt;br&gt;
}&lt;/p&gt;

&lt;p&gt;type Query {&lt;br&gt;
    # Query for blog details&lt;br&gt;
    getBlog(id: ID!): Blog&lt;br&gt;
}&lt;/p&gt;

&lt;p&gt;type Mutation {&lt;br&gt;
    # Create blog&lt;br&gt;
    createBlog(input: CreateBlogInput!): AWSJSON&lt;/p&gt;
&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;# Update blog
updateBlog(input: UpdateBlogInput!): AWSJSON

# delete blog
deleteBlog(id: ID!): AWSJSON
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;
&lt;p&gt;}&lt;/p&gt;

&lt;p&gt;input UpdateBlogInput {&lt;br&gt;
    id: ID!&lt;br&gt;
    title: String&lt;br&gt;
    blogUrl: String&lt;br&gt;
    author: String&lt;br&gt;
    publicationDate: AWSDate&lt;br&gt;
}&lt;/p&gt;

&lt;p&gt;input CreateBlogInput {&lt;br&gt;
    title: String!&lt;br&gt;
    blogUrl: String!&lt;br&gt;
    author: String!&lt;br&gt;
    publicationDate: AWSDate!&lt;br&gt;
}&lt;/p&gt;

&lt;p&gt;type Blog {&lt;br&gt;
    id: ID&lt;br&gt;
    title: String&lt;br&gt;
    blogUrl: String&lt;br&gt;
    author: String&lt;br&gt;
    publicationDate: AWSDate&lt;br&gt;
}&lt;/p&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;
&lt;h2&gt;
&lt;br&gt;
  &lt;br&gt;
  &lt;br&gt;
  Lambda Function Code&lt;br&gt;
&lt;/h2&gt;

&lt;p&gt;Now it's time to move towards lambda functions, which will act as a resolver for the API. Hence the name, "Lambda Resolvers". As you can see in the image below, I have created a folder for each of the lambda functions which we defined in the functions section in the &lt;code&gt;serverless.yml&lt;/code&gt; file.&lt;/p&gt;

&lt;p&gt;All four lambdas just perform very simple dynamodb CRUD operations using dynamodb &lt;code&gt;DocumentClient()&lt;/code&gt; from aws-sdk. I won't explain the lambda code since it's really straightforward. You can head over to this &lt;a href="https://bit.ly/appsync-crud-api" rel="noopener noreferrer"&gt;repository&lt;/a&gt; and find the code.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fp0d6iryy2nb9ps5s92r1.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fp0d6iryy2nb9ps5s92r1.png" alt="Lambda Folder Structure"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;If you have followed until now, then it's time to deploy our service 🚀.&lt;/p&gt;

&lt;p&gt;Use &lt;code&gt;serverless deploy&lt;/code&gt; to deploy all of your defined resources to the aws cloud. This will give you the deployed API URL and API_KEY in the console which can be used by the client application.&lt;/p&gt;

&lt;h2&gt;
  
  
  Testing the GraphQL API
&lt;/h2&gt;

&lt;p&gt;Once your deployment is successful, you'll see something like this in the AppSync console. You'll see a tile with the name you have given to your API.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fygms2qhz32yvwxperw7h.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fygms2qhz32yvwxperw7h.png" alt="Testing in AppSync Console"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Click on the tile and you'll see another interface, then in the left nav click on Queries. You should see the following interface where you will find all the CRUD operations we have defined in our &lt;code&gt;schema.api.graphql&lt;/code&gt; file.&lt;/p&gt;

&lt;p&gt;In the mutations section, you'll find &lt;code&gt;createBlog&lt;/code&gt;, &lt;code&gt;updateBlog&lt;/code&gt;, and &lt;code&gt;deleteBlog&lt;/code&gt;, and in the queries section, you'll find &lt;code&gt;getBlog&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;You can then test the &lt;code&gt;createBlog&lt;/code&gt; mutation by entering some data and hitting the play button on the top should give you the success response by returning the created blog's data in the rightmost window.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fs93fjcfiwkbddgou9wyy.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fs93fjcfiwkbddgou9wyy.png" alt="Testing in AppSync Console"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;By doing the same steps, you can test the other operations as well.&lt;/p&gt;

&lt;p&gt;Aaaand 🥁, we are done with the whole backend side of things. We just created an API for a simple blog application.&lt;/p&gt;

&lt;p&gt;That's all for this blog, if you liked it do not forget to react to the blog. Thanks for reading and following along, Peace ☮✌️.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Feel free to reach out to me:&lt;/strong&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;GitHub - &lt;a href="https://github.com/iabhishek07" rel="noopener noreferrer"&gt;https://github.com/iabhishek07&lt;/a&gt;&lt;br&gt;
Twitter - &lt;a href="https://twitter.com/abhishekrwagh" rel="noopener noreferrer"&gt;https://twitter.com/abhishekrwagh&lt;/a&gt;&lt;br&gt;
LinkedIn - &lt;a href="https://www.linkedin.com/in/iamabhishek21/" rel="noopener noreferrer"&gt;https://www.linkedin.com/in/iamabhishek21/&lt;/a&gt;&lt;br&gt;
Email - &lt;a href="mailto:waghabhi21@gmail.com"&gt;waghabhi21@gmail.com&lt;/a&gt;&lt;/p&gt;
&lt;/blockquote&gt;

</description>
      <category>aws</category>
      <category>lambda</category>
      <category>appsync</category>
      <category>graphql</category>
    </item>
    <item>
      <title>How to deploy your websites with AWS Amplify?</title>
      <dc:creator>Abhishek Rajendra Wagh</dc:creator>
      <pubDate>Fri, 14 Aug 2020 17:55:37 +0000</pubDate>
      <link>https://forem.com/iabhishek07/how-to-deploy-your-websites-with-aws-amplify-305h</link>
      <guid>https://forem.com/iabhishek07/how-to-deploy-your-websites-with-aws-amplify-305h</guid>
      <description>&lt;h2&gt;
  
  
  &lt;strong&gt;What is AWS Amplify&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;AWS Amplify helps mobile developers and web developers to build highly scalable and secure full-stack applications powered by AWS. Amplify enables developers to easily create custom onboarding flows, develop voice-enabled experiences, and many more.&lt;/p&gt;

&lt;p&gt;We are going to use AWS Amplify Console to deploy our static website built using HTML and SASS.&lt;/p&gt;

&lt;p&gt;AWS Amplify Console allows users to host static websites along with the accelerated release cycle by providing a simple CI/CD workflow for the deployment.&lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;strong&gt;Initial Requirements&lt;/strong&gt;
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;AWS Account (free tier works!)&lt;/li&gt;
&lt;li&gt;GitHub repository of the project&lt;/li&gt;
&lt;li&gt;A Domain (in case you want a custom domain)&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Now head over to &lt;a href="https://aws.amazon.com/amplify/getting-started/"&gt;aws.amazon.com/amplify&lt;/a&gt; and create a free tier account. It's simple you just need to click on 'create an AWS account' and follow the procedure.&lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;strong&gt;How it works: Deploy&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;Now there are just three simple steps to deploy your static web application with Amplify. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--TRIhFxcx--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/06s4a310050hm8f3fphd.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--TRIhFxcx--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/06s4a310050hm8f3fphd.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;br&gt;
&lt;strong&gt;Step 1: Connecting your GitHub Repository&lt;/strong&gt;&lt;br&gt;
You can upload your project to a repository on GitHub, Bit Bucket, GitLab, or CodeCommit.&lt;/p&gt;

&lt;p&gt;I uploaded my website to GitHub, so I am going to select the GitHub option to connect source code.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--phwPamAF--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/ucnvt0o2s35742loe2ph.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--phwPamAF--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/ucnvt0o2s35742loe2ph.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;br&gt;
Click 'Continue' to proceed and now after authentication with GitHub, you have to select a particular branch from the repository, in my case name of the repository is 'Natours' and the branch is 'master'.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--yJFA648L--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/6nz4414vymewiskzmani.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--yJFA648L--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/6nz4414vymewiskzmani.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;br&gt;
Now, click on next and you will be directed to the next step!&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Step 2: Configure Build Settings&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;In this step, you will be asked to &lt;em&gt;pick a name&lt;/em&gt; for your application and to review your &lt;em&gt;build&lt;/em&gt; and &lt;em&gt;test&lt;/em&gt; settings, which are auto-detected by the console itself. In advance settings, you can also add custom build image and environment variables.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--R-myPbJ_--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/cw3vquw82wg8kiunotbh.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--R-myPbJ_--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/cw3vquw82wg8kiunotbh.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;After that, you have to click next and review your 'Repository details' and 'App settings'. If everything is alright, you can click on "Save and Deploy".&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Step 3: Deploy your App&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;When you click on save and deploy, the continuous deployment starts, you can see the following steps on the console:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--rRV7j6BQ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/uvso2f4286c675z3cwu3.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--rRV7j6BQ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/uvso2f4286c675z3cwu3.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;After all the four steps turn into green checkmarks, you can see the following screen, and you can click the website preview on the left side to open your live website!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--DkxT1pFM--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/9mjzmz0rd9u1gaq1eeat.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--DkxT1pFM--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/9mjzmz0rd9u1gaq1eeat.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Here is the &lt;a href="https://master.d3udblknnqzuh2.amplifyapp.com/"&gt;link&lt;/a&gt; to the website I just deployed! &lt;/p&gt;

&lt;p&gt;Thanks for reading and following along, Peace ☮✌️.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Feel free to reach out to me:&lt;/strong&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;strong&gt;GitHub&lt;/strong&gt; - &lt;a href="https://github.com/iabhishek07"&gt;https://github.com/iabhishek07&lt;/a&gt;&lt;br&gt;
&lt;strong&gt;Twitter&lt;/strong&gt; -  &lt;a href="https://twitter.com/I_AM_Abhishek07"&gt;https://twitter.com/I_AM_Abhishek07&lt;/a&gt;&lt;br&gt;
&lt;strong&gt;LinkedIn&lt;/strong&gt; -  &lt;a href="https://www.linkedin.com/in/abhishek-wagh-674283141/"&gt;https://www.linkedin.com/in/abhishek-wagh-674283141/&lt;/a&gt;&lt;br&gt;
&lt;strong&gt;EMail&lt;/strong&gt; - &lt;a href="mailto:waghabhi21@gmail.com"&gt;waghabhi21@gmail.com&lt;/a&gt;&lt;/p&gt;
&lt;/blockquote&gt;

</description>
      <category>aws</category>
      <category>serverless</category>
      <category>webdev</category>
    </item>
  </channel>
</rss>
