react-mobx-boilerplate

KO | EN

gitlite — search

#python #llm #android #machine-learning #rust #deep-learning #linux #windows #awesome #awesome-list #security #ios #mcp #open-source

react-mobx-boilerplate

(★ 18)

Adopted by mobxjs

react-mobx-boilerplate 최신버젼 다운로드

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

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# React MobX Boilerplate
 
A modern web development boilerplate for React + MobX + Webpack 4.
## Stack

* React
* MobX
* Webpack 4
* Typescript
* PostCSS + CSS Modules

## Features

* HMR of components and store
* Code-splitting out of the box
* Simple routing (without react-router)
* Server-side rendering with async data loading

## Installation and Starting

### Development server
```
npm start
> visit localhost:3000
```

### Building for production
```
npm run build
> serve index.html
```

### Building for node (server-side rendering)
```
npm run build-node
> require('build/app.node.js').default('/users')
```

## Structure

During app development, you should care about these files:

The rest can be extended if needed:

1. `index.html`
1. `index.ts` - Entry point for browser bundle
1. `index.node.ts` - Entry point for node (server-side rendering) bundle
1. `App.ts` - Manages routing, contains a reference to AppState
1. `root.tsx` - Container component for the app
1. `webpack/webpack-dev-server.js` - Script to run the development server
1. `webpack/webpack.config.js` - Webpack configuration for browser bundle
1. `webpack/webpack.config.node.js` - Webpack configuration for node (server-side rendering) bundle

Typically, when adding a new page you'd add a route for it in `routes.tsx` containing the component to render. Note that the component isn't imported directly but with import() for code splitting. Then you can add the component to the components folder and the relevant state to the store.

This project is a boilerplate and does not impose strong architectural decisions on users.

## TODO

- [x] Full SSR workflow
- [x] Optimize bundles
- [x] Static assets (images etc.)
- [ ] Make work with remote chrome debugging
- [ ] Add linter
- [ ] Add PostCSS plugins
- [x] Use webpack-dev-middleware instead of webpack-dev-server

react-mobx-boilerplate

react-mobx-boilerplate 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

react-mobx-boilerplate

react-mobx-boilerplate 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README