A Few Tips to Enjoy the Course Better

Learn a few tips to better understand the course.

We'll cover the following

How to read the code examples

This course takes a hands-on, project-driven approach, which means that source files often change over the course of a chapter. When a code example is a work in progress, its file name (relative to the project root) is shown as a comment at the top of the snippet:

// src/tests/MyComponent.test.js
import React from 'react';
import MyComponent from '../MyComponent';

describe('MyComponent', () => {
  it('renders a <div /> tag', () => {
    const wrapper = shallow(<MyComponent />);
    expect(wrapper.type()).toBe('div');
  });
});

As a source file changes over the course of a chapter, familiar sections are omitted with ... and new/edited lines are highlighted:

Press + to interact
// src/tests/MyComponent.test.js
...
describe('MyComponent', () => {
  ...
  it('accepts a `className` prop', () => {
    const wrapper = shallow(<MyComponent className="test-class" />);
    expect(wrapper.hasClass('test-class')).toBe(true);
  });
});

At the end of each chapter, there will be a complete executable code for the project discussed in the chapter.

Mantra: Code with joy

Each chapter of this course concludes with a mantra, a phrase you can repeat to yourself whenever you’re feeling unfocused to bring clarity. At its best, coding is an exercise in imagination and exploration, an exciting journey into the unknown. At its worst, it feels like stumbling in the dark. Which kind of experience you’ll have is largely determined by feedback. The next time you’re feeling frustrated, take a step back, and ask yourself what kind of feedback would help you move forward. What question can you ask about your code that would bring clarity? Can you turn that question into a test?

The hope is that this course will help bring more joy to your work by instilling a habit of seeking feedback early and often. Let’s begin!