# Streamlining User Management in Your Applications with Amazon Cognito

Amazon Cognito is a fully managed identity service that makes it easy to add user sign-up, sign-in, and access control to your web and mobile apps. It provides a secure and scalable way to authenticate users and supports social and enterprise identity providers.

**Benefits of Amazon Cognito:**

* **It's easy to use**: Amazon Cognito provides a simple API that makes it easy to add user authentication and access control to your apps.
    
* **It's secure**: Amazon Cognito uses industry-standard security practices to protect your users' data.
    
* **It's scalable:** Amazon Cognito can handle millions of users and is designed to scale with your app. Support for multiple identity providers
    
* **User pools:** Amazon Cognito user pools are a great way to manage user accounts for your app. User pools provide a central place to store user data, such as passwords, email addresses, and phone numbers.
    
* Federated identities: Amazon Cognito federated identities allow your app to access AWS resources without the user having to sign in to your app.
    
    # **Let’s dive into the Demonstration :**
    

Step 1: Go to the AWS Management Console Search for Cognito And Click on it.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685895612882/f309aca9-8e0e-4963-acfc-e459d3e0b07f.png align="center")

Step 2: Click on Create user pool.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685895634166/146b8ecd-3e76-46a2-b610-fafac7234a24.png align="center")

Step 3: Under the Authentication Providers:

* Choose **Cognito User pool**
    
* Select **Email** from Cognito user pool sign-in options.
    
* Click on **Next**.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685895698390/d42b33ce-fc87-400e-8e4f-005df2c85d96.png align="center")
    

Step 4: From the Password policy, select the **Cognito defaults.** You can also create your custom password policy.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685895736129/52fc57fd-7e91-407d-9597-71d16afa154d.png align="center")

Step 5: Make sure that you Enable self-service account recovery.

* From the Delivery method for user account recovery messages, **choose Email**
    
* Click on **Next**.
    

Step 6: From the Multi-factor authentication

* choose **No MFA**
    
* select on **Enable self-service account recovery**
    
* Select **email only** from Delivery method for user account recovery messages.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685895886036/0152a6fb-2a38-4830-a927-f2d4a99839c7.png align="center")
    

Step 7: Click on **Next**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685895925985/5fd8d607-fa77-496d-b107-6c70c3c07fde.png align="center")

Step 8: Under Configure Sign-up experience, **Enable self-registration**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685895964444/d35300da-a970-4baf-ad06-5df62683b26b.png align="center")

Step 9: From the Configure message delivery

* Select **send email with cognito**
    
* Click on **Next**
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685896023645/c7a09661-0dc4-4ede-aa88-e831c19e126c.png align="center")
    

Step 10: Under Integrate your app

* Give a name to the user pool, For now we say it **“demo-app-user-pool”**
    
* Select the Use the **Cognito hosted UI**
    
* From Domain, Select the Use a cognito domain and enter the domain prefix, let's say [**https://mywebsite**](https://mywebsite)
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685896138171/0de8857f-9a24-461b-b95d-d37c25a45586.png align="center")
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685896166302/9382bf16-e96f-4580-9a6a-664636081997.png align="center")

Step 11: Under the Initial app client,

* choose **Public client** from App type
    
* Give it a app client name let’s say “**DemoApp**”
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685896271880/78b283b3-5e1e-46e1-baa4-ea618a9ff2c9.png align="center")
    

Step 12: In the Client Secret we must provide the Callback URls so, For now

[https://localhost:800/logged\_in.html](https://localhost:800/logged_in.html)

**Note:** We will create a file name **logged\_in.html** that’s why we are using it at [localhost](http://localhost). When we enter our credentials we will be on this logged\_in.html page.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685896320391/8f48857c-0eb4-4967-80c4-6341da911bae.png align="center")

Step 13: Click on Next

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685896339237/d363736f-bccb-4ffd-9d01-781927d8e36e.png align="center")

Step 14: From the **Review and Create** go to the end and Click on **Create user pool.**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685896404386/c8c39f8b-cdf6-4207-adcf-aa83e5b87ea2.png align="center")

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685896424887/f4cbdda6-ee38-4f7c-bf49-fd84fbb05bca.png align="center")

Step15: You will see the User pool named “**Demo-app-user-pool**” Click on it.

* Select the App integration
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685896534492/74e4a9a0-c7a9-4e69-805d-304a5e150775.png align="center")
    

Step 16: Scroll down at the end you will see App Client list, and there you’ll find App client name “**DemoApp**”

* Click on it.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685896573678/77a6bfa0-f369-41cb-b1cd-20ff2060bb55.png align="center")
    

Step 17: Under the “**DemoApp**” you will see the “**Hosted** **UI**” and on the right side you’ll find “**View Hosted UI**”, **Click on it.**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685896652457/8255de76-783f-4b13-8190-107b12bb4366.png align="center")

You will redirect to the web browser. Now **copy the Link** of this login form page.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685896734295/8768016f-9b99-4b20-8d00-5b48513ca558.png align="center")

Step 18: Open the VS code and make a folder and inside it create two files named **index.html** and **logged\_in.htm**l Paste the following code in the index.html file

```xml
<body>
   <h3>Welcome to my Website</h3>
   <a href="#">Register|Login </a>
</body>
</html
```

* On the **href =”&lt; paste the link copied from the login page form&gt;”**
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685896916119/762c71b9-d45c-4a90-8d0d-a3472c63cd50.png align="center")
    
* In the logged\_in.html Paste the following code
    
    ```xml
    <html>
    <body>
       <h1>Congratulations!!</h1>  
       <p>You are logged in...</p>
    </body>
    </html>
    ```
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685897000520/0fb7aa61-e5b8-4c2a-9248-b21e37881fe2.png align="center")

Step 19: Now open the terminal and type the following command.

* **python3 -m http.server**
    
* Now, click on the (**http://)**
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685897050464/2add32ee-e2ab-4498-bc28-52d1f91f9004.jpeg align="center")
    
* You will be redirected to this page.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685897089456/99491eaf-4427-4193-8191-51e397cb05ef.png align="center")
    
* Click on the Register|Login and you will be redirected to the login and sign up page.
    
* Since you are trying to access it for the first time you must Click on **Sign** **up** and you will receive a **confirmation** **code** in your mail and **verify** **it**.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685897156436/dfa7f3bf-9ef4-41d3-bfc6-61e3cf422520.png align="center")
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685897175240/42eae745-30e7-4ee3-b2b1-1dc35b6e1b30.png align="center")

Step 19:After you verify you can navigate back to the **“Demo-app-user-pool”** and under “**Users**” you can see the user with status **confirmed**.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685897207515/e1c114d0-c93c-47f0-aeab-b606f01440a3.png align="center")

Step 20: when you enter your credentials you will redirect to the Logged\_in.html page.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685897227844/be79937a-5524-4006-a2c1-f70d07547734.jpeg align="center")

Finally, You have successfully completed this demonstration. Now, you will be able to connect your website with Aws Cognito to add user sign-up, sign-in, and access control to your web and allow only authenticated users.
