# mikasa

> Framework for rendering react server-side

Latest version **0.2.0** (published 2018-02-01) · ISC license · 0 weekly downloads

## Install

```sh
npm install mikasa
pnpm add mikasa
yarn add mikasa
bun add mikasa
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.2.0 |
| Published | 2018-02-01 |
| First published | 2017-11-09 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 14 |
| Known vulnerabilities | 0 (+3 in 1 direct dependencies) |
| Install scripts | no |
| Maintainers | voodoo-child |

## Links

- npm: https://www.npmjs.com/package/mikasa
- Repository: https://github.com/voodoo-child/mikasa
- Homepage: https://github.com/voodoo-child/mikasa#readme
- Issues: https://github.com/voodoo-child/mikasa/issues
- npm.io page: https://npm.io/package/mikasa

## Dependencies (14)

- [koa](https://npm.io/package/koa.md) ^2.4.1
- [react](https://npm.io/package/react.md) ^16.0.0
- [redux](https://npm.io/package/redux.md) ^3.7.2
- [koa-mount](https://npm.io/package/koa-mount.md) ^3.0.0
- [react-dom](https://npm.io/package/react-dom.md) ^16.0.0
- [koa-router](https://npm.io/package/koa-router.md) ^7.2.1
- [koa-static](https://npm.io/package/koa-static.md) ^4.0.1
- [react-redux](https://npm.io/package/react-redux.md) ^5.0.6
- [redux-thunk](https://npm.io/package/redux-thunk.md) ^2.2.0
- [react-router](https://npm.io/package/react-router.md) ^4.2.0
- [react-router-dom](https://npm.io/package/react-router-dom.md) ^4.2.2
- [babel-preset-react](https://npm.io/package/babel-preset-react.md) ^6.24.1
- [serialize-javascript](https://npm.io/package/serialize-javascript.md) ^1.4.0
- [redux-promise-middleware](https://npm.io/package/redux-promise-middleware.md) ^4.4.2

## Recent versions

- 0.2.0 (latest) — 2018-02-01
- 0.1.2 — 2017-11-27
- 0.1.1 — 2017-11-27
- 0.1.0 — 2017-11-14
- 0.0.8 — 2017-11-14
- 0.0.7 — 2017-11-14
- 0.0.6 — 2017-11-14
- 0.0.5 — 2017-11-14
- 0.0.4 — 2017-11-14
- 0.0.3 — 2017-11-09
- 0.0.2 — 2017-11-09
- 0.0.1 — 2017-11-09

## README

# Documentation is outdated, will update it soon.

## Demo
A simple demo of mikasa using iTunes Api: [Demo](https://mikasa-app.herokuapp.com)

# mikasa
A simple wrapper for server side rendering isomorphic react. It uses Koa.js as webserver, Redux and React-router for routing.

## Configuration

| Parameters    | Type               | Description  |
| ------------- |:------------------:| ----- |
| port          | Number             | The port that webserver will run on |
| routes        | Array              | An Array of Route Objects |
| static        | Object             | An configuration object |
| layout        | React Component    | The React Component that will be used as layout |
| store         | Object             | An Object containing the redux reducer and the initialState |
| promises       | Array             | An array of promises that need to be resolved before any render from server side |


## Routes
Routes are based on routes from react-router, they must be specified as an array of objects that must contain the following attributes.

| Parameters    | Type               | Description  |
| ------------- |:------------------:| ----- |
| path          | String             | The route path, for example: /about |
| exact        | Boolean              | Exact parameter from react-router |
| component        | React Component             | The component that will be rendered for that route |
| loadData        | Function    | A function used for doing asynchronus actions before the render of the component. It must return a promise or an array of promises. The function takes three parameters: The context parameter from koa that contains the request, a shared object, and the redux store object for the dispatches before the render.  |

## Static
The static object must contain the following attributes.

| Parameters    | Type               | Description  |
| ------------- |:------------------:| ----- |
| path          | String             | The path that will be used in browser, for exmaple: /public |
| local        | String              | The path to folder containing the static files. |
| options        | Object            | This object is used as options for koa-static. example: { gzip: true } |

## Store
The store object is used to create the redux storage on the backend. It must contain the following attributes:

| Parameters    | Type               | Description  |
| ------------- |:------------------:| ----- |
| reducer          | Function             | It can be a simple reducer or a combined reducer. |
| initialState        | Object              | This will be used as initialState for the redux. |

## Example
```javascript

import initialState from './store/default'
import reducer from './reducers'
import Layout from './components/layout'
const mikasa = require('mikasa')

mikasa({
        port: 3002,
        routes: routes,
        static: {
            path: '/public',
            local: './static',
            options: {
                gzip: true,
            }
        },
        layout: Layout,
        store: {
            initialState: initialState,
            reducer: reducer,
        },
        promises: [],
    })
}

```
# Usage in browser
For the the browser usage import mikasa/browser. The configuration object is similar to the server one and it must contain the following attributes:

| Parameters    | Type               | Description  |
| ------------- |:------------------:| ----- |
| reducer          | Function        | It can be a simple reducer or a combined reducer. |
| routes        | Array              | An Array of Route Objects. |
| layout        | React Component    | The React Component that will be used as layout. |

# Example in browser

```javascript
import mikasa from 'mikasa/browser'
import reducer from '/reducers'
import routes from '/routes'
import layout from '/components/layout'

mikasa({
    reducer: reducer,
    routes: routes,
    layout: layout,
})
```

---
_Source: https://npm.io/package/mikasa · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._