# Web: JavaScript SDK

JavaScript SDK 브라우저 환경에서 사용할 수 있는 SDK(Software Development Kit)입니다. 이 문서는 위핀 위젯을 Javascript SDK를 이용하여 WEB에 통합하기 위한 절차를 설명합니다.

#### 패키지 리스트 <a href="#package-list" id="package-list"></a>

* [sdk](https://docs.wepin.io/widget-integration/web-javascript-sdk/widget): @wepin/sdk-js
  * 위핀 위젯을 사용하기 위한 기능을 제공합니다.
* [login](https://docs.wepin.io/widget-integration/web-javascript-sdk/login-library): @wepin/login-js
  * 소셜 로그인과 같은 OAuth 인증 토큰으로 위핀에 로그인하는 기능을 제공합니다.
* [provider](https://docs.wepin.io/widget-integration/web-javascript-sdk/provider): @wepin/provider-js, @wepin/wagmi-connector
  * 이더리움 및 EVM, 솔라나 등 위핀에서 지원하는 블록체인과 상호작용하기 위한 프로바이더를 제공합니다.

{% hint style="danger" %}
&#x20;Wepin 패키지는 모두 **클라이언트 사이드 렌더링(CSR: Client Side Rendering)** 환경에서만 동작합니다. 서버 사이드 렌더링(SSR: Server Side Rendering) 환경에서 이 패키지를 사용할 경우, CSR에서만 패키지를 불러올 수 있도록 설정이 필요합니다.

아래 코드를 참고하여 설정하세요:

```javascript
const initWepin = async () => {
    const { WepinSDK } = await import('@wepin/sdk-js');
    const wepinSDK = new WepinSDK({
        appKey: '',
        appId: '',
    });
    await wepinSDK.init();
}
```

{% endhint %}