If you are new to front-end development, or if your experience is limited, beefing up on React is a good place to start before jumping into a Jutro project.
Use Code Pen to experiment and learn
One of the best ways to learn is by doing. Code Pen offers a great environment to do that, where you can see the results of your code instantly. Try code pen.
You can also try using an editor, your browser, and its developer tools. We recommend Chrome Dev Tools.
See https://github.com/lukehoban/es6features for an excellent primer on ES6. Pay special attention to these concepts:
- Fat arrows
- Template strings
- Default parameters
- ‘import’ module loader
- Sets & Maps (WeakMaps)
- Array operators => (map, reduce, filter, forEach, every, some)
- ES7 Decorators
Node and the Development Environment
Learn about the code management systems for React UIs.
- We use Node.js for package management and for keeping dependencies up to date. For basic concepts, read Getting Started with Node.
- Node Version Manager (nvm) is great for keeping Node up to date and for switching between versions.
- Node Package Manager (npm) is used to manage dependencies and other project settings.
- Yarn is an alternative to npm. Facebook invented Yarn when their projects became too complex for npm. We don’t use Yarn yet, but we know it’s there.
Other Essential Development Tools
- ESDoc: Tool that generates developer documentation from source code comments. It works specifically with React and ES6+.
React and Friends
Start with the free materials on the React website. Later, when you want to review, try different sources to broaden your perspective.
- Tutorial: Intro to React
- Hello World (basic concepts)
- Getting Started (video course)
- React Fundamentals (video course)
- React Express: The all-in-one guide to modern React application development
Friends of React
This is a sample of important topics that tend to go with React. While the typical app developer will not need extensive knowledge in these areas, it’s always good to know they exist.
Get familiar with React Router.
Ways to stay up to date