> For the complete documentation index, see [llms.txt](https://xact.gitbook.io/xact/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://xact.gitbook.io/xact/sdk/javascript/login.md).

# Login

The following sample will show you how to make a simple connection handler. First,  we will generate a QR Code that will be the entry point by which users can interact with your dApp. Once this QR Code is scanned and operation authorized, the account details are forwarded to you.

## Prerequisites: <a href="#pre-requisites" id="pre-requisites"></a>

{% content-ref url="/pages/-Mg56\_a4eJ5VygETYHMC" %}
[Getting started](/xact/sdk/javascript/getting-started.md)
{% endcontent-ref %}

## Step 1: Import the following modules

Continue building on the index.js from the previous example ([Environment Set-up](https://app.gitbook.com/@xact/s/xact/sdk/javascript/getting-started#step-1-set-up-your-node-js-environment)) and add the following modules:

```typescript
const { Client, UserAccount } = require("@xact-wallet-sdk/client");
require("dotenv").config();
```

## Step 2: Generate a QR Code

The process of generating a QR Code is straight forward. Within the async function, simply call *generateQRCode* and wait for the image.

{% hint style="info" %}
You can optionally set the scope in the params to fetch the NFT during the login process. it's set by default to`ScopeEnum.PROFILE`
{% endhint %}

```typescript
const qrCode = await client.generateQRCode({
    scope: [ScopeEnum.PROFILE, ScopeEnum.NFT]
});
```

## Step 3: Listen to new Connections

Finally get noticed when a new user accept the connexion to your dApp.

```typescript
/* Subscribe to new Connections */
client.connect().subscribe(user => {
    console.log('new connexion', user);
});
```

⭐ Congratulations! You have successfully completed the process of authentication to our wallet

## Code Check ✅

Your *index.js* file should look like this:

{% code title="index.js" %}

```typescript
const { Client } = require("@xact-wallet-sdk/client");
require("dotenv").config();

async function main() {

    //get your api key from your .env file
    const apiKey = process.env.API_KEY;


    // If we weren't able to find it, we should throw a new error
    if (apiKey == null) {
        throw new Error("Environment variables API_KEY must be present");
    }
    /* Create a new instance of Client */
    const client = new Client({apiKey});
    
    /* Init the connection */
    await client.initConnexion();
    
    /* Generate a QR Code */
    const qrCode = await client.generateQRCode();
    
    /* Subscribe to new Connections */
    client.connect().subscribe(user => {
        console.log('new connexion', user);
    });
}
main();
```

{% endcode %}