{"id":26670444,"url":"https://github.com/flippercorporation/nachocode-client-sdk","last_synced_at":"2026-04-02T18:57:31.474Z","repository":{"id":284358609,"uuid":"954455426","full_name":"FlipperCorporation/nachocode-client-sdk","owner":"FlipperCorporation","description":"Nachocode Client SDK","archived":false,"fork":false,"pushed_at":"2025-03-25T13:08:14.000Z","size":177,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-03-25T14:23:26.928Z","etag":null,"topics":["android","app-development","ios","low-code","nachocode","react","sdk"],"latest_commit_sha":null,"homepage":"https://developer.nachocode.io","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/FlipperCorporation.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-03-25T05:35:36.000Z","updated_at":"2025-03-25T13:10:20.000Z","dependencies_parsed_at":"2025-03-25T14:33:31.536Z","dependency_job_id":null,"html_url":"https://github.com/FlipperCorporation/nachocode-client-sdk","commit_stats":null,"previous_names":["flippercorporation/nachocode-client-sdk"],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/FlipperCorporation%2Fnachocode-client-sdk","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/FlipperCorporation%2Fnachocode-client-sdk/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/FlipperCorporation%2Fnachocode-client-sdk/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/FlipperCorporation%2Fnachocode-client-sdk/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/FlipperCorporation","download_url":"https://codeload.github.com/FlipperCorporation/nachocode-client-sdk/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245551707,"owners_count":20634067,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["android","app-development","ios","low-code","nachocode","react","sdk"],"created_at":"2025-03-25T22:23:49.141Z","updated_at":"2026-04-02T18:57:31.462Z","avatar_url":"https://github.com/FlipperCorporation.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 📦 nachocode Client SDK\n\n![npm](https://img.shields.io/npm/v/nachocode-client-sdk)\n![npm bundle size](https://img.shields.io/bundlephobia/min/nachocode-client-sdk)\n![npm downloads](https://img.shields.io/npm/dm/nachocode-client-sdk)\n![License](https://img.shields.io/npm/l/nachocode-client-sdk)\n\n\u003c!-- markdownlint-disable MD033 --\u003e\n\u003cp align=\"center\"\u003e\n  \u003cimg src=\"https://cdn.nachocode.io/common/assets/images/logo.png\" width=\"130\" alt=\"nachocode Logo\" style=\"margin-top: 50px; margin-left: 150px\" /\u003e\n\u003c/p\u003e\n\u003cp align=\"center\"\u003e\n  \u003cimg src=\"https://cdn.nachocode.io/common/assets/images/character.png\" width=\"170\" alt=\"nachocode Character\" style=\"margin-bottom: 30px;\"/\u003e\n\u003c/p\u003e\n\u003c!-- markdownlint-enable MD033 --\u003e\n\n\u003e 🔔 **최신화 일자:** _2026-03-30_\n\n## 목차\n\n- [📦 nachocode Client SDK](#-nachocode-client-sdk)\n  - [목차](#목차)\n  - [개요](#개요)\n  - [설치](#설치)\n  - [사용법](#사용법)\n    - [1️⃣ `NachoProvider`, `useNachocodeContext` (React Context 방식)](#1️⃣-nachoprovider-usenachocodecontext-react-context-방식)\n    - [2️⃣ `useNachocode` (React Hook 방식)](#2️⃣-usenachocode-react-hook-방식)\n      - [`useNachocode()` 반환값](#usenachocode-반환값)\n    - [3️⃣ `loadNachocode` 직접 사용](#3️⃣-loadnachocode-직접-사용)\n  - [SDK 초기화 옵션 (`InitializeOptions`)](#sdk-초기화-옵션-initializeoptions)\n  - [SDK 버전 관리](#sdk-버전-관리)\n  - [SDK 기능 사용](#sdk-기능-사용)\n  - [네임스페이스 소개](#네임스페이스-소개)\n  - [네임스페이스 (외부연동) 소개](#네임스페이스-외부연동-소개)\n  - [기여자](#기여자)\n  - [기여하기](#기여하기)\n  - [라이선스](#라이선스)\n\n---\n\n## 개요\n\n**nachocode Client SDK**는 **웹 개발자들이 네이티브 앱의 고유 기능을 손쉽게 활용할 수 있도록 돕는 SDK**입니다.\n\n이 문서는 **SDK의 설치, 초기화, 주요 기능 및 사용 방법** 등을 안내합니다.\n\n- [공식 문서 바로가기](https://developer.nachocode.io/docs/sdk/intro)\n\n---\n\n## 설치\n\n```bash\nnpm install nachocode-client-sdk\n```\n\n또는\n\n```bash\nyarn add nachocode-client-sdk\n```\n\n---\n\n## 사용법\n\nnachocode Client SDK는 세 가지 방법으로 사용할 수 있습니다.\n\n### 1️⃣ `NachoProvider`, `useNachocodeContext` (React Context 방식)\n\n- 애플리케이션 전체에서 `Nachocode`를 사용할 수 있도록 `Provider` 패턴을 제공합니다.\n- `useNachocodeContext` 훅을 사용하여 `Nachocode` 객체에 접근할 수 있습니다.\n\n```jsx\nimport { NachoProvider, useNachocodeContext } from 'nachocode-client-sdk';\n\nfunction MyComponent() {\n  const { Nachocode, isLoading, isError, error } = useNachocodeContext();\n\n  if (isLoading) return \u003cp\u003eLoading...\u003c/p\u003e;\n  if (isError) return \u003cp\u003eError: {error.message}\u003c/p\u003e;\n\n  return \u003cp\u003enachocode SDK 사용 가능!\u003c/p\u003e;\n}\n\nexport default function App() {\n  return (\n    \u003cNachoProvider apiKey=\"your-api-key-here\"\u003e\n      \u003cMyComponent /\u003e\n    \u003c/NachoProvider\u003e\n  );\n}\n```\n\n### 2️⃣ `useNachocode` (React Hook 방식)\n\n- 특정 `Component`에서만 `Nachocode`를 사용하고 싶다면 `useNachocode` 훅을 사용하여 `Nachocode` 객체에 접근할 수 있습니다.\n\n```jsx\nimport { useNachocode } from 'nachocode-client-sdk';\n\nexport default function MyComponent2() {\n  const { Nachocode, isLoading, isError, error } = useNachocode('test-key');\n\n  if (isLoading) return \u003cp\u003eLoading...\u003c/p\u003e;\n  if (isError) return \u003cp\u003eError: {error.message}\u003c/p\u003e;\n\n  return \u003cp\u003enachocode SDK 사용 가능!\u003c/p\u003e;\n}\n```\n\n#### `useNachocode()` 반환값\n\n| 반환값      | 설명                                          |\n| ----------- | --------------------------------------------- |\n| `Nachocode` | nachocode SDK 객체                            |\n| `isLoading` | SDK 로딩 상태 (`true` 또는 `false`)           |\n| `isError`   | SDK 에러 여부 (`true` 또는 `false`)           |\n| `error`     | SDK 로드 중 발생한 에러 (`Error` 또는 `null`) |\n\n### 3️⃣ `loadNachocode` 직접 사용\n\n- React 외부에서도 `loadNachocode` 함수를 직접 호출하여 사용 가능합니다.\n\n```jsx\nimport { loadNachocode } from 'nachocode-client-sdk';\n\nasync function initSDK() {\n  try {\n    const Nachocode = await loadNachocode('your-api-key-here');\n    console.log('nachocode SDK 로드 완료:', Nachocode);\n  } catch (error) {\n    console.error('nachocode SDK 로드 실패:', error);\n  }\n}\n\ninitSDK();\n```\n\n---\n\n## SDK 초기화 옵션 (`InitializeOptions`)\n\nnachocode Client SDK는 초기화 시 선택적으로 옵션을 설정할 수 있습니다.\n\n초기화 옵션은 `NachoProvider`, `loadNachocode` 두 방식에서 모두 사용할 수 있습니다.\n\n1. `NachoProvider` 방식에서 `options` 사용\n\n   - `NachoProvider`에 `apiKey`와 함께 `options`를 전달할 수 있습니다:\n\n   ```jsx\n   \u003cNachoProvider\n     apiKey=\"your-api-key\"\n     options={{ sandbox: true, logger: true }}\n   \u003e\n     \u003cYourComponent /\u003e\n   \u003c/NachoProvider\u003e\n   ```\n\n2. `loadNachocode` 직접 호출 시 `options` 사용\n\n   - 비 React 환경 또는 수동으로 초기화하고 싶을 때 사용합니다:\n\n   ```jsx\n   loadNachocode('your-api-key', {\n     sandbox: true,\n     logger: true,\n   });\n   ```\n\n| 옵션 이름 | 타입    | 설명                                                                 |\n| --------- | ------- | -------------------------------------------------------------------- |\n| `sandbox` | boolean | ✅ 샌드박스 환경에서 테스트 시 `true`로 설정                         |\n| `logger`  | boolean | ✅ 콘솔 로그를 통해 SDK 내부 동작을 디버깅하고 싶을 때 `true`로 설정 |\n\n- `logger`는 기본적으로 true로 설정되어 있으며, 개발 중 디버깅에 유용합니다.\n- `sandbox`는 실제 운영 API가 아닌 테스트 서버를 사용하는 경우 유용합니다.\n\n---\n\n## SDK 버전 관리\n\n최신 버전 로드 (기본)\n\n- 최신 버전의 SDK를 항상 유지하려면 아래 코드를 사용하세요\n- 현재 최신 버전 v.1.10.2\n\n```jsx\nloadNachocode('your-api-key'); // 최신 버전이 자동으로 로드됨\n```\n\n특정 버전 지정\n\n- 특정 버전으로 고정하려면 다음과 같이 사용합니다\n\n```jsx\nloadNachocode('your-api-key', options, '1.10.2');\n```\n\n\u003e 📢 최신 버전 사용이 권장되며, 특정 버전 고정은 호환성이 중요한 경우에만 사용하세요.\n\n---\n\n## SDK 기능 사용\n\n- nachocode Client SDK가 초기화가 완료되면, `Nachocode` 네임스페이스 아래에 정의된 다양한 네이티브 기능을 사용할 수 있습니다.\n\n- 아래 예시는 SDK의 일부 기능을 사용하는 방법을 보여줍니다.\n\n  - **앱 정보 가져오기**\n\n  ```jsx\n  const appName = Nachocode.app.getAppName();\n  console.log(`앱 이름: ${appName}`); // ex. \"Nachocode Developer\"\n  ```\n\n  - **디바이스 정보 확인**\n\n  ```jsx\n  Nachocode.device.getDeviceModel(model =\u003e {\n    console.log(`디바이스 모델: ${model}`);\n  });\n  ```\n\n- 대부분의 기능은 웹 실행환경에선 무시되고, 앱 실행환경에서 정상 작동합니다.\n\n---\n\n## 네임스페이스 소개\n\nnachocode SDK는 각 기능별로 **네임스페이스(namespace)** 로 구분되어 있습니다.  \n아래는 주요 네임스페이스의 목록과 설명입니다. 각 네임스페이스에 대한 상세한 문서는 **문서 링크**에서 확인하세요.\n\n| **네임스페이스** | **설명**                                                                         | **문서 링크**                                                                             |\n| ---------------- | -------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------- |\n| `app`            | 앱 이름, 버전, 패키지 이름 등의 정보를 제공합니다.                               | [앱 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/app)                 |\n| `authentication` | 생체 인증(Fingerprint/Face ID) 등의 기능을 제공합니다.                           | [인증 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/authentication)    |\n| `backkey`        | Android 디바이스의 네이티브 백 키 이벤트를 제어할 수 있습니다.                   | [백 키 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/backkey)          |\n| `browser`        | 외부 또는 내부 브라우저로 URL을 열 수 있습니다.                                  | [브라우저 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/browser)       |\n| `clipboard`      | 텍스트를 클립보드에 복사하거나 읽을 수 있습니다.                                 | [클립보드 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/clipboard)     |\n| `device`         | 디바이스 모델, OS 버전, 배터리 및 네트워크 상태 등을 확인합니다.                 | [디바이스 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/device)        |\n| `env`            | SDK 초기화 상태, 실행 환경(웹/앱) 등을 확인할 수 있습니다.                       | [환경 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/env)               |\n| `event`          | 초기화, 포그라운드/백그라운드 전환, 네트워크 상태 변경 등의 이벤트를 처리합니다. | [이벤트 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/event)           |\n| `iap`            | Google Play 및 Apple App Store 인앱 결제 기능을 제공합니다.                      | [인앱 결제 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/iap)          |\n| `loading`        | 네이티브 로딩 인디케이터를 제어할 수 있습니다.                                   | [로딩 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/loading)           |\n| `location`       | 현재 디바이스 위치의 경도, 위도를 확인할 수 있습니다.                            | [위치 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/location)          |\n| `navigation`     | 앱의 네비게이션 스택을 제어하고 스와이프 제스처를 설정할 수 있습니다.            | [네비게이션 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/navigation)  |\n| `permission`     | 카메라, 위치, 푸시 알림 등 디바이스 권한을 요청하고 상태를 확인할 수 있습니다.   | [권한 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/permission)        |\n| `preference`     | 애플리케이션 내부 저장소를 통해 데이터를 저장 및 관리합니다.                     | [내부 저장소 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/preference) |\n| `push`           | 푸시 알림 토큰을 관리하고 nachocode 서버에 등록할 수 있습니다.                   | [푸시 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/push)              |\n| `scanner`        | QR 코드 스캔 및 기타 스캔 기능을 제공합니다.                                     | [스캐너 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/scanner)         |\n| `setting`        | Pull to Refresh와 같은 설정 기능을 제공합니다.                                   | [설정 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/setting)           |\n| `share`          | 네이티브 공유 UI를 통해 URL을 공유할 수 있습니다.                                | [공유 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/share)             |\n| `store`          | 앱스토어 및 플레이스토어 상호작용 기능을 제공합니다.                             | [공유 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/store)             |\n| `tabbar`         | 앱 내부 탭바의 표시 여부 및 이동을 제어할 수 있습니다.                           | [탭 바 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/tabbar)           |\n| `user`           | 사용자 고유 ID를 네이티브 레이어에서 관리할 수 있습니다.                         | [사용자 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/user)            |\n| `vibration`      | 디바이스 진동 및 햅틱 피드백을 제어합니다.                                       | [진동 네임스페이스](https://developer.nachocode.io/docs/sdk/namespaces/vibration)         |\n\n더 많은 네임스페이스와 사용법은 [공식 문서](https://developer.nachocode.io/docs/sdk/intro)를 확인하세요.\n\n---\n\n## 네임스페이스 (외부연동) 소개\n\nnachocode SDK는 연동된 외부 솔루션의 기능들도 **네임스페이스(namespace)** 로 구분되어 있습니다.  \n아래는 주요 네임스페이스의 목록과 설명입니다. 각 네임스페이스에 대한 상세한 문서는 **문서 링크**에서 확인하세요.\n\n| **네임스페이스** | **설명**                                                           | **문서 링크**                                                                                      |\n| ---------------- | ------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------- |\n| `apple`          | Apple 계정을 통한 소셜 로그인 기능 등을 제공합니다.                | [Apple 네임스페이스](https://developer.nachocode.io/docs/sdk/integrations/apple/reference)         |\n| `appsflyer`      | AppsFlyer 마케팅 애트리뷰션 및 사용자 트래킹 기능 등을 제공합니다. | [AppsFlyer 네임스페이스](https://developer.nachocode.io/docs/sdk/integrations/appsflyer/reference) |\n| `facebook`       | Facebook 소셜 로그인 기능을 제공합니다.                            | [Facebook 네임스페이스](https://developer.nachocode.io/docs/sdk/integrations/facebook/reference)   |\n| `google`         | Google 소셜 로그인 기능을 제공합니다.                              | [Google 네임스페이스](https://developer.nachocode.io/docs/sdk/integrations/google/reference)       |\n| `kakao`          | Kakao 소셜 로그인 기능을 제공합니다.                               | [Kakao 네임스페이스](https://developer.nachocode.io/docs/sdk/integrations/kakao/reference)         |\n| `naver`          | Naver 소셜 로그인 기능을 제공합니다.                               | [Naver 네임스페이스](https://developer.nachocode.io/docs/sdk/integrations/naver/reference)         |\n\n더 많은 네임스페이스와 사용법은 [공식 문서](https://developer.nachocode.io/docs/sdk/intro)를 확인하세요.\n\n---\n\n## 기여자\n\n\u003c!-- markdownlint-disable MD033 --\u003e\n\u003ctable\u003e\n  \u003ctr\u003e\n    \u003ctd align=\"center\"\u003e\n      \u003ca href=\"https://github.com/kyu6e2\" target=\"_blank\"\u003e\n        \u003cimg src=\"https://avatars.githubusercontent.com/kyu6e2\" width=\"100px;\" alt=\"Your GitHub Profile Picture\"/\u003e\u003cbr\u003e\n        \u003csub\u003e\n          \u003cb\u003eTaekyu Park\u003c/b\u003e\n        \u003c/sub\u003e\n      \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\n      \u003ca href=\"https://github.com/johnhjh\" target=\"_blank\"\u003e\n        \u003cimg src=\"https://avatars.githubusercontent.com/johnhjh\" width=\"100px;\" alt=\"GitHub Profile Picture\"/\u003e\u003cbr\u003e\n        \u003csub\u003e\n          \u003cb\u003eJohn An\u003c/b\u003e\n        \u003c/sub\u003e\n      \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\n      \u003ca href=\"https://github.com/lazy-sky\" target=\"_blank\"\u003e\n        \u003cimg src=\"https://avatars.githubusercontent.com/lazy-sky\" width=\"100px;\" alt=\"GitHub Profile Picture\"/\u003e\u003cbr\u003e\n        \u003csub\u003e\n          \u003cb\u003eRatel Kim\u003c/b\u003e\n        \u003c/sub\u003e\n      \u003c/a\u003e\n    \u003c/td\u003e\n  \u003c/tr\u003e\n\u003c/table\u003e\n\u003c!-- markdownlint-enable MD033 --\u003e\n\n---\n\n## 기여하기\n\nnachocode Client SDK를 사용해주셔서 감사합니다! 🚀\n\n궁금한 점이나 개선 사항이 있다면 [Issues](https://github.com/FlipperCorporation/nachocode-client-sdk/issues) 또는 [Pull Requests](https://github.com/FlipperCorporation/nachocode-client-sdk/pulls)를 통해 남겨주시거나,\n\n언제든지 [support@nachocode.io](mailto:support@nachocode.io)로 문의를 보내주세요. 🙌\n\n---\n\n## 라이선스\n\n이 프로젝트는 [MIT 라이선스](LICENSE) 하에 제공됩니다.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fflippercorporation%2Fnachocode-client-sdk","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fflippercorporation%2Fnachocode-client-sdk","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fflippercorporation%2Fnachocode-client-sdk/lists"}