Suicrux: demo

Demo sometimes becomes frozen by now. Retry in a few minutes, if it doesn't work.

Join the chat at https://gitter.im/suicrux/Lobby

What is this?

Universal starter with lazy-loading for your new Progressive Web App.

Previous release lives here.

Quick intro

Why this starter uses `react-semantic-ui`?

SPOILER: because SUI and SUIR are awesome

You're always free to use any other UI framework with suicrux. UI framework comparison here.

What's inside?

PureCrux - same as suicrux, but without i18n, rarely used features(manifest, favicons generation, etc) and example app.

Client:

Flow - static typing rocks!
React 16 and Redux
SASS, PostCSS, and styled-components support.
React-Router v4 + React-Router-Redux v5
Redux-thunk, Redux-Devtools-Extension
isomorphic-fetch
Semantic-ui-react - UI components.
Store2 and js-cookie - LocalStorage and cookies.
Lodash - is a dependency of SUIR.
react-async-component - library for lazy-loading
react-async-bootstrapper - for server-side data fetching
react-ga - advanced Google Analytics for React
react-intl - i18n.
immutable, reselect and normalizr
redux-form - most known React/Redux library for forms

Build (Webpack):

Latest Webpack
both hot server and hot client, only one port and one filesystem used
Babel: stage-1 and few cool plugins for development and production.
HMR, hotMiddleware,
Eslint and Stylelint (could be uncommented inside postcss.config.js)
Offline-plugin
favicons-webpack-plugin
webpack-bundle-analyzer
compression-webpack-plugin
optimize-css-assets-webpack-plugin
autodll-webpack-plugin
assets-webpack-plugin
optimize-js-plugin
wepback-assets-manifest
circular-dependency-plugin
extract-text-webpack-plugin

Server:

morgan - request logger middleware.
helmet - secure your Express app.
cookie-parser - cookie parsing middleware.
body-parser - body parsing middleware
compression - compression middleware (gzip).
jsonwebtoken - JWT ~~for the win~~.
raven - Sentry for Node

Other:

Jest - awesome testing framework.
And more tools for building and testing...

Usage

How it works?

"30-seconds guide":

  # Install
  git clone --depth=1 --single-branch https://github.com/Metnew/suicrux.git
  cd suicrux
  npm install
  flow-typed install # install flow typings for libraries
  # Development
  npm run dev
  # Build
  npm run build
  # Production
  npm run start

More detailed: