# Installation

## To install using Package Manager

Wepin Widget Javascript SDK can be installed an an npm package.&#x20;

{% hint style="info" %}
This package can only be used in web environment. It cannot be used in Android or iOS hybrid apps (Webview).
{% endhint %}

Enter the following <mark style="color:blue;">`npm install`</mark> command in the terminal.

```shell
npm install @wepin/widget-sdk
```

Once the installation is complete, you can confirm that it has been added to the "dependencies" section in the package.json file.

```json
{
  "name": "wepin-widget-test-app",
  "version": "1.0.0",
  "description": "Wepin Widge Test App"
  "main": "app.js",
  "author": "honggildong@test.wepin.io",
  "dependencies": {
    "@wepin/widget-sdk": "^1.0.0"
  }
}
```

Once the installation is complete, you can prepare to use Wepin by inserting your App ID and App Key and calling the init function as shown below.

<pre class="language-javascript"><code class="lang-javascript"><strong>// 1. import SDK
</strong><strong>import '@wepin/widget-sdk'
</strong><strong>const testAppKey = 'ak_test_ghq1D5s1sfG234sbnhdsw24mnovk313' // Test App Key
</strong>const testAppId = 'app_id_eg12sf3491azgs520' // Test App ID
// 2. Initialize
const Wepin = window.Wepin
const wepin = await Wepin.init( 
  testAppId,
  testAppKey  
)
</code></pre>

## To install using `<script>` Tag&#x20;

Add the JavaScript file to the HTML page where you want to integrate the Wepin widget.

Once the script is loaded, a <mark style="color:blue;">`Wepin`</mark> object is created in the global object (window), and you can use this object to proceed with initialization.

```html
<head>
  <title>Connect WEPIN<title>
  <!-- 1. Add Script -->
  <script src="https://cdn.jsdelivr.net/npm/@wepin/widget-sdk@1.0.0/dist/wepin-widget-sdk.min.js" defer async></script>
</head>
<script>
  const testAppKey = 'ak_test_ghq1D5s1sfG234sbnhdsw24mnovk313' // Test App Key 
  const testAppId = 'app_id_eg12sf3491azgs520' // Test App ID
  // 2. Initialize
  const wepin = await Wepin.init( 
    testAppId,
    testAppKey
  )
</script>
```
