TypeScript SDK
시작하기
Orion TypeScript SDK 사용을 위한 첫걸음을 시작하세요.
설치
Orion은 의존성을 추가하는 것만으로 새 프로젝트나 기존 프로젝트에 설치할 수 있습니다.
NPM 사용
npm install @tailflow/laravel-orion --save
Yarn 사용
yarn add @tailflow/laravel-orion
설정
패키지를 설치한 다음 단계는 API와 함께 동작하도록 설정(또는 초기화)하는 것입니다.
import {Orion} from "@tailflow/laravel-orion/lib/orion";
Orion.init('https://your-api.test');
Orion.setToken('access-token-here');
이것으로 끝입니다! 이제 모델 설정으로 넘어가겠습니다.
모델 설정
첫 번째 모델을 만들고 API를 조회해 보겠습니다. Laravel API에 있는 아무 모델이나 선택하면 됩니다. 여기서는 예시로 Post 모델을 사용합니다.
TypeScript 앱에 Post 클래스를 추가하고 Model을 상속하세요.
// post.ts
import {Model} from "@tailflow/laravel-orion/lib/model";
export class Post extends Model {
}
다음으로 모델의 속성과 리소스 이름을 정의하세요.
// post.ts
import {Model} from "@tailflow/laravel-orion/lib/model";
export class Post extends Model<{
title: string,
body: string
}> {
public $resource(): string {
return 'posts';
}
}
축하합니다. 모델 설정이 완료되었고, 이제 API를 조회할 준비가 모두 끝났습니다 🎉
API 조회하기
Orion TypeScript SDK를 사용하면 API를 매우 쉽게 사용할 수 있습니다.
Sanctum을 사용하는 경우 API를 조회하기 전에 CSRF 보호를 초기화해야 합니다. 방법은 SPA를 위한 Sanctum 연동에서 확인하세요.
// 앱의 어딘가에서
import {Post} from '../post.ts';
// 게시글 목록 조회
const posts = await Post.$query().get();
// 게시글 검색
const posts = await Post.$query().lookFor('some value').search();
// 게시글 생성
const newPost = await Post.$query().store({
title: 'New post' // <-- 속성에 타입이 지정되어 있어 여기서 자동 완성이 잘 동작합니다
});
console.log(newPost.$attributes.title); // <-- 여기서도 마찬가지입니다
// 게시글 조회
const post = await Post.$query().find(5);
// 게시글 수정
post.$attributes.title = 'Updated post';
await post.$save();
// 또는
await post.$save({title: 'Updated post'}); // <-- 여기서도
// 또는
const updatedPost = await Post.$query().update(5, {
title: 'Updated title' // <-- 물론 여기서도
});
// 게시글 삭제
const deletedPost = await Post.$query().delete(5);
// 또는
await post.$destroy();