A simple way to consume APIs with Javascript.
Premiere helps you reducing the amount of boilerplate necessary to consume APIs. Here's an example of how it looks like:
const todoList = new TodoList();
todoList.title = 'Daily routine';
todoList.save();
// Get user by todo list
const user = await todoList.user;
// Get items from todo list
const items = await todoList.items;
// List all todo lists by user
const lists = TodoList.byUser(1);- Friendly syntax, inspired by Eloquent (Laravel) and ActiveRecord (Rails)
- Normalization
- Normalize data coming from the API
- Denormalize data before sending to the API
- Smart Caching to speed up your app
- Automatic request and result caching
- Automatic cache removal (for lists) upon saving a record
- Support to Foreign keys
- Support to HTTP Header settings
- JWT token helper
- CSRF token helper
Workflow
** For more about how promises work, check out Dave Atchley's article
Installation
Using npm:
npm install premiere --saveGetting Started
Setting API url
import { api };
api.base = 'http://api.com'Creating a new model
import { api, Model } from 'premiere';
import User from './User';
import TodoItem from './TodoItem';
// Set your api base
api.base = 'http://my-api.com';
// Define your model
export default class TodoList extends Model {
path = 'todo-item';
user_id: number;
title: string;
created_at: Date;
get user(): Promise<User> {
return this.belongsTo(User);
}
static byUser(key: number) {
return this.belongsTo(User, key);
}
get items(): Promise<TodoItem> {
return this.hasMany(TodoItem);
}
normalizeCreatedAt(value: string): Date {
return new Date(value);
}
denormalizeCreatedAt(value: Date): string {
return value.toISOString();
}
}
// Create new todo list
const todoList = new TodoList();
todoList.user_id = 1;
todoList.title = 'Daily routine';
todoList.save();
// Get user by todo list
const user = await todoList.user;
// Get items from todo list
const items = await todoList.items;
// List all todo lists by user
const lists = TodoList.byUser(1);Tutorials
The tutorials are written in TypeScript.
Dependencies
- axios for handling HTTP Requests.
Resources
-
The logo was created by Yannick Lung and can be found here.
Articles
- V0.1
Motivation
Premiere is inspired by Laravel (Eloquent) and Rails (Active Record).
Because of frameworks like these, building Restful APIs is a much smoother path.
The goal of Premiere is to provide the same facility and power that these libraries provide, just this time on the client side.