<?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>DEV Community: Akil Mahmod Tipu</title>
    <description>The latest articles on DEV Community by Akil Mahmod Tipu (@akiltipu).</description>
    <link>https://dev.to/akiltipu</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%2F341832%2F63ca2594-783b-4b93-9768-bebffb0374f5.png</url>
      <title>DEV Community: Akil Mahmod Tipu</title>
      <link>https://dev.to/akiltipu</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/akiltipu"/>
    <language>en</language>
    <item>
      <title>How I Passed the AWS Certified Cloud Practitioner in 4 Days</title>
      <dc:creator>Akil Mahmod Tipu</dc:creator>
      <pubDate>Wed, 26 Jul 2023 04:48:26 +0000</pubDate>
      <link>https://dev.to/akiltipu/how-i-passed-the-aws-certified-cloud-practitioner-in-4-days-2mge</link>
      <guid>https://dev.to/akiltipu/how-i-passed-the-aws-certified-cloud-practitioner-in-4-days-2mge</guid>
      <description>&lt;h2&gt;
  
  
  I passed the AWS Certified Cloud Practitioner exam in 4 days, &lt;em&gt;with prior cloud experience.&lt;/em&gt;
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Here are the steps I followed:&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;Took a practice test and scored &lt;strong&gt;58%.&lt;/strong&gt; (from 6 Practice Exams Course by Stephane Maarek on Udemy)&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Watched Stephane Maarek's Practitioner Course(Udemy) on 2x speed, taking &lt;strong&gt;no notes.&lt;/strong&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Read the course slides and took &lt;strong&gt;handwritten&lt;/strong&gt; notes (almost 300 pages).&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Took another practice test and scored &lt;strong&gt;81%.&lt;/strong&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Reviewed my own handwritten notes.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Took 4 more practice tests, reviewed incorrect and correct questions each time, and took handwritten notes.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;On exam day, I didn't study and passed the exam.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;strong&gt;Tips:&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;Don't study any dumps. Instead, take &lt;strong&gt;paid&lt;/strong&gt; practice tests.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Review your incorrect and correct questions after each practice test.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Don't over study. The exam is designed to be passed with 70% correct answers.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;I hope this helps!&lt;/p&gt;

</description>
      <category>aws</category>
      <category>certification</category>
      <category>cloudpractitioner</category>
      <category>beginners</category>
    </item>
    <item>
      <title>Build an End-to-End Web Application with AWS: Step-by-Step Guide</title>
      <dc:creator>Akil Mahmod Tipu</dc:creator>
      <pubDate>Wed, 12 Jul 2023 08:34:18 +0000</pubDate>
      <link>https://dev.to/akiltipu/build-an-end-to-end-web-application-with-aws-step-by-step-guide-5hia</link>
      <guid>https://dev.to/akiltipu/build-an-end-to-end-web-application-with-aws-step-by-step-guide-5hia</guid>
      <description>&lt;p&gt;In this blog post, we will walk through the steps involved in building an end-to-end web application using AWS services.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Overview of the services and application we'll be building:&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The application we will build is a simple calculator. Users will be able to enter two numbers and the application will calculate the result. The result will be stored in a DynamoDB table and the user will be able to view it again later.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Architect the web application from scratch:&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The first step is to architect the web application. We need to decide how the different services will interact with each other.&lt;/p&gt;

&lt;p&gt;The user will interact with the application through a web page. The web page will be hosted on Amplify. When the user clicks the "Calculate" button, the web page will send a request to the Lambda function. The Lambda function will perform the calculation and store the result in the DynamoDB table. The web page will then retrieve the result from the DynamoDB table and display it to the user.&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%2Fr1ra1k1xfld4yeqj2p5v.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%2Fr1ra1k1xfld4yeqj2p5v.png" alt="Web Application Architecture diagram"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;We will use five AWS services:&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%2Feio5ri9lm97a7r67s07o.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%2Feio5ri9lm97a7r67s07o.png" alt="Five AWS Services that we will in this guide"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  &lt;strong&gt;AWS Amplify:&lt;/strong&gt; Amplify is a service that makes it easy to build and deploy web applications.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;AWS Lambda:&lt;/strong&gt; To perform math calculations. Lambda is a service that lets you run code without provisioning or managing servers. &lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Amazon DynamoDB:&lt;/strong&gt; To store the results of the math calculations. DynamoDB is a service that provides a NoSQL database.
&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Amazon API Gateway:&lt;/strong&gt; To expose the math functionality to users. API Gateway is a service that helps you create, publish, and manage APIs.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;IAM:&lt;/strong&gt; To manage permissions.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Prerequisites:&lt;/strong&gt;&lt;br&gt;
Before you follow along with this tutorial, you will need the following:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  An AWS account. &lt;/li&gt;
&lt;li&gt;  A basic understanding of AWS services.&lt;/li&gt;
&lt;li&gt;  A text editor.&lt;/li&gt;
&lt;/ul&gt;
&lt;h3&gt;
  
  
  Step 1: Create a Web Page with Amplify
&lt;/h3&gt;

&lt;p&gt;We will use Amplify to create and host a simple web page. The web page will simply display the name of our application.&lt;br&gt;
Before getting started with Amplify create an &lt;code&gt;index.html&lt;/code&gt; file with the following code:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;!DOCTYPE html&amp;gt;
&amp;lt;html&amp;gt;
&amp;lt;head&amp;gt;
    &amp;lt;meta charset="UTF-8"&amp;gt;
    &amp;lt;title&amp;gt;To the Power of Math!&amp;lt;/title&amp;gt;
&amp;lt;/head&amp;gt;

&amp;lt;body&amp;gt;
    To the Power of Math!
