We will use CodePen to execute the JavaScript SDK code for Cognito operations, following these steps:

1. Open CodePen and add locations to the required files.
2. Go to  https://codepen.io/.
3. Click the Create tab and then select the Pen option.
4. In the new window, click the Settings menu, select the Behaviour tab, and uncheck the Enabled option under Auto-Updating Preview.
5. In the Settings menu, select the JavaScript tab and do the following:
   1. Search for aws sdk and select the appropriate SDK:

CodePen will populate the SDK URL (as we will see in the next screenshot).

6. Add the URL of our amazon-cognito-identity.min.js file (for example, https://s3.amazonaws.com/cognito-min-bucket/amazon-cognito-identity.min.js):

7. Click Close. We can now run JavaScript code from within the Cognito JS tab, as we did in the previous recipe:

8. We can sign up/register the user with the following code:

var poolData = {
    UserPoolId: '<user pool id>',
    ClientId: '<client id>'
};
var userPool = new AmazonCognitoIdentity.CognitoUserPool(poolData);
var attributeList: CognitoUserAttribute[] = [];
var emailAttribute = {

Name : 'email',
Value : '<user email>'
};

attributeList.push(new AmazonCognitoIdentity.CognitoUserAttribute(emailAttribute));

userPool.signUp('heartin', 'Passw0rd$1', attributeList, null, function(err, result){
    if (err) {
        console.log(JSON.stringify(err));
        alert(err.message || JSON.stringify(err));
        return;
    }
    var cognitoUser = result.user;
    console.log('user name is ' + cognitoUser.getUsername());
});

9. Update the code with correct userpool ID, client ID, username, and password, and click Run.
   We can view the log messages in the developer console as follows:

10. Confirm the registered user by using the code received in the email provided during registration:

var poolData = {
   UserPoolId: '<user pool id>',
   ClientId: '<client id>'
};
var userPool = new AmazonCognitoIdentity.CognitoUserPool(poolData);
var userData = {
        Username : 'heartin',
        Pool : userPool
    };

var cognitoUser = new AmazonCognitoIdentity.CognitoUser(userData);
    cognitoUser.confirmRegistration('698099', true, function(err, result) {
        if (err) {
            alert(err.message || JSON.stringify(err));
            return;
        }
        console.log('call result: ' + result);
    });

Replace 698099 with the code you received. Run the script from CodePen and we should receive a response similar to this in the developer logs:

11. Sign in to the application using the registered email ID and password:

var authenticationData = {
        Username : 'heartin',
        Password : 'Passw0rd$1',
    };
    
    var authenticationDetails = new AmazonCognitoIdentity.AuthenticationDetails(authenticationData);
    var poolData = {
        UserPoolId: '<user pool id>',
        ClientId: '<client id>' 
    };
    
    var userPool = new AmazonCognitoIdentity.CognitoUserPool(poolData);
    var userData = {
        Username : 'heartin',
        Pool : userPool
    };
    
    var cognitoUser = new AmazonCognitoIdentity.CognitoUser(userData);
    cognitoUser.authenticateUser(authenticationDetails, {
        onSuccess: function (result) {
            var accessToken = result.getAccessToken().getJwtToken();
            console.log('access token is:' + accessToken);
        }, 
        onFailure: function(err) {
          console.log(JSON.stringify(err));
            alert(err.message || JSON.stringify(err));
        },
 
    });

If successful, we should receive the access token in the response and we can verify it from the browser developer console:

We can now use this access token for further operations.