-
-
A page contains the classic Todo List as follows:
-
-
Cocomic
-
An open-source platform for comic/manga collaboration (SFU CMPT470 course project, no typescript). source code here.
-
- yarn - dependency manager
- express - node.js framework for backend
- materialize - a modern responsive front-end framework based on Material Design
- sass - CSS pre-processors
- postcss - CSS post-processor
- webpack 4 - module bundler
- webpack-dev-middleware - offers a dev middleware for webpack, which arguments a live bundle to a directory
- webpack-hot-middleware - add hot reloading into an existing server without webpack-dev-server
- followed ES6 standard
- babel - compile ES6 to ES5
- react - building user interfaces
- react-hot-loader 4 - hot module reload!
- react-router 4 - routing
- react-redux - the official react bindings for redux (a predictable state container for js apps)
- connected-react-router - a redux binding for react-router 4, currently a replacement for react-router-redux v5
- immutable.js - persistent Immutable data structures for react redux state management
- Typescript - a typed superset of javascript that scales
- DefinitelyTyped - high quality TypeScript type definitions
- editorconfig - maintain consistent coding styles between different editors and IDEs
- eslint - lint javascript files (.js, .jsx)
- tslint - lint typescript files (.ts, .tsx)
- stylelint - lint style files (.css, .scss)
- postgresql - advanced open source database
- prismjs - code syntax highlight
- jest - painless javascript testing
- coveralls - test coverage
- husky - git hooks
- circle-ci 2 - continuous integration tool for testing and deployment
- heroku - a platform as a service (PaaS) that enables developers to build, run, and operate applications entirely in the cloud.
- docker - the open-source application container engine
node
yarn
(recommended) ornpm
docker
(recommended) withdocker-compose
The easiest way to run the example project is to use docker-compose
:
docker-compose up --build
that's it :)
You can also follow instructions below if you want to customize it.
Go to project root directory:
yarn install
If you find permission problem when trying to install yarn globally, check this out.
You can either
- run
postgresql
andredis
using docker images:
docker-compose up -d postgres redis
or
- maintain it by yourself, if so, make sure you set the right config in
backend/config.json
.
On development (with react-hot-reload and redux-devtools):
yarn run-dev
On production (with uglify-js and other optimazitions):
yarn run-prod
Thanks to webpack-bundle-analyzer, we can analyze and then optimize our assets bundle through DLL Plugin.
yarn profile
yarn test
yarn coveralls
yarn deploy
- Fork it!
- Create your feature branch:
git checkout -b my-new-feature
- Commit your changes:
git commit -am 'Add some feature'
- Push to the branch:
git push origin my-new-feature
- Submit a pull request :D