&amp;lt;/body&amp;gt;
&amp;lt;/html&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Or you can copy the &lt;code&gt;index.html&lt;/code&gt; &lt;a href="https://gist.github.com/akiltipu/16f64b2af8e7f11fc28ac43a2655b86a" rel="noopener noreferrer"&gt;this Gist&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;and zip this file name &lt;strong&gt;index.zip&lt;/strong&gt;. Now,&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt; Go to the Amplify Console: &lt;a href="https://console.aws.amazon.com/amplify/home" rel="noopener noreferrer"&gt;https://console.aws.amazon.com/amplify/home&lt;/a&gt;.&lt;/li&gt;
&lt;li&gt; Select Amplify Hosting, Click Continue&lt;/li&gt;
&lt;li&gt; Select Deploy without Git provider for manual deployment.
&lt;/li&gt;
&lt;li&gt; Enter a name for your project and an environment name.&lt;/li&gt;
&lt;/ol&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%2F2w96ti4kiglvkx6tzkdl.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%2F2w96ti4kiglvkx6tzkdl.png" alt="Naming the app on Amplify"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt; Drag and drop the index.zip file from your local machine into the Method field. &lt;/li&gt;
&lt;li&gt;Click Save and Deploy.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Once the deployment is complete, you will see a Deployment a successfully completed message and link to your web page. Open the link in your browser to view the web page. &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%2Fl4frxf74kxvrr6j4zko4.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%2Fl4frxf74kxvrr6j4zko4.png" alt="Deployed On Amplify"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;And your live website should look like this:&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%2F8kmxzry7qcmppjinbnyo.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%2F8kmxzry7qcmppjinbnyo.png" alt="Apmlify live website"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Step 2: Create a Lambda Function to Perform Math Calculations
&lt;/h3&gt;

&lt;p&gt;We will use a Lambda function to perform the math calculations that our users will need. The Lambda function will take two numbers as input and return the calculation result.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Go to the Lambda Console: &lt;a href="https://console.aws.amazon.com/lambda/home" rel="noopener noreferrer"&gt;https://console.aws.amazon.com/lambda/home&lt;/a&gt;.&lt;/li&gt;
&lt;/ol&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%2F769rw9emly0cq24q4519.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%2F769rw9emly0cq24q4519.png" alt="Creating AWS Lambda Function"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt; Click &lt;strong&gt;&lt;em&gt;Create a function.&lt;/em&gt;&lt;/strong&gt;
&lt;/li&gt;
&lt;li&gt; Select the &lt;strong&gt;&lt;em&gt;Author from scratch.&lt;/em&gt;&lt;/strong&gt;
&lt;/li&gt;
&lt;li&gt; Enter a name for your Lambda function.
&lt;/li&gt;
&lt;li&gt; Select the latest Python 3.10 runtime (Architecture: x86_64).
&lt;/li&gt;
&lt;li&gt; You can leave everything else the same.&lt;/li&gt;
&lt;li&gt;Click &lt;strong&gt;&lt;em&gt;Create function.&lt;/em&gt;&lt;/strong&gt;
&lt;/li&gt;
&lt;/ol&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%2Fp2l39tdwvj0j0bddhhb4.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%2Fp2l39tdwvj0j0bddhhb4.png" alt="AWS Lambda Code"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;The Lambda function code will be pre-populated with some sample code. Replace the sample code with the following code:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;# import the JSON utility package
import json
# import the Python math library
import math

# define the handler function that the Lambda service will use an entry point
def lambda_handler(event, context):

# extract the two numbers from the Lambda service's event object
    mathResult = math.pow(int(event['base']), int(event['exponent']))

    # return a properly formatted JSON object
    return {
    'statusCode': 200,
    'body': json.dumps('Your result is ' + str(mathResult))
    }
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Or &lt;a href="https://gist.github.com/akiltipu/a3ee36a771dea5e9589e41772c4fba25" rel="noopener noreferrer"&gt;Copy the code from this Gist&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;We have a simple code that imports the &lt;code&gt;JSON&lt;/code&gt; utility package and the Python math library. The lambda handler is where most of the work is done. The user passes in two numbers, the base number, and the exponent, which are extracted from the event object. We use &lt;code&gt;math.pow&lt;/code&gt; function to calculate the result. Finally, we return the result in a &lt;code&gt;JSON&lt;/code&gt; object.&lt;/p&gt;

&lt;p&gt;Now make sure to save the code by &lt;code&gt;Ctrl + S&lt;/code&gt; and very importantly &lt;strong&gt;Deploy&lt;/strong&gt; the code.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Testing our Lambda function:&lt;/strong&gt;&lt;br&gt;
To test our Lambda function, set up a new test event by clicking the dropdown arrow next to the "test" option. &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%2Fqrrrb9y7opg7tvkne8k0.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%2Fqrrrb9y7opg7tvkne8k0.png" alt="Creating AWS Lambda Function Test event"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Create an event named "PowerOfMathTestEvent" and leave it private. We only need two values: the base and the exponent. You can choose any values you want. For example, I'll use 2 as the base and 3 as the exponent, which should give us 8. Scroll down and save.&lt;/p&gt;

&lt;p&gt;We've finished configuring the test event, and now it's time to run the test. Simply click the Test button. If everything is working correctly, you should receive a status code of 200 and the result should be 8. This confirms that our Lambda function is functioning properly. &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%2Fxsiaeg808vdz2y746p3w.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%2Fxsiaeg808vdz2y746p3w.png" alt="AWS Labmda Test result"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;So far, we have a basic HTML page hosted on Amplify and a Lambda function for performing simple math operations. Now, our next step is to find a way to invoke the Lambda function without users having to access the AWS console. We need a public endpoint or URL that can trigger the function to run. To achieve this, we'll utilize API Gateway, a core AWS service for building APIs (HTTP, REST, or WebSocket). API Gateway is the ideal method to invoke our Lambda function. Let's proceed with setting it up.&lt;/p&gt;
&lt;h3&gt;
  
  
  STEP 3: Creating a REST API for our Lambda function using API Gateway
&lt;/h3&gt;

&lt;p&gt;We're now going to create a REST API for our Lambda function using API Gateway. Go to the Lambda Console: &lt;a href="https://console.aws.amazon.com/apigateway/home" rel="noopener noreferrer"&gt;https://console.aws.amazon.com/apigateway/home&lt;/a&gt;&lt;br&gt;
Click Create API button and from REST API select Build. Select "REST API" and click on the "New API" button to begin. &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%2Fzv2wop1mi2u5izhcjkn9.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%2Fzv2wop1mi2u5izhcjkn9.png" alt="Creating New API from API Gateway"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Leave the default options and give it a name, such as "&lt;strong&gt;PowerOfMathAPI&lt;/strong&gt;" and endpoint type Regional click on "&lt;strong&gt;Create API&lt;/strong&gt;" to proceed.&lt;/p&gt;

