mahuntington
/
react-notes
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from '5e70bf8bb5'
${ noResults }
react-notes/Tools.md

1.3 KiB
Raw Blame History

Tools

Lesson Objectives

  1. Make Atom recognize JSX
  2. Transpile ES2015 to ES5 Using Babel.io
  3. Debug React Using React Dev Tools

Make Atom recognize JSX

  • By default, text editors like Atom don't recognize JSX code
  • Atom allows us to install packages to enhance it

To Install from Atom:

  1. Go to Atom->Preferences
  2. Click + Install
  3. Search for "react"
  4. Click Install

To Install from Terminal:

apm install react

You might need to do Atom->Install Shell Commands

Transpile ES2015 to ES5 Using Babel.io

  • Babel is an NPM package that converts ES2015 to ES5
  • See what it does at: https://babeljs.io/repl/
  • You can run it from the command line, but it's more common to use it as a plug-in to Webpack

Debug React Using React Dev Tools

The React dev tools allow you to inspect elements and see their properties, etc.

react dev tools

  • Follow this link and click "Add To Chrome"
  • You may need to refresh/restart chrome