saomai3036
New member
[TIẾNG VIỆT]:
** Xây dựng UIS với Amazon Cognito và JavaScript **
Amazon Cognito là một dịch vụ quản lý truy cập và nhận dạng người dùng được quản lý đầy đủ giúp dễ dàng thêm đăng ký, đăng nhập và kiểm soát truy cập của người dùng vào các ứng dụng web và di động của bạn.Cognito có thể được sử dụng với nhiều nền tảng khách hàng, bao gồm các ứng dụng iOS, Android, JavaScript và Web.
Trong hướng dẫn này, bạn sẽ tìm hiểu cách xây dựng giao diện người dùng cho một ứng dụng web đơn giản bằng cách sử dụng Amazon Cognito và JavaScript.Bạn sẽ học cách:
* Tạo nhóm người dùng Cognito
* Tạo máy khách nhóm người dùng Cognito
* Thêm nút Đăng ký và Đăng ký vào ứng dụng của bạn
* Xử lý xác thực người dùng
** Điều kiện tiên quyết **
Để hoàn thành hướng dẫn này, bạn sẽ cần những điều sau đây:
* A [nhóm người dùng Cognito] (Amazon Cognito)
* A [Máy khách nhóm người dùng Cognito] (Amazon Cognito)
* A [Môi trường phát triển JavaScript] (JavaScript | MDN)
** Tạo nhóm người dùng Cognito **
Để tạo nhóm người dùng Cognito, bạn có thể sử dụng [Console Cognito] (https://console.aws.amazon.com/cognito/) hoặc [AWS CLI] (https://docs.aws.amazon.com/CLI/mới nhất/tham chiếu/cognito-idp/).Trong hướng dẫn này, chúng tôi sẽ sử dụng bảng điều khiển.
1. Chuyển đến [Bảng điều khiển Cognito] (https://console.aws.amazon.com/cognito/) và nhấp vào ** nhóm người dùng **.
2. Nhấp vào ** Tạo nhóm người dùng **.
3. Nhập tên cho nhóm người dùng của bạn và nhấp vào ** Tiếp theo **.
4. Chọn ** Đăng ký và Đăng nhập với tùy chọn tên người dùng ** và nhấp vào ** Tiếp theo **.
5. Nhập chính sách mật khẩu cho nhóm người dùng của bạn và nhấp vào ** Tiếp theo **.
6. (Tùy chọn) Định cấu hình các tính năng bổ sung cho nhóm người dùng của bạn và nhấp vào ** Tiếp theo **.
7. Nhấp vào ** Tạo nhóm người dùng **.
Nhóm người dùng Cognito của bạn hiện đã được tạo ra.
** Tạo máy khách nhóm người dùng Cognito **
Máy khách nhóm người dùng Cognito là một mã định danh duy nhất mà bạn có thể sử dụng để xác thực người dùng với nhóm người dùng của mình.Để tạo máy khách nhóm người dùng Cognito, bạn có thể sử dụng [Console Cognito] (https://console.aws.amazon.com/cognito/) hoặc [AWS CLI] (https://docs.aws.amazon.com/cli/mới nhất/tham chiếu/cognito-idp/).Trong hướng dẫn này, chúng tôi sẽ sử dụng bảng điều khiển.
1. Chuyển đến [Bảng điều khiển Cognito] (https://console.aws.amazon.com/cognito/) và nhấp vào ** nhóm người dùng **.
2. Chọn nhóm người dùng của bạn và nhấp vào ** Máy khách **.
3. Nhấp vào ** Thêm máy khách **.
4. Nhập tên cho máy khách của bạn và nhấp vào ** Tạo máy khách **.
Máy khách nhóm người dùng Cognito của bạn hiện đã được tạo.
** Thêm nút Đăng ký và Đăng nhập vào ứng dụng của bạn **
Để thêm các nút đăng ký và đăng nhập vào ứng dụng của bạn, bạn có thể sử dụng [SDK JavaScript SDK] (Amazon Cognito).
1. Cài đặt SDK JavaScript Cognito.
`` `
NPM Cài đặt @AWS-CDK/AWS-Cognito-JS
`` `
2. Nhập SDK JavaScript Cognito vào ứng dụng của bạn.
`` `
Nhập {CognitouserPool, CognitouserPoolClient} từ "@AWS-CDK/AWS-Cognito-JS";
`` `
3. Tạo một đối tượng CognitouserPool.
`` `
const userpool = newgnitouserpool ({
userpoolid: "người dùng của bạn-pool-id",
ClientID: "Người dùng của bạn-Pool-Client-ID",
});
[ENGLISH]:
**Build UIs with Amazon Cognito and JavaScript**
Amazon Cognito is a fully managed user identity and access management service that makes it easy to add user sign-up, sign-in, and access control to your web and mobile applications. Cognito can be used with a variety of client platforms, including iOS, Android, JavaScript, and web applications.
In this tutorial, you will learn how to build a user interface for a simple web application using Amazon Cognito and JavaScript. You will learn how to:
* Create a Cognito user pool
* Create a Cognito user pool client
* Add sign-up and sign-in buttons to your application
* Handle user authentication
**Prerequisites**
To complete this tutorial, you will need the following:
* A [Cognito user pool](https://docs.aws.amazon.com/cognito/latest/developerguide/user-pools.html)
* A [Cognito user pool client](https://docs.aws.amazon.com/cognito/latest/developerguide/user-pool-clients.html)
* A [JavaScript development environment](https://developer.mozilla.org/en-US/docs/Web/JavaScript)
**Create a Cognito user pool**
To create a Cognito user pool, you can use the [Cognito console](https://console.aws.amazon.com/cognito/) or the [AWS CLI](https://docs.aws.amazon.com/cli/latest/reference/cognito-idp/). In this tutorial, we will use the console.
1. Go to the [Cognito console](https://console.aws.amazon.com/cognito/) and click **User Pools**.
2. Click **Create User Pool**.
3. Enter a name for your user pool and click **Next**.
4. Select the **Sign-up and sign-in with username** option and click **Next**.
5. Enter a password policy for your user pool and click **Next**.
6. (Optional) Configure additional features for your user pool and click **Next**.
7. Click **Create User Pool**.
Your Cognito user pool has now been created.
**Create a Cognito user pool client**
A Cognito user pool client is a unique identifier that you can use to authenticate users with your user pool. To create a Cognito user pool client, you can use the [Cognito console](https://console.aws.amazon.com/cognito/) or the [AWS CLI](https://docs.aws.amazon.com/cli/latest/reference/cognito-idp/). In this tutorial, we will use the console.
1. Go to the [Cognito console](https://console.aws.amazon.com/cognito/) and click **User Pools**.
2. Select your user pool and click **Clients**.
3. Click **Add Client**.
4. Enter a name for your client and click **Create Client**.
Your Cognito user pool client has now been created.
**Add sign-up and sign-in buttons to your application**
To add sign-up and sign-in buttons to your application, you can use the [Cognito JavaScript SDK](https://docs.aws.amazon.com/cognito/latest/developerguide/cognito-javascript-sdk.html).
1. Install the Cognito JavaScript SDK.
```
npm install @aws-cdk/aws-cognito-js
```
2. Import the Cognito JavaScript SDK into your application.
```
import { CognitoUserPool, CognitoUserPoolClient } from "@aws-cdk/aws-cognito-js";
```
3. Create a CognitoUserPool object.
```
const userPool = new CognitoUserPool({
userPoolId: "your-user-pool-id",
clientId: "your-user-pool-client-id",
});
** Xây dựng UIS với Amazon Cognito và JavaScript **
Amazon Cognito là một dịch vụ quản lý truy cập và nhận dạng người dùng được quản lý đầy đủ giúp dễ dàng thêm đăng ký, đăng nhập và kiểm soát truy cập của người dùng vào các ứng dụng web và di động của bạn.Cognito có thể được sử dụng với nhiều nền tảng khách hàng, bao gồm các ứng dụng iOS, Android, JavaScript và Web.
Trong hướng dẫn này, bạn sẽ tìm hiểu cách xây dựng giao diện người dùng cho một ứng dụng web đơn giản bằng cách sử dụng Amazon Cognito và JavaScript.Bạn sẽ học cách:
* Tạo nhóm người dùng Cognito
* Tạo máy khách nhóm người dùng Cognito
* Thêm nút Đăng ký và Đăng ký vào ứng dụng của bạn
* Xử lý xác thực người dùng
** Điều kiện tiên quyết **
Để hoàn thành hướng dẫn này, bạn sẽ cần những điều sau đây:
* A [nhóm người dùng Cognito] (Amazon Cognito)
* A [Máy khách nhóm người dùng Cognito] (Amazon Cognito)
* A [Môi trường phát triển JavaScript] (JavaScript | MDN)
** Tạo nhóm người dùng Cognito **
Để tạo nhóm người dùng Cognito, bạn có thể sử dụng [Console Cognito] (https://console.aws.amazon.com/cognito/) hoặc [AWS CLI] (https://docs.aws.amazon.com/CLI/mới nhất/tham chiếu/cognito-idp/).Trong hướng dẫn này, chúng tôi sẽ sử dụng bảng điều khiển.
1. Chuyển đến [Bảng điều khiển Cognito] (https://console.aws.amazon.com/cognito/) và nhấp vào ** nhóm người dùng **.
2. Nhấp vào ** Tạo nhóm người dùng **.
3. Nhập tên cho nhóm người dùng của bạn và nhấp vào ** Tiếp theo **.
4. Chọn ** Đăng ký và Đăng nhập với tùy chọn tên người dùng ** và nhấp vào ** Tiếp theo **.
5. Nhập chính sách mật khẩu cho nhóm người dùng của bạn và nhấp vào ** Tiếp theo **.
6. (Tùy chọn) Định cấu hình các tính năng bổ sung cho nhóm người dùng của bạn và nhấp vào ** Tiếp theo **.
7. Nhấp vào ** Tạo nhóm người dùng **.
Nhóm người dùng Cognito của bạn hiện đã được tạo ra.
** Tạo máy khách nhóm người dùng Cognito **
Máy khách nhóm người dùng Cognito là một mã định danh duy nhất mà bạn có thể sử dụng để xác thực người dùng với nhóm người dùng của mình.Để tạo máy khách nhóm người dùng Cognito, bạn có thể sử dụng [Console Cognito] (https://console.aws.amazon.com/cognito/) hoặc [AWS CLI] (https://docs.aws.amazon.com/cli/mới nhất/tham chiếu/cognito-idp/).Trong hướng dẫn này, chúng tôi sẽ sử dụng bảng điều khiển.
1. Chuyển đến [Bảng điều khiển Cognito] (https://console.aws.amazon.com/cognito/) và nhấp vào ** nhóm người dùng **.
2. Chọn nhóm người dùng của bạn và nhấp vào ** Máy khách **.
3. Nhấp vào ** Thêm máy khách **.
4. Nhập tên cho máy khách của bạn và nhấp vào ** Tạo máy khách **.
Máy khách nhóm người dùng Cognito của bạn hiện đã được tạo.
** Thêm nút Đăng ký và Đăng nhập vào ứng dụng của bạn **
Để thêm các nút đăng ký và đăng nhập vào ứng dụng của bạn, bạn có thể sử dụng [SDK JavaScript SDK] (Amazon Cognito).
1. Cài đặt SDK JavaScript Cognito.
`` `
NPM Cài đặt @AWS-CDK/AWS-Cognito-JS
`` `
2. Nhập SDK JavaScript Cognito vào ứng dụng của bạn.
`` `
Nhập {CognitouserPool, CognitouserPoolClient} từ "@AWS-CDK/AWS-Cognito-JS";
`` `
3. Tạo một đối tượng CognitouserPool.
`` `
const userpool = newgnitouserpool ({
userpoolid: "người dùng của bạn-pool-id",
ClientID: "Người dùng của bạn-Pool-Client-ID",
});
[ENGLISH]:
**Build UIs with Amazon Cognito and JavaScript**
Amazon Cognito is a fully managed user identity and access management service that makes it easy to add user sign-up, sign-in, and access control to your web and mobile applications. Cognito can be used with a variety of client platforms, including iOS, Android, JavaScript, and web applications.
In this tutorial, you will learn how to build a user interface for a simple web application using Amazon Cognito and JavaScript. You will learn how to:
* Create a Cognito user pool
* Create a Cognito user pool client
* Add sign-up and sign-in buttons to your application
* Handle user authentication
**Prerequisites**
To complete this tutorial, you will need the following:
* A [Cognito user pool](https://docs.aws.amazon.com/cognito/latest/developerguide/user-pools.html)
* A [Cognito user pool client](https://docs.aws.amazon.com/cognito/latest/developerguide/user-pool-clients.html)
* A [JavaScript development environment](https://developer.mozilla.org/en-US/docs/Web/JavaScript)
**Create a Cognito user pool**
To create a Cognito user pool, you can use the [Cognito console](https://console.aws.amazon.com/cognito/) or the [AWS CLI](https://docs.aws.amazon.com/cli/latest/reference/cognito-idp/). In this tutorial, we will use the console.
1. Go to the [Cognito console](https://console.aws.amazon.com/cognito/) and click **User Pools**.
2. Click **Create User Pool**.
3. Enter a name for your user pool and click **Next**.
4. Select the **Sign-up and sign-in with username** option and click **Next**.
5. Enter a password policy for your user pool and click **Next**.
6. (Optional) Configure additional features for your user pool and click **Next**.
7. Click **Create User Pool**.
Your Cognito user pool has now been created.
**Create a Cognito user pool client**
A Cognito user pool client is a unique identifier that you can use to authenticate users with your user pool. To create a Cognito user pool client, you can use the [Cognito console](https://console.aws.amazon.com/cognito/) or the [AWS CLI](https://docs.aws.amazon.com/cli/latest/reference/cognito-idp/). In this tutorial, we will use the console.
1. Go to the [Cognito console](https://console.aws.amazon.com/cognito/) and click **User Pools**.
2. Select your user pool and click **Clients**.
3. Click **Add Client**.
4. Enter a name for your client and click **Create Client**.
Your Cognito user pool client has now been created.
**Add sign-up and sign-in buttons to your application**
To add sign-up and sign-in buttons to your application, you can use the [Cognito JavaScript SDK](https://docs.aws.amazon.com/cognito/latest/developerguide/cognito-javascript-sdk.html).
1. Install the Cognito JavaScript SDK.
```
npm install @aws-cdk/aws-cognito-js
```
2. Import the Cognito JavaScript SDK into your application.
```
import { CognitoUserPool, CognitoUserPoolClient } from "@aws-cdk/aws-cognito-js";
```
3. Create a CognitoUserPool object.
```
const userPool = new CognitoUserPool({
userPoolId: "your-user-pool-id",
clientId: "your-user-pool-client-id",
});