&lt;p&gt;Currently, our API is empty, so let's add a method. In the left panel, select "&lt;strong&gt;Resources&lt;/strong&gt;," then select the backslash ("&lt;strong&gt;/&lt;/strong&gt;"). From the actions menu, choose "&lt;strong&gt;Create Method&lt;/strong&gt;." Select "&lt;strong&gt;POST&lt;/strong&gt;" as the method type since we'll be receiving data from the user. &lt;strong&gt;Save&lt;/strong&gt; the method.&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%2F75bw8asindhw6a9v1li0.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%2F75bw8asindhw6a9v1li0.png" alt="Creating API"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;For the integration type, choose "&lt;strong&gt;Lambda Function.&lt;/strong&gt;" Enter the name of the Lambda function, such as "&lt;strong&gt;PowerOfMathFunction&lt;/strong&gt;." Save your changes.&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%2Fvu4v1act9k2b16nt26av.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%2Fvu4v1act9k2b16nt26av.png" alt="Creating New API using POST method"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Next, we need to enable Cross-Origin Resource Sharing (CORS). To do this, ensure that "&lt;strong&gt;POST&lt;/strong&gt;" is selected in the API Gateway console. Then, from the actions menu, choose "&lt;strong&gt;Enable CORS&lt;/strong&gt;." This allows a web application on one domain to access resources on a different domain. Since our web application is hosted on Amplify and our Lambda function will run on another domain, we need to enable CORS for them to work together. Simply click on "&lt;strong&gt;Enable CORS&lt;/strong&gt;" and &lt;strong&gt;confirm&lt;/strong&gt; your selection.&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%2Fs33rtzt9h2fmjrf46apz.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%2Fs33rtzt9h2fmjrf46apz.png" alt="Enabling CORS"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Now, let's deploy the API to test it out. In the API Gateway console, click on the actions menu and choose "&lt;strong&gt;Deploy API&lt;/strong&gt;." We'll set up a new stage, which we'll name "&lt;strong&gt;dev&lt;/strong&gt;" for this example. Click on "&lt;strong&gt;Deploy.&lt;/strong&gt;"&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%2F0357dfynb4ko7uifyg41.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%2F0357dfynb4ko7uifyg41.png" alt="Deploying API"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;To validate our setup, go to the left panel, click on "&lt;strong&gt;Resources,&lt;/strong&gt;" and select "&lt;strong&gt;POST.&lt;/strong&gt;" Here, you'll see the flow of the request from the method to the integration with Lambda and back to the client. To test it, click on the blue lightning &lt;strong&gt;bolt icon.&lt;/strong&gt;&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%2Flme9r7yv5h0qob85c1en.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%2Flme9r7yv5h0qob85c1en.png" alt="Testing API"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;You can send test data in a simple format, such as &lt;code&gt;{"base”: 2, “exponent”: 4}&lt;/code&gt; Click on "&lt;strong&gt;Test&lt;/strong&gt;," and you should receive a result of 16. Great!&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%2Fadn2qx49m5vz9x4ezkvv.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%2Fadn2qx49m5vz9x4ezkvv.png" alt="Showing Test result of API"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;This progress means we can now trigger our math function in Lambda with an API call.&lt;/p&gt;

&lt;p&gt;Now, we can trigger our math function in Lambda with an API call. However, we still need to connect it to our &lt;code&gt;index.html&lt;/code&gt; page and Amplify, but we'll address that soon.&lt;/p&gt;

&lt;p&gt;Next, let's explore how to incorporate a database into our setup. We want to store the math results and also return them to the user. While it's not necessary to store the results, most real-world applications use databases. We'll use DynamoDB, a lightweight NoSQL database that doesn't require upfront schema and relationship setup like relational databases.&lt;/p&gt;

&lt;p&gt;Additionally, we need to handle permissions between different parts of the application. In this case, we need to grant our Lambda function permission to write to the database. Let's proceed with configuring this aspect.&lt;/p&gt;
&lt;h3&gt;
  
  
  Step 4: Create a DynamoDB Table to Store the Results
&lt;/h3&gt;

&lt;p&gt;To store our math results, let's create a new DynamoDB table. Go to the DynamoDB Console: &lt;a href="https://console.aws.amazon.com/dynamodb/home" rel="noopener noreferrer"&gt;https://console.aws.amazon.com/dynamodb/home&lt;/a&gt;&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%2Ff7fc29vir3c41qmjweie.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%2Ff7fc29vir3c41qmjweie.png" alt="Creating Table on AWS DynamoDB"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Click on "&lt;strong&gt;Create table&lt;/strong&gt;" and provide a table name, such as "&lt;strong&gt;PowerOfMathDatabase.&lt;/strong&gt;" For the partition key, let's use "&lt;strong&gt;id&lt;/strong&gt;." Leave the remaining settings as default and &lt;strong&gt;create&lt;/strong&gt; the table.&lt;/p&gt;

&lt;p&gt;Now, it's important to save the &lt;strong&gt;Amazon Resource Name (ARN)&lt;/strong&gt; for this table. Go to the table details, specifically the "&lt;strong&gt;General information&lt;/strong&gt;" and "&lt;strong&gt;Additional info&lt;/strong&gt;" sections. Copy the ARN and keep it anywhere that will be needed later.&lt;/p&gt;

&lt;p&gt;Let's grant our Lambda function permission to write to the DynamoDB table. Go back to the Lambda function "&lt;strong&gt;PowerOfMathFunction&lt;/strong&gt;" (or locate it in the Lambda console). Access the configuration tab and navigate to the "&lt;strong&gt;Permissions&lt;/strong&gt;" section. Click on the &lt;strong&gt;role name&lt;/strong&gt;, which will open in a new tab.&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%2Fpiqmcxy9ibdvfbmlol7t.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%2Fpiqmcxy9ibdvfbmlol7t.png" alt="AWS Lambda Permission setep"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;To add additional permissions for DynamoDB, click on "&lt;strong&gt;Add permissions&lt;/strong&gt;" on the right side. Then, choose "&lt;strong&gt;Create inline policy&lt;/strong&gt;" and select the JSON tab.&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%2F5mqvxwomy8b474ibbc5c.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%2F5mqvxwomy8b474ibbc5c.png" alt="Adding permission and Creating Inline Policy"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Copy JSON code below or from this &lt;a href="https://gist.github.com/akiltipu/9651d5297e7b6f81fb036429a5fb3e66" rel="noopener noreferrer"&gt;Gist&lt;/a&gt; and replace the existing code.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "VisualEditor0",
            "Effect": "Allow",
            "Action": [
                "dynamodb:PutItem",
                "dynamodb:DeleteItem",
                "dynamodb:GetItem",
                "dynamodb:Scan",
                "dynamodb:Query",
                "dynamodb:UpdateItem"
            ],
            "Resource": "YOUR-TABLE-ARN"
        }
    ]
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The JSON code grants various DynamoDB actions to the Lambda function. However, make sure to update the table &lt;strong&gt;ARN&lt;/strong&gt; in the code. Retrieve the ARN you previously saved and replace it accordingly. &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%2Fn8o9fwd927ois0px9nba.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%2Fn8o9fwd927ois0px9nba.png" alt="Specify Permission"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Review the policy, give it a name (e.g., "PowerOfMathDynamoPolicy"), and click on "&lt;strong&gt;Create policy&lt;/strong&gt;."&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%2Fn90mc6cq3hbvdqdjs4vc.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%2Fn90mc6cq3hbvdqdjs4vc.png" alt="Review and Create Policy"&gt;&lt;/a&gt;&lt;br&gt;
With the permissions in place, we have completed this step.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Updating the Lambda function code to write to the DynamoDB table&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Now, let's update the Lambda function to interact with the database. Go back to the Lambda function "PowerOfMathFunction" and access the code. Replace the existing code with the updated code provided below or copy from this &lt;a href="https://gist.github.com/akiltipu/399788037680b3a93e5adcac05210046" rel="noopener noreferrer"&gt;Gist&lt;/a&gt;.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;# import the JSON utility package
import json
# import the Python math library
import math

