Front end Development

Everything works great on VS Code (+ the relevant plugins).

We're using http://yarnpkg.com/.

Important commands:

• yarn to install the packages
• yarn start to start the dev server.
• yarn storybook to start the storybook. Remember to add stories for components when it would be useful.

Important things to understand for our codebase are TypeScript, React, and Redux. Look at their websites for details (will keep an eye out for useful tutorials too).

For React components, it's good practice to split them into presentational and container components. Put simply, presentational components have props but no state, while container components manage state that they pass via props to presentational components (they also would pass handlers down via props to allow presentational components to interact with the state). Here's a good overview by Dan Abramov, a co-author of React and Redux: https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0

For components whose state we are storing in Redux, we use the connect() function whose arguments mapStateToProps and mapDispatchToProps let you specify how to map the Redux state and dispatcher into props to pass to the presentational component.