tanyapowell / epic-react

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Epic React

All the exercises and docs created during Kent C Dodd's Epic React course

Fundamentals

Code

Going back to the beginning and learning/re-learning the fundamentals of React.

Hello World

Exercise Files

Old skool vanilla JS. Creating nodes and appending to the DOM.

All code is written in a single HTML file.

Intro to Raw React APIs

Exercise Files

Using the React.createElement method to create nodes and append them to the DOM.

All code is written in a single HTML file.

Extra Credit

Nesting elements using React.createElement to produce the following DOM output:

<body>
  <div id="root">
    <div class="container">
      <span>Hello</span>
      <span>World</span>
    </div>
  </div>
</body>

Using JSX

Exercise Files

Creating a single <div> using JSX instead of React.createElement

All code is written in a single HTML file.

Extra Credit

  1. Interpolating props and children
  2. Spreading the props

Creating custom components

Exercise Files

Creating a custom reusable React component

All code is written in a single HTML file.

Extra Credit

  1. Creating the component using React.createElement

  2. Creating the component using JSX

  3. Runtime validation with PropTypes

  4. Using the prop-types package

  5. Using React Fragments

Styling components

Exercise Files

Inline styling of components and regular CSS with the className prop

All code is written in a single JS file.

Forms

Exercise Files

All code is written in a single JS file.

  1. Refs

  2. Validation

Hooks

Use State

Exercise Files

Basic exercise to use the useState hook to store a name in state

All code is written in a single JS file.

About


Languages

Language:JavaScript 69.3%Language:HTML 23.6%Language:CSS 7.1%