localForage

KO | EN

gitlite — search

#javascript #python #hacktoberfest #react #ai #llm #go #golang #android #machine-learning #rust #deep-learning #java #awesome-list

(★ 25,800)

💾 오프라인 스토리지가 개선되었습니다. 간단하지만 강력한 API를 사용하여 IndexedDB, WebSQL 또는 localStorage를 래핑합니다.

localForage 최신버젼 다운로드

최종 버전 다운로드 (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# localForage
[![NPM version](https://badge.fury.io/js/localforage.svg)](http://badge.fury.io/js/localforage)
[![npm](https://img.shields.io/npm/dm/localforage.svg?maxAge=2592000)](https://npmcharts.com/compare/localforage?minimal=true)
[![jsDelivr Hits](https://data.jsdelivr.com/v1/package/npm/localforage/badge?style=rounded)](https://www.jsdelivr.com/package/npm/localforage)
[![minzipped size](https://badgen.net/bundlephobia/minzip/localforage)](https://bundlephobia.com/result?p=localforage@1.10.0)
localForage는 JavaScript를 위한 빠르고 단순한 스토리지 라이브러리입니다. localForage는 간단하고 `localStorage`와 유사한 API를 사용하여 비동기 스토리지(IndexedDB 또는 WebSQL)를 통해 웹 앱의 오프라인 경험을 향상시킵니다.
localForage는 IndexedDB나 WebSQL을 지원하지 않는 브라우저에서는 localStorage를 사용합니다. 자세한 호환성 정보는 [위키에서 확인하세요][supported browsers].
localForage를 사용하려면 페이지에 단일 JavaScript 파일을 추가하기만 하면 됩니다.
```html
```
[라이브 예제](http://codepen.io/thgreasi/pen/ojYKeE)를 체험해 보세요.
[GitHub에서 최신 localForage 다운로드](https://github.com/localForage/localForage/releases/latest) 또는 [npm](https://www.npmjs.com/)을 통해 설치하세요.
```bash
npm install localforage
```
[supported browsers]: https://github.com/localForage/localForage/wiki/Supported-Browsers-Platforms
## 지원
길을 잃으셨나요? 도움이 필요하신가요?
[localForage API 문서](https://localforage.github.io/localForage)를 확인해 보세요. [localForage API文档也有中文版。](https://localforage.docschina.org)
라이브러리 사용, 테스트 실행 또는 localForage 기여에 문제가 있는 경우, 새 이슈를 생성하기 전에 먼저 [기존 이슈들](https://github.com/localForage/localForage/issues)에서 유사한 문제가 있는지 확인해 주세요. 여전히 도움이 필요하다면 [자유롭게 이슈를 남겨주세요](https://github.com/localForage/localForage/issues/new).
# localForage 사용법
## 콜백 vs Promises
localForage는 비동기 스토리지를 사용하므로 비동기 API를 가지고 있습니다.
그 외에는 [localStorage API](https://hacks.mozilla.org/2009/06/localstorage/)와 정확히 동일합니다.
localForage는 Node 스타일 콜백 또는 [Promises](https://www.promisejs.org/) 중 하나를 사용할 수 있는 듀얼 API를 제공합니다. 어떤 것이 자신에게 적합한지 확실하지 않다면 Promises를 사용하는 것이 좋습니다.
다음은 Node 스타일 콜백 형식의 예시입니다.
```js
localforage.setItem('key', 'value', function (err) {
// err가 null이 아니면 에러가 발생한 것입니다.
localforage.getItem('key', function (err, value) {
// err가 null이 아니면 에러가 발생한 것입니다. 그렇지 않으면 value가 값입니다.
});
});
```
그리고 Promise 형식입니다.
```js
localforage.setItem('key', 'value').then(function () {
return localforage.getItem('key');
}).then(function (value) {
// 값을 가져왔습니다.
}).catch(function (err) {
// 에러가 발생했습니다.
});
```
또는 `async`/`await`를 사용하세요.
```js
try {
const value = await localforage.getItem('somekey');
// 이 코드는 오프라인 스토어에서 값이 로드된 후에 실행됩니다.
console.log(value);
} catch (err) {
// 에러가 발생한 경우 이 코드가 실행됩니다.
console.log(err);
}
```
더 많은 예시를 보려면 [API 문서](https://localforage.github.io/localForage)를 방문해 주세요.
## Blob, TypedArray 및 기타 JS 객체 저장하기
localForage에는 어떤 타입이든 저장할 수 있으며, localStorage처럼 문자열에만 국한되지 않습니다. localStorage가 스토리지 백엔드인 경우에도, localForage는 값을 가져오고 설정할 때 자동으로 `JSON.parse()`와 `JSON.stringify()`를 수행합니다.
localForage는 JSON으로 직렬화할 수 있는 모든 네이티브 JS 객체뿐만 아니라 ArrayBuffer, Blob, TypedArray의북도 지원합니다. localForage에서 지원하는 타입의 전체 목록은 [API 문서][api]를 확인하세요.
모든 스토리지 백엔드에서 모든 타입이 지원되지만, localStorage의 스토리지 제한으로 인해 많은 대용량 Blob을 저장하는 것은 불가능합니다.
[api]: https://localforage.github.io/localForage/#data-api-setitem
## 설정
`config()` 메서드를 사용하여 데이터베이스 정보를 설정할 수 있습니다.
사용 가능한 옵션은 `driver`, `name`, `storeName`, `version`, `size`, `description`입니다.
예시:
```javascript
loca

```javascript
lforage.config({
driver : localforage.WEBSQL, // WebSQL 강제 지정; setDriver()를 사용하는 것과 동일함
name : 'myApp',
version : 1.0,
size : 4980736, // 데이터베이스 크기 (바이트 단위). 현재는 WebSQL에서만 지원됨.
storeName : 'keyvaluepairs', // 영숫자와 언더스코어(_)로 구성되어야 합니다.
description : 'some description'
});
```
**참고:** 데이터를 다루기 *전에* 반드시 `config()`를 호출해야 합니다. 즉, `getItem()`, `setItem()`, `removeItem()`, `clear()`, `key()`, `keys()`, `length()`를 사용하기 전에 `config()`를 호출해야 합니다.

## 다중 인스턴스 (Multiple instances)
`createInstance`를 사용하여 서로 다른 스토어를 가리키는 localForage의 여러 인스턴스를 생성할 수 있습니다. [`config`](#configuration)에서 사용되는 모든 설정 옵션이 지원됩니다.

```javascript
var store = localforage.createInstance({
name: "nameHere"
});
var otherStore = localforage.createInstance({
name: "otherName"
});
// 이 중 하나의 키를 설정해도 다른 인스턴스에는 영향을 주지 않습니다.
store.setItem("key", "value");
otherStore.setItem("key", "value2");
```

## RequireJS
[RequireJS](http://requirejs.org/)에서 localForage를 사용할 수 있습니다:

```javascript
define(['localforage'], function(localforage) {
// 콜백 사용:
localforage.setItem('mykey', 'myvalue', console.log);
// Promise 사용:
localforage.setItem('mykey', 'myvalue').then(console.log);
});
```

## TypeScript
[tsconfig.json](https://www.typescriptlang.org/docs/handbook/tsconfig-json.html)에서 [`allowSyntheticDefaultImports` 컴파일러 옵션](https://www.typescriptlang.org/docs/handbook/compiler-options.html)을 `true`로 설정한 경우 (TypeScript v1.8+ 지원), 다음과 같이 사용해야 합니다:

```javascript
import localForage from "localforage";
```

그렇지 않은 경우 다음 중 하나를 사용해야 합니다:

```javascript
import \* as localForage from "localforage";
// 또는, 사용 중인 TypeScript 버전이 localForage와 같은 UMD 모듈에 대해 
// ES6 스타일 임포트를 지원하지 않는 경우
import localForage = require("localforage");
```

## 프레임워크 지원 (Framework Support)
나열된 프레임워크를 사용하는 경우, 프레임워크 내 모델을 위한 localForage 스토리지 드라이버가 존재하므로 localForage를 통해 오프라인으로 데이터를 저장할 수 있습니다. 당사는 다음 프레임워크용 드라이버를 제공합니다:

* [AngularJS](https://github.com/ocombe/angular-localForage)
* [Angular 4 이상](https://github.com/Alorel/ngforage/)
* [Backbone](https://github.com/localForage/localForage-backbone)
* [Ember](https://github.com/genkgo/ember-localforage-adapter)
* [Vue](https://github.com/dmlzj/vlf)
* [NuxtJS](https://github.com/nuxt-community/localforage-module)

목록에 추가하고 싶은 드라이버가 있다면, [이슈를 열어](https://github.com/localForage/localForage/issues/new) 목록에 추가해 주세요.

## 커스텀 드라이버 (Custom Drivers)
원하는 경우 자신만의 드라이버를 생성할 수 있습니다. [`defineDriver`](https://localforage.github.io/localForage/#driver-api-definedriver) API 문서를 참조하세요.
[위키에 커스텀 드라이버 목록][custom drivers]이 있습니다.

[custom drivers]: https://github.com/localForage/localForage/wiki/Custom-Drivers

# localForage 개발하기
[node/npm](http://nodejs.org/)과 [bower](http://bower.io/#installing-bower)가 필요합니다.

localForage 개발을 시작하려면 [포크(fork)](https://github.com/localForage/localForage/fork)하고 의존성을 설치해야 합니다. `USERNAME`을 본인의 GitHub 사용자 이름으로 바꾸고 다음 명령어를 실행하세요:

```bash
# bower가 없다면 전역으로 설치하세요:
npm install -g bower
# USERNAME을 본인의 GitHub 사용자 이름으로 바꾸세요:
git clone git@github.com:USERNAME/localForage.git
cd localForage
npm install
bower install
```

bower 의존성을 누락하면 테스트가 실패합니다!

## 테스트 실행 (Running Tests)
로컬 테스트를 실행하려면 PhantomJS가 설치되어 있어야 합니다. `npm test`를 실행하세요 (또는 직접 `grunt test` 실행). 코드는 [린터(linter)](http://jshint.com/) 검사도 통과해야 합니다.

localForage는 브라우저에서 실행되도록 설계되었으므로 테스트에는 브라우저 환경이 명시적으로 필요합니다. 로컬 테스트는 헤드리스 WebKit([PhantomJS](http://phantomjs.org) 사용)에서 실행됩니다.

풀 리퀘스트(pull request)를 제출하면, 테스트는 다음 브라우저들을 대상으로 실행됩니다

at
localForage는 [Sauce Labs](https://saucelabs.com/)를 사용하여 Travis CI를 지원합니다.
## 라이브러리 크기
버전 1.7.3 기준, 앱에 추가되는 페이로드는 꽤 작습니다. gzip 압축을 사용하여 제공되는 경우, localForage는 전체 번들 크기에 10k 미만을 추가합니다:

minified
:   `~29kB`

gzipped
:   `~8.8kB`

brotli'd
:   `~7.8kB`

# License
이 프로그램은 자유 소프트웨어이며,
[Apache License](https://github.com/localForage/localForage/blob/master/LICENSE)에 따라 배포됩니다.
---
Copyright (c) 2013-2016 [Mozilla](https://mozilla.org)
([Contributors](https://github.com/localForage/localForage/graphs/contributors)).

localForage

localForage 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

localForage

localForage 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README