Code Monkey home page Code Monkey logo

react-app's Introduction

Demo built on react + redux

Application currently in beta

Demo

  1. Demo powered by Heroku

How to build the app

  1. Download and install NodeJS

  2. On the console, run npm install

  3. Run npm run build in order to build the code inside dist for distribution. Run npm run bundle-analyzer to analyze the bundle

  4. Run npm run serve in order to launch the application for development

Backend implementation

  1. Based on json-server with mocks from faker

  2. Run npm run build and npm start in order to launch the server (http://localhost:3000) with the distribution version of the app (APIs available at http://localhost:3000/api/)

  3. The server randomly simulates delays and errors for testing purposes

Progressive web app

  1. The app contains a manifest.json and the entire service-worker business in order to cache the app (sw is enabled only for npm run build)

Libs & Tooling

  1. React

  2. Redux

  3. Redux-Saga

  4. Typescript (with --strict true)

  5. Reactstrap

  6. Font Awesome

  7. Sass

  8. CSS Modules

  9. Webpack

  10. Babel

  11. EsLint

  12. Stylelint

  13. Webpack Bundle Analyzer

CSS Modules

  1. sass-resources-loader: variables / classes in assets/stylesheets/base.scss are shared across all SASS styles

  2. typings-for-css-modules-loader: Typescript typings for each sass file

Unit-tests (Jest)

  1. The unit-tests are written in typescript using Jest. You find all the files searching for __.spec.ts

  2. On the console, run npm test for executing them

  3. Tests are also executed automatically by Travis CI

Working with editors/IDEs supporting “safe write”

  1. Take a look at the following page if you use IntelliJ or VIM

react-app's People

Contributors

mauriziocescon avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.