# Initialization

Here is how to initialize the Wepin React Native SDK.

## Import SDK

```javascript
import Wepin from '@wepin/react-native-sdk
const wepin = Wepin.getInstance()
```

Add the <mark style="color:blue;">`<Wepin.WidgetView>`</mark> component to the main component and insert content inside it.

```javascript
function App(): JSX.Element {
    ....
  return (
    <Wepin.WidgetView>
        ...
    </Wepin.WidgetView>
  )
}
```

## `init`

```javascript
await wepin.init(appId, appSdkKey[, attributes])
```

Initialize the Wepin instance.

### Parameters

* **`appId`**: *String*\
  App ID assigned during registration
* **`appKey`**: *String*\
  App Key assigned during registration
* **`attributes`**: *IAttributes (optional)*\
  Properties of the Wepin Widget. It is defined in [`@wepin/types`](https://github.com/WepinWallet/wepin-js-sdk-types).
  * **`type`**: *String*\
    It determines how the app widget window will be displayed on initial loading. 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 <mark style="color:blue;">`loginProviders`</mark> parameter is supported from <mark style="color:blue;">`@wepin/types`</mark> version <mark style="color:blue;">`v0.0.11`</mark> or higher.

### Example

```javascript
await wepin.init('APPID', 'APPKEY', {
  type: 'hide',
  defaultLanguage: 'en',
  defaultCurrency: 'USD',
  loginProviders: ['google', 'apple'],
})
```

## `isInitialized` <a href="#user-content-isinitialized" id="user-content-isinitialized"></a>

```javascript
wepin.isInitialized()
```

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

### Returned value

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


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.wepin.io/en/deprecated/react-native-sdk/init.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