# import the AWS SDK (for Python the package name is boto3)
import boto3
# import two packages to help us with dates and date formatting
from time import gmtime, strftime

# create a DynamoDB object using the AWS SDK
dynamodb = boto3.resource('dynamodb')
# use the DynamoDB object to select our table
table = dynamodb.Table('PowerOfMathDatabase')
# store the current time in a human readable format in a variable
now = strftime("%a, %d %b %Y %H:%M:%S +0000", gmtime())

# define the handler function that the Lambda service will use an entry point
def lambda_handler(event, context):

# extract the two numbers from the Lambda service's event object
    mathResult = math.pow(int(event['base']), int(event['exponent']))

# write result and time to the DynamoDB table using the object we instantiated and save response in a variable
    response = table.put_item(
        Item={
            'id': str(mathResult),
            'LatestGreetingTime':now
            })

# return a properly formatted JSON object
    return {
    'statusCode': 200,
    'body': json.dumps('Your result is ' + str(mathResult))
    }
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Ensure that you modify the table name if necessary.&lt;/p&gt;

&lt;p&gt;The updated code includes new imports for the AWS SDK (boto3) and packages for date and time formatting. It retrieves the DynamoDB table resource, gets the current time, and inserts the math result along with the timestamp into the table using the table.put_item function.&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%2F0fm5etkrdxvleka9yls2.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%2F0fm5etkrdxvleka9yls2.png" alt="Updated AWS Lambda Function Source Code"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;After pasting the updated code, save the changes and deploy the function to apply the updates. Then, test the function using the same test case. Verify that the result is still correct. Additionally, check the DynamoDB table and explore the table items button to see the stored result.&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%2F17ap1m15jwtgzx5pezg6.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%2F17ap1m15jwtgzx5pezg6.png" alt="Showing DynamoDB table data"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;With the Lambda function now writing data to the DynamoDB table and having the proper permissions, we're making progress.&lt;/p&gt;

&lt;p&gt;We're almost there! However, you might have noticed that we're missing a connection between Amplify and API Gateway. To address this, we need to update the index.html page.&lt;/p&gt;

&lt;p&gt;Open the &lt;code&gt;index.html&lt;/code&gt; file and replace its contents with the provided code from this &lt;a href="https://gist.github.com/akiltipu/2d5f77e5421eb27ffdd8c777c83fe42a" rel="noopener noreferrer"&gt;PowerOfMath_index_updated.html Gist&lt;/a&gt; &lt;/p&gt;

&lt;p&gt;The updated code includes some styling enhancements and a form where users can input their numbers. The magic happens with the "&lt;code&gt;callApi&lt;/code&gt;" function, which connects to the API Gateway endpoint. &lt;strong&gt;&lt;em&gt;Make sure to update the endpoint URL with your own APIGateway Invoke URL.&lt;/em&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Save the changes to the &lt;code&gt;index.html&lt;/code&gt; file. Create a &lt;code&gt;zip&lt;/code&gt; file containing the updated file, and delete the previous zip file if necessary. Drag and drop the new zip file into Amplify, and it will automatically redeploy.&lt;/p&gt;

&lt;p&gt;Once the deployment is successful, refresh the page. You will now see the updated web application with the new styling and functionality.&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%2F42wr4ivwkb6ykw8qesfv.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%2F42wr4ivwkb6ykw8qesfv.png" alt="Updated web application with new styling and functionality"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Let's go through what happens when we use the web application. We enter our numbers, for example, 3 to the power of 5. When we click the calculate button, the script on the HTML page calls API Gateway. This triggers the Lambda function, which performs the calculation and writes the result to the database. Finally, we receive a message in the browser through API Gateway. Let's try it out. Calculate... and the result is 243.&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%2F4lwdoygondrtl01kq14i.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%2F4lwdoygondrtl01kq14i.png" alt="Final Web App with Functionality"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;That's it! Our application is complete. Well done! Feel free to share the link with your friends if you'd like.&lt;/p&gt;

