Architecture Overview
Tech Stack
| Stack Layer | Tech | Docs & Resources |
|---|---|---|
| JavaScript Flavour | TypeScript | JavaScript: The Good Parts, JavaScript30, ES6 for Everyone, JavaScript Notes & Reference, JS Functions |
| UI Library | React | Documentation, React For Beginners, Epic React, Advanced React and GraphQL, Drawing the Invisible: React Explained in Five Visual Metaphors |
| Styling | Sass, CSS modules | Sass Documentation, Sass Guide, CSS Modules Documentation |
| State Management | Redux | Docs, Video series on Egghead, Learn Redux, [Let’s Learn Modern Redux! (with Mark Erikson)]((https://www.youtube.com/watch?v=9zySeP5vH9c) |
| Side Effects | RXJS, redux-observable | Learn RXJS in 60 Minutes, Learn RXJS, redux-observable Docs, Netflix JavaScript Talks - RxJS + Redux + React = Amazing! |
| API | Phoenix | Phoenix Git Repo |
| Testing | Jest, Cypress | Syntax podcast on Testing, Testing JavaScript Course |
| UI Development Environment | Storybook | Learn Storybook |
Other libraries
| Library | Description |
|---|---|
| Formik | Build forms in React, without the tears 😭 |
| Lodash | A modern JavaScript utility library delivering modularity, performance & extras. (Slowly being deprecated in favour of Ramda) |
| Ramda | A practical functional library for JavaScript programmers. |
| React Router | Declarative routing for React |
| Redux Toolkit | The official, opinionated, batteries-included toolset for efficient Redux development |
| Reselect | Selector library for Redux |
| date-fns | Modern JavaScript date utility library |
| morphism | Type-safe data transformer for JavaScript, TypeScript & Node.js library |
| react-use | A collection of custom React hooks |