Git Product home page Git Product logo

react-redux-homework's Introduction

react-redux-homework

Goals

Learn react, redux and the ecosystem.

What's Your Job?

You need to create a basic CRUD functionality for a issue tracker, like following: table-example

Please follow below steps to do your job:

Step 1

  • Construct your app with starter kits and use React to construct your view and display above table.
    • Sample: git checkout starter-kit
  • Please divide your component, only one component is invalid
  • The data is just a fake array currently

Step 2

  • Complete a CRUD functionality
  • If a row is updated, please make that row with a particular background color
  • Just with some fake data like previous step
  • You need to think about how you perform the CRUD operation on the UI
  • Please linting your JavaScript via eslint. The following are recommended preset:

Step 3

  • Add Redux as the flux implementation
  • Still using fake data

Step 4

  • Abandon startkit and construct the server by your own.
  • Use webpack or browserify as your module bundler
  • Environment development (dev) and production (prod) are required. uglify and minify should be implemented on prod.

Step 5

  • Now, save your data in the database and use Node.js & Express as your backend
  • CRUD operation will be handled in the backend
  • Follow normal RESTful design for CRUD request

Step 6

  • Run your development/production in Docker

Step 7

  • Use react-router to separate one view to couples views for CRUD operation
  • Design by yourself

Requirements

Workflow

  1. Please fork this repository, create a git branch per step. After finishing of each step, create Pull Requests to merge to your master.
  2. Definition of Done (DoD) for per step: You should finish component, unit test and make sure Continuous Integration (CI) run tests successfully, which means CI badges should be displayed as Passed.
    • Write test if your component or function is in incubating instead of finish
  3. Please write the description and the shell command of your application in README.

NOTE: Your code should be Configurable, Testable and Maintainable

Technical

  • React
  • Redux
  • React-Router
  • Node.js & Express
  • It's necessary to write the testing for both frontend and backend
  • Deploy your application to CI like Travis, Circle or any else.

react-redux-homework's People

Contributors

chunming-c avatar allenfang avatar cybai avatar

Watchers

James Cloos 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.