0.6.0 • Published 5 months ago

mobx-strapi v0.6.0

Weekly downloads
4
License
LGPL-3.0
Repository
-
Last release
5 months ago

MobX-Strapi

MobX SDK for Strapi headless CMS

MobX compatibility NPM Dependency npm.io

NPM

Version

SemVerbranchstatusES decoratorMobXStrapi
>=0.5main✅developingstage-3>=6.11v4
>=0.3 <0.5main❌deprecatedstage-2>=4 <6.11v4
<0.3master❌deprecatedstage-2>=4 <6v3

Usage

Installation

npm i mobx-strapi koajax

tsconfig.json

{
    "compilerOptions": {
        "target": "ES6",
        "moduleResolution": "Node",
        "useDefineForClassFields": true,
        "experimentalDecorators": false,
        "jsx": "react-jsx"
    }
}

model/service.ts

import { HTTPClient } from 'koajax';

export const strapiClient = new HTTPClient({
    baseURI: 'http://your.production.domain/path/optional',
    responseType: 'json'
});

model/Article.ts

import { StrapiListModel } from 'mobx-strapi';

import { strapiClient } from './service';

export type Article = Record<'id' | 'title' | 'summary', string>;

export class ArticleModel extends StrapiListModel<Article> {
    client = strapiClient;
    baseURI = 'articles';
}

export default new ArticleModel();

page/Article/index.tsx

Use WebCell as an Example

import { component, observer } from 'web-cell';

import articleStore from '../../model/Article';

@component({ tagName: 'article-page' })
@observer
export class ArticlePage extends HTMLElement {
    connectedCallback() {
        articleStore.getList();
    }

    disconnectedCallback() {
        articleStore.clear();
    }

    render() {
        const { currentPage } = articleStore;

        return (
            <ul>
                {currentPage.map(({ id, title, summary }) => (
                    <li key={id}>
                        <a href={`#/article/${id}`}>{title}</a>
                        <p>{summary}</p>
                    </li>
                ))}
            </ul>
        );
    }
}
0.6.0

5 months ago

0.5.3

8 months ago

0.5.2

10 months ago

0.5.1

1 year ago

0.5.0

1 year ago

0.4.5

2 years ago

0.4.3

2 years ago

0.4.2

2 years ago

0.4.1

2 years ago

0.4.0

2 years ago

0.4.0-rc.6

3 years ago

0.4.0-rc.5

3 years ago

0.4.0-rc.4

3 years ago

0.4.0-rc.2

3 years ago

0.4.0-rc.0

3 years ago

0.3.0-alpha.0

4 years ago

0.2.4

4 years ago

0.2.3

5 years ago

0.2.2

5 years ago

0.2.1

5 years ago

0.2.0

5 years ago