&lt;h3&gt;
  
  
  IMPORTANT!! Delete your resources (I'll show you how)
&lt;/h3&gt;

&lt;p&gt;Before we conclude, it's essential to delete all the resources we created to avoid &lt;strong&gt;unexpected charges&lt;/strong&gt;. Follow these simple steps to delete everything:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;Close any tabs related to the application.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;In the Amplify console, click on "&lt;strong&gt;Actions&lt;/strong&gt;" in the top right corner and select "&lt;strong&gt;Delete app&lt;/strong&gt;." Confirm the deletion.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Move to DynamoDB and click on "&lt;strong&gt;Tables.&lt;/strong&gt;" Locate the "&lt;strong&gt;PowerOfMathDatabase&lt;/strong&gt;" table and choose "&lt;strong&gt;Delete.&lt;/strong&gt;" Confirm the deletion.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Delete the Lambda function by selecting "&lt;strong&gt;PowerOfMathFunction&lt;/strong&gt;" and clicking on "&lt;strong&gt;Actions&lt;/strong&gt;" and "&lt;strong&gt;Delete&lt;/strong&gt;."&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Lastly, go to API Gateway, click on "&lt;strong&gt;APIs&lt;/strong&gt;," and select the appropriate API. Choose "&lt;strong&gt;Actions&lt;/strong&gt;" and "&lt;strong&gt;Delete&lt;/strong&gt;" to delete it.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;And that's it! By following these steps, you have successfully removed all the resources we created. If you found this helpful, consider liking and follow me for more content. &lt;strong&gt;&lt;em&gt;Thank you!&lt;/em&gt;&lt;/strong&gt;&lt;/p&gt;

</description>
      <category>aws</category>
      <category>beginners</category>
      <category>webdev</category>
      <category>tutorial</category>
    </item>
    <item>
      <title>Provision a server on AWS: a step-by-step guide for the absolute beginner.</title>
      <dc:creator>Akil Mahmod Tipu</dc:creator>
      <pubDate>Sun, 02 Jul 2023 17:05:26 +0000</pubDate>
      <link>https://dev.to/akiltipu/provision-a-server-on-aws-a-step-by-step-guide-for-the-absolute-beginner-mlo</link>
      <guid>https://dev.to/akiltipu/provision-a-server-on-aws-a-step-by-step-guide-for-the-absolute-beginner-mlo</guid>
      <description>&lt;p&gt;Amazon Elastic Compute Cloud (EC2) is a service that provides virtual servers on the AWS cloud. Without further ado, we will provision an EC2 server following these step-by-step instructions.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Launch an EC2 instance from AWS Management Console.&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Log in to your AWS management console using your root or IAM account. Using IAM with administrator access is recommended for this tutorial. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;After logging in to the console from the top search bar search EC2 then click EC2 like the image below.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--EktqQvCi--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/25ovdwq9spoj3el80e69.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--EktqQvCi--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/25ovdwq9spoj3el80e69.png" alt="AWS Console" width="800" height="381"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Now you are in the ec2 console like the below image.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--TuYFcUIw--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/eru5hgpmf4uyzb0n4ii0.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--TuYFcUIw--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/eru5hgpmf4uyzb0n4ii0.png" alt="EC2 Dashboard" width="800" height="381"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;From the left sidebar select Security Group. &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;A Security Group in AWS is a virtual firewall that controls inbound and outbound traffic for instances. It acts as a filter for network traffic, allowing only specified connections while blocking others. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--_L6MOuOc--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/souq9vg36rodaisyeyxo.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--_L6MOuOc--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/souq9vg36rodaisyeyxo.png" alt="SG Home" width="800" height="381"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Now we are gonna create a custom security group for our server allowing SSH, HTTP, and HTTPS Ports: First, give a Security Group Name. In this case: MyNodejsSG&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--JmVdEBwZ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3a2n9p8ducxjz736zr1v.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--JmVdEBwZ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3a2n9p8ducxjz736zr1v.png" alt="SG Filled" width="800" height="310"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;To allow SSH access, create a new inbound rule and specify the Type SSH and Source Type Anywhere-IPv4. Similarly create HTTP and HTTPs rules. &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--drW6yX5t--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l8m0sx10owpywogkmkrp.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--drW6yX5t--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l8m0sx10owpywogkmkrp.png" alt="SG Inbound" width="800" height="319"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Now go to the Security Group dashboard and rename the Security Group name as below for better recognition. &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--khMcNoNL--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0han0ve48q3bvkjhjdi5.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--khMcNoNL--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0han0ve48q3bvkjhjdi5.png" alt="SG Rename" width="800" height="238"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Key Pair:&lt;/strong&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Key pairs in AWS are used for secure SSH (Secure Shell) access to EC2 instances. They consist of a public key that is stored on the instance and a private key that is kept securely by the user, allowing for secure authentication and data encryption.&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Create a key pair like this image and save this on your local machine for later use.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--bRkPiFz6--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lqo23zt8diw821shi9uw.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--bRkPiFz6--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lqo23zt8diw821shi9uw.png" alt="Key Pair" width="789" height="566"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt; &lt;strong&gt;Launch EC2 instance:&lt;/strong&gt; &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Instances in AWS are virtual servers that can be launched and terminated on demand. They provide scalable computing resources and can be configured with various operating systems and applications. Now we are going to create a Ubuntu 22.04 server. &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Click the Launch Instance button from your EC2 dashboard. Then give a name of your instance. I named it MyNodejsWebServer. &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--rmy_0v7J--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/95jl214ia0nhwshfogm7.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--rmy_0v7J--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/95jl214ia0nhwshfogm7.png" alt="Ec2 name" width="800" height="228"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;From Application and OS Images usually called AMI(Amazon Machine Image) select Ubuntu Server 22.04 which one is Free tier eligible. &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--jZStLLvr--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n2jo8xw1kjcmaew9soys.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jZStLLvr--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n2jo8xw1kjcmaew9soys.png" alt="AMI" width="789" height="566"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Instance type:&lt;/strong&gt; t2.micro (free tier eligible)&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Key pair (login):&lt;/strong&gt; Select my_node_js_server_key from the dropdown menu that we created earlier. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Configure storage:&lt;/strong&gt; keep it default 8 GiB gp3 root volume. &lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;And keep everything default for now then click the Launch Instance Button from the bottom. &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;In a minute your instance will be running.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;After successfully running your instances click on the instance id (&lt;em&gt;you can find your instance id from ec2 dashboard &amp;gt; instances&lt;/em&gt;)&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Log in to the server:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;By clicking the instance id you find details about your instance. From here copy your public IPv4 DNS id or Public IPv4 address for later use. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Below your instances summary click CONNECT button then go to the SSH Client tab. You will find instructions like this.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--mrBjszLk--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/grh3d7gu2aqrxuiz2w57.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--mrBjszLk--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/grh3d7gu2aqrxuiz2w57.png" alt="SSH client" width="797" height="373"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Following this instruction you will able to log in to your server from your local machine. &lt;/p&gt;

</description>
      <category>aws</category>
      <category>beginners</category>
      <category>cloudcomputing</category>
      <category>tutorial</category>
    </item>
    <item>
      <title>XPath Cheat Sheet for Web Scraping</title>
      <dc:creator>Akil Mahmod Tipu</dc:creator>
      <pubDate>Thu, 23 Jun 2022 09:18:21 +0000</pubDate>
      <link>https://dev.to/akiltipu/xpath-cheat-sheet-for-web-scraping-c6f</link>
      <guid>https://dev.to/akiltipu/xpath-cheat-sheet-for-web-scraping-c6f</guid>
      <description>&lt;h2&gt;
  
  
  About this Cheat Sheet
&lt;/h2&gt;

&lt;p&gt;👉  This Cheat Sheet covers all the examples I included in my Web&lt;br&gt;
Scraping course with Python using Requests, LXML and Splash.&lt;br&gt;
👉 This Cheat Sheet covers only the basics of how to use XPath to&lt;br&gt;
locate elements from the HTML markup.&lt;br&gt;
👉  All the XPath expressions I’m gonna cover on this Cheat Sheet will&lt;br&gt;
be applied on the HTML. &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;HTML web page&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;!DOCTYPE html&amp;gt;
&amp;lt;html lang="en"&amp;gt;
   &amp;lt;head&amp;gt;
      &amp;lt;title&amp;gt;XPath and CSS Selectors&amp;lt;/title&amp;gt;
   &amp;lt;/head&amp;gt;
   &amp;lt;body&amp;gt;
      &amp;lt;h1&amp;gt;XPath expressions simplified&amp;lt;/h1&amp;gt;
      &amp;lt;div class="intro"&amp;gt;
         &amp;lt;p&amp;gt;
            I'm paragraph within a div with a class set to
            intro
            &amp;lt;span id="location"&amp;gt;I'm a span with ID set to
            location and i'm within a paragraph&amp;lt;/span&amp;gt;
         &amp;lt;/p&amp;gt;
         &amp;lt;p id="outside"&amp;gt;I'm a paragraph with ID set to
            outside and i'm within a div with a class set to intro
         &amp;lt;/p&amp;gt;
      &amp;lt;/div&amp;gt;
      &amp;lt;p&amp;gt;Hi i'm placed immediately after a div with a class
         set to intro
      &amp;lt;/p&amp;gt;
      &amp;lt;span class='intro'&amp;gt;Div with a class attribute set to
      intro
      &amp;lt;/span&amp;gt;
      &amp;lt;ul id="items"&amp;gt;
         &amp;lt;li data-identifier="7"&amp;gt;Item 1&amp;lt;/li&amp;gt;
         &amp;lt;li&amp;gt;Item 2&amp;lt;/li&amp;gt;
         &amp;lt;li&amp;gt;Item 3&amp;lt;/li&amp;gt;
         &amp;lt;li&amp;gt;Item 4&amp;lt;/li&amp;gt;
      &amp;lt;/ul&amp;gt;
      &amp;lt;a href="https://www.google.com"&amp;gt;Google&amp;lt;/a&amp;gt;
      &amp;lt;a href="http://www.google.fr"&amp;gt;Google France&amp;lt;/a&amp;gt;
      &amp;lt;p class='bold italic'&amp;gt;Hi, I have two classes&amp;lt;/p&amp;gt;
      &amp;lt;p class='bold'&amp;gt;Hi i'm bold&amp;lt;/p&amp;gt;
   &amp;lt;/body&amp;gt;
&amp;lt;/html&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  BASICS
&lt;/h3&gt;

&lt;p&gt;An element is a &lt;strong&gt;tag&lt;/strong&gt; in the HTML markup.&lt;/p&gt;

&lt;h4&gt;
  
  
  Example:
&lt;/h4&gt;

&lt;p&gt;The &lt;strong&gt;‘p’&lt;/strong&gt; tag aka paragragh is called an element.&lt;br&gt;
To select any element from HTML web pages we simply use the&lt;br&gt;
following syntax&lt;/p&gt;

&lt;h4&gt;
  
  
  Example:
&lt;/h4&gt;

&lt;p&gt;To select all &lt;strong&gt;p&lt;/strong&gt; elements we can use the following XPath selector&lt;/p&gt;

&lt;p&gt;&lt;code&gt;//p&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;Although this approach works perfectly fine, it’s not recommended to use it, because if for example we want only to select the “p” elements that are inside the first div with a class attribute equals to “intro” this approach won’t be the best solution, this is why we always prefer to target elements either by their class attribute, id or&lt;br&gt;
by position so we can limit the scope of the XPath expression.&lt;/p&gt;

&lt;h3&gt;
  
  
  CLASS &amp;amp; ID
&lt;/h3&gt;

&lt;p&gt;So to select any element by its class attribute value we use the following syntax:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;//elementName[@attributeName=’value’]&lt;/code&gt;&lt;/p&gt;

&lt;h4&gt;
  
  
  Example:
&lt;/h4&gt;

&lt;p&gt;Let’s say we want to select the “p” elements that inside the “div” with a class attribute equals to “intro” in this case we use the following XPath expression:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;//div[@class=’intro’]/p&lt;br&gt;
&lt;/code&gt;&lt;br&gt;
If we want to select the “p” element with “id” equals to “outside” we can use the following XPath expression:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;//p[@id=’outside’]/p&lt;/code&gt;&lt;/p&gt;

&lt;h4&gt;
  
  
  &lt;em&gt;REMEBER:&lt;/em&gt;
&lt;/h4&gt;

&lt;p&gt;_Please note, the same exact class attribute value can be assigned to more than one element however, and id can be assigned to only and only one element. _&lt;/p&gt;

&lt;p&gt;Sometimes we want also to select elements based on a foreign attribute which doesn’t belong to HTML markup standard. For example to select the &lt;strong&gt;“li”&lt;/strong&gt; element with the attribute &lt;strong&gt;“data-identifier”&lt;/strong&gt; equals to 7 in this case we use the following XPath expression:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;//li[@data-identifier=”7”]&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;Sometimes the element we want to select does have two classes, for example, to select the &lt;strong&gt;“p”&lt;/strong&gt; element with a class attribute equals to &lt;strong&gt;“bold”&lt;/strong&gt; and &lt;strong&gt;“italic”&lt;/strong&gt; in this case we use the following XPath expression:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;//p[@class=’bold italic’]&lt;/code&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  OR:
&lt;/h3&gt;

&lt;p&gt;Although the element does have two classes we can for example search for a &lt;strong&gt;substring&lt;/strong&gt; within the class attribute value by using the &lt;strong&gt;contains&lt;/strong&gt; function.&lt;/p&gt;

&lt;p&gt;&lt;code&gt;//p[contains(@class, ‘italic’)]&lt;/code&gt;&lt;/p&gt;

&lt;h4&gt;
  
  
  &lt;em&gt;REMEBER:&lt;/em&gt;
&lt;/h4&gt;

&lt;p&gt;&lt;em&gt;The contains function takes two arguments:&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;&lt;em&gt;The first one is where to search, whether on the class&lt;br&gt;
attribute value, id or anything else.The second argument is the value you’re looking for. The value you search for is also case sensitive, so be careful!&lt;/em&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Value lookup
&lt;/h3&gt;

&lt;p&gt;Let’s say you want to select all the &lt;strong&gt;“a”&lt;/strong&gt; elements in which the &lt;strong&gt;“href”&lt;/strong&gt; attribute value starts with &lt;strong&gt;“https”&lt;/strong&gt; and not &lt;strong&gt;“http”&lt;/strong&gt;, in this case we can use the following XPath expression:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;//a[starts-with(@class, ‘https’)]&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;So search for the text at the beginning we use the caret sign &lt;strong&gt;“starts-with”&lt;/strong&gt; function which takes the same arguments as the contains function. &lt;/p&gt;

&lt;p&gt;Now if you want to search for a value at the end we use the &lt;strong&gt;“ends-with”&lt;/strong&gt; function, however, this function is not supported on XPath version 1.0 which is the version used by the majority of the browsers and LXML.&lt;/p&gt;

&lt;p&gt;Finally if we want to search for a particular value in between we use the contains function as explained before.&lt;/p&gt;

&lt;p&gt;If you want to get the text of a particular element you can use the text function, for example, to get the &lt;strong&gt;text element&lt;/strong&gt; of the &lt;strong&gt;“p”&lt;/strong&gt; element with &lt;strong&gt;id&lt;/strong&gt; equals to &lt;strong&gt;“outside”&lt;/strong&gt; we use the following XPath expression:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;//p[@id=”outside”]/text()&lt;/code&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  The position
&lt;/h3&gt;

&lt;p&gt;Okay, let’s say you want to get the second &lt;strong&gt;“li”&lt;/strong&gt; element from the &lt;strong&gt;“ul”&lt;/strong&gt; element with &lt;strong&gt;“id”&lt;/strong&gt; equals to &lt;strong&gt;“outside”&lt;/strong&gt;, in this case you can use the following XPath expression:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;//ul[@id=”items”]/li[2]&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;However, if you want to select the second list item but you also want to make that its text element is &lt;strong&gt;“Item 2”&lt;/strong&gt;, in this case you can use the following XPath expression:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;//ul[@id=”items”]/li[position() = 2 and text() = “Item 2”]&lt;br&gt;
&lt;/code&gt;&lt;br&gt;
Notice in this case I did use the &lt;strong&gt;position()&lt;/strong&gt; function, the &lt;strong&gt;text()&lt;/strong&gt; function plus the &lt;strong&gt;“and”&lt;/strong&gt; logical operator.&lt;/p&gt;

&lt;p&gt;In contrast to the &lt;strong&gt;“and”&lt;/strong&gt; logical operator we also have the &lt;strong&gt;“or”&lt;/strong&gt; logical operator.&lt;/p&gt;

&lt;h4&gt;
  
  
  &lt;em&gt;REMEBER:&lt;/em&gt;
&lt;/h4&gt;

&lt;p&gt;&lt;em&gt;In XPath everything we write within [] is known as a&lt;br&gt;
predicate.&lt;/em&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  XPath axes
&lt;/h3&gt;

&lt;p&gt;In XPath an axis is used to search for an element based on its relationship with another element, we have some axes which we can use to navigate &lt;strong&gt;up&lt;/strong&gt; and &lt;strong&gt;down&lt;/strong&gt; in the HTML markup.&lt;/p&gt;

&lt;p&gt;All axes in XPath use the follwing syntax:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;ElementName::axis&lt;/code&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  XPath axes (GOING UP)
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;The parent&lt;/strong&gt;&lt;br&gt;
The parent axis is used to get the parent of a specific&lt;br&gt;
element, for example the get the parent of the “p” element with id equals to “outside” we use the following&lt;br&gt;
XPath expression:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;//p[@id="outside"]/parent::node()&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;The node() function in XPath is used to get the “element” no matter what its type is.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The ancestor&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The ancestor axis can be used to all the ancestors of a&lt;br&gt;
specific element, for example to get the ancestors(parent, grand parent, ...) of the “p” element with id equals to “outside“ we use the following XPath expression:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;//p[@id="outside"]/ancestor::node()&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The preceding&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;In XPath the preceding axis will get all the elements that do precede an element excluding its ancestors.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Preceding sibling&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;In XPath the preceding-sibling axis will get the sibling that do precede an element, in other words it will return the brother that is on the top of a specific element.&lt;/p&gt;

&lt;h3&gt;
  
  
  XPath axes (GOING DOWN)
&lt;/h3&gt;

&lt;p&gt;To go down on the HTML markup we also have 4 axis which are:&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The child&lt;/strong&gt; axis which will get the children of a specific element&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The following&lt;/strong&gt; axis which will return all the elements that are after the closing tag of a specific element.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The following-sibling&lt;/strong&gt; axis which will return all the&lt;br&gt;
elements that are after the closing tag of an element but these elements should share the same parent.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The descendant&lt;/strong&gt; axis which will get the descendants of a particular element.&lt;/p&gt;

&lt;h4&gt;
  
  
  Promotional Alert!
&lt;/h4&gt;

&lt;p&gt;I do web scraping/data mining as a freelance service. If you need to do some scraping project don't hesitate to DM me. You can visit my &lt;a href="https://www.upwork.com/freelancers/~0165a7c6c904f0f0f5"&gt;Upwork profile&lt;/a&gt; or &lt;a href="https://www.fiverr.com/amtipu"&gt;Fiverr profile&lt;/a&gt;. Also you direct order from &lt;a href="https://www.upwork.com/services/product/web-scraping-data-mining-data-extraction-solutions-using-python-scrapy-1511235748029497344?ref=project_share"&gt;Upwork verified python web scraping project catalog&lt;/a&gt; or &lt;a href="https://www.fiverr.com/share/xewYeB"&gt;Fiverr Python Web Scraping Gig 1&lt;/a&gt; or &lt;a href="https://www.fiverr.com/share/DKRrVD"&gt;Gig 2&lt;/a&gt;. &lt;/p&gt;

&lt;p&gt;Thank you. 😍&lt;/p&gt;

</description>
      <category>webscraping</category>
      <category>productivity</category>
      <category>tutorial</category>
      <category>xpath</category>
    </item>
    <item>
      <title>Algorithm: Selection sort, how it works and implementation in python</title>
      <dc:creator>Akil Mahmod Tipu</dc:creator>
      <pubDate>Thu, 16 Jul 2020 15:36:02 +0000</pubDate>
      <link>https://dev.to/akiltipu/algorithm-selection-sort-how-it-works-and-implementation-in-python-2j9k</link>
      <guid>https://dev.to/akiltipu/algorithm-selection-sort-how-it-works-and-implementation-in-python-2j9k</guid>
      <description>&lt;p&gt;In this blog, I will talk about how selection sort works. I will implement examples in python3.&lt;/p&gt;

&lt;p&gt;Selection sort is an algorithm that selects the smallest element from an unsorted list in each iteration and placed that element at the beginning of the unsorted list.&lt;/p&gt;

&lt;h2&gt;
  
  
  How does Selection sort work?
&lt;/h2&gt;

&lt;p&gt;The word ‘select’ means carefully chosen from a group of things as being the best or most valuable. If I have a list of numbers and, I pick a random number without any thinking this should not be select. Rather, If I thoughtfully pick the best one or the appropriate one it should be selected.&lt;/p&gt;

&lt;p&gt;In the selection sort, every time we pick the appropriate elements from an array then put it on an appropriate position. Then applying this technique on the rest of the elements of the list, we will get our sorted array.&lt;/p&gt;

&lt;p&gt;Let, we have five numbers 10, 5, 2, 8, 7 and we need to sort those numbers in ascending order. To do that use the selection sort algorithm. (fig-1)&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--evpEVWNI--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/i/pcgcrw906725y7q4ermy.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--evpEVWNI--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/i/pcgcrw906725y7q4ermy.png" alt="Selection Sort-1" width="300" height="200"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Step-1:&lt;/strong&gt; First we need to find the smallest number from the list of numbers. In this case, the number is 2. Now bringing 2 in the first position of the list. Then exchange 2’s old position with 10 (10 was in the first position). After this step, our list looks like this. (fig-2)&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--W86-mlG1--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/i/kuhxo5rv3e1rop7thp9s.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--W86-mlG1--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/i/kuhxo5rv3e1rop7thp9s.png" alt="Selection Sort -2 " width="300" height="200"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Step-2:&lt;/strong&gt; Now we have the smallest number at the beginning of the list. So, now we find out the smallest number from the rest of the four numbers. That is 5. Here 5 is it’s the correct position. That’s why no need to swapping. (fig-3)&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--3iGSa3BA--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/i/7lmji98gsc23h3rgx0ud.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--3iGSa3BA--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/i/7lmji98gsc23h3rgx0ud.png" alt="Selection Sort - 3" width="300" height="200"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Step-3:&lt;/strong&gt; In this step, we find out the smallest number among 10, 8, 7. Here 7 is the smallest. Now bringing 7 in the first among these three numbers. And swapping position with 10. Now our list looks like- 2, 5, 7, 8, 10, and we know that the first three numbers in the correct position. (fig-4)&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--E72ddytz--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/i/4vo7pfgj32qtosm2i366.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--E72ddytz--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/i/4vo7pfgj32qtosm2i366.png" alt="Selection Sort - 4" width="300" height="200"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Step-4:&lt;/strong&gt; Now find the smallest between 8 and 10. Here 8 is the smallest one and it is in the correct position. So, there is no need to exchange positions. (fig-5)&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--aTAmrCJp--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/i/576dbn53lzhj43xnyi4r.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--aTAmrCJp--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/i/576dbn53lzhj43xnyi4r.png" alt="Selection Sort - 5" width="300" height="200"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Within 5 numbers 4 of those are sorted. So, the last one is naturally in the right position. Finally, our list is fully sorted. (fig-6)&lt;/p&gt;

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

&lt;h2&gt;
  
  
  Selection sort algorithm in detail:
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Input:&lt;/strong&gt; A list &lt;code&gt;L&lt;/code&gt; has &lt;code&gt;n&lt;/code&gt; number of elements.&lt;/p&gt;

&lt;p&gt;Step-1: Let &lt;code&gt;i = 0&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;Step-2: If &lt;code&gt;i&lt;/code&gt; is greater or equal to &lt;code&gt;(n-1)&lt;/code&gt;; go to step 11.&lt;/p&gt;

&lt;p&gt;Step-3: Let, the index of the smallest elements of the list is, &lt;code&gt;index_min = i&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;Step-4: Let, &lt;code&gt;j = i+1&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;Step-5: If &lt;code&gt;j&lt;/code&gt; is greater or equal to &lt;code&gt;n&lt;/code&gt; then go to step 9&lt;/p&gt;

&lt;p&gt;Step-6: If &lt;code&gt;L[j] &amp;lt; L[index_min]&lt;/code&gt; go to next step else go to step 8.&lt;/p&gt;

&lt;p&gt;Step-7: &lt;code&gt;index_min = j&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;Step-8: increment &lt;code&gt;j&lt;/code&gt; by &lt;code&gt;1&lt;/code&gt; then go to step 5.&lt;/p&gt;

&lt;p&gt;Step-9: If &lt;code&gt;i&lt;/code&gt; and index_min is not equal then swap the value of &lt;code&gt;L[i]&lt;/code&gt; and &lt;code&gt;L[index_min]&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;Step-10: Increment &lt;code&gt;i&lt;/code&gt; by &lt;code&gt;1&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;Step-11: List is now sorted by ascending order.&lt;/p&gt;

&lt;h2&gt;
  
  
  Implementation in Python 3
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;def selection_sort(L):
    n = len(L)

    for i in range(0, n-1):
        index_min = i

        for j in range(i+1, n):
            if L[j] &amp;lt; L[index_min]:
                index_min = j

        if index_min != i:
            L[i], L[index_min] = L[index_min], L[i]


if __name__ == "__main__":
    L = [10, 5, 2, 8, 7]
    print("Before sort:", L)
    selection_sort(L)
    print("After sort:", L)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This blog previously published on &lt;a href="https://medium.com/@akiltipu/algorithm-selection-sort-how-it-works-and-implementation-in-python-a576f7552793"&gt;medium.com&lt;/a&gt;&lt;/p&gt;

</description>
      <category>algorithms</category>
      <category>codenewbie</category>
      <category>python</category>
      <category>beginners</category>
    </item>
  </channel>
</rss>
