# Initialization

Here is how to initialize the Wepin Widget JavaScript SDK.

First, create a <mark style="color:blue;">`Wepin`</mark> instance and initialize the instance using the App ID and App Key assigned after app registration.

## `init`

Initialize the <mark style="color:blue;">`Wepin`</mark> object through the <mark style="color:blue;">`init`</mark> method. Assign the App ID and App SDK Key allocated during the app registration process at initialization. Additionally, define the properties of the widget that are needed.

```javascript
const testAppId = 'app_id_eg12sf3491azgs520' // Test App ID
const testAppKey = 'ak_test_ghq1D5s1sfG234sbnhdsw24mnovk313' // Test App Key 
const attributes = {
  type: 'hide',
  defaultLanguage: 'ko',
  defaultCurrency : 'KRW',
  loginProviders: ['google', 'apple'],
}

const wepin = await Wepin.init( 
  testAppId,
  testAppKey,
  attributes
)
```

The parameters for <mark style="color:blue;">`init`</mark> are as follows.&#x20;

* **`appId`**: *String*\
  App ID assigned during registration
* **`appKey`**: *String*\
  App Key assigned during registration
* **`attributes`**: *Object (optional)*\
  Properties of the Wepin Widget
  * **`type`**: *String*\
    The type of display of widget as <mark style="color:blue;">`Wepin`</mark> is initiated. The default value is <mark style="color:blue;">`hide`</mark>. \
    `show`: Show the widget window immediately after loading for the first time.\
    `hide`: Hide the widget window initially when loading and show it later using <mark style="color:blue;">`openWindow()`</mark>.
  * **`defaultLanguage`**: *String*\
    The language to be displayed on the widget. The default value is <mark style="color:blue;">`ko`</mark>. The currently supported languages are <mark style="color:blue;">`en`</mark> and <mark style="color:blue;">`ko`</mark>.
  * **`defaultCurrency`:** *String*\
    The currency to be displayed on the widget. The default value is <mark style="color:blue;">`KRW`</mark>. The currently supported currencies are <mark style="color:blue;">`USD`</mark> and <mark style="color:blue;">`KRW`</mark>.
  * **`loginProviders`**: *\[String]*\
    Here is the list of login providers: <mark style="color:blue;">`google`</mark>, <mark style="color:blue;">`apple`</mark>, <mark style="color:blue;">`naver`</mark>, and <mark style="color:blue;">`discord`</mark>. Define and use only the necessary login providers. If you do not specify this value, all the four providers can be used by default.
    * The `loginProviders` parameter is supported from `@wepin/types` version <mark style="color:blue;">`v0.0.11`</mark> or higher.

## `isInitialized`

You can use <mark style="color:blue;">`isInitialized`</mark> to check if the Wepin object has been successfully initialized.

The returned value is as follows.

* *boolean*\
  init result; <mark style="color:orange;">`true`</mark> if Wepin SDK is already initialized, otherwise <mark style="color:orange;">`false`</mark>.

## Example

```javascript
const testAppId = 'app_id_eg12sf3491azgs520' // Test App ID
const testAppKey = 'ak_test_ghq1D5s1sfG234sbnhdsw24mnovk313' // Test App Key 
const attributes = {
  type: 'hide',
  defaultLanguage: 'ko',
  defaultCurrency : 'KRW',
}

const wepin = await Wepin.init( 
  testAppId,
  testAppKey,
  attributes
)
if(wepin.isInitialized()) {
  console.log('wepin is initialized!')
}
```