Start using React in your machine

To start using React is not as simple as downloading a file and link it to your html file like you can do with JQuery. For example, you need a group of libraries to make it work in your browser.

React needs ES6, so apart from the React library do you need other libraries like Babel to make it work on your browser.

If you want to learn about ES6, Babel and new features that ES6 has, I recommend these videos to get an update:

Yes, ES7 is out there but this learning curve has to be slowly for me.

Like I said, we need a group of libraries to begin to use React, we can install those libraries with Node and start checking what fits better our requirements. But, are we learning right? We need a clear and easy boilerplate to get started coding and spend less time searching and trying the libraries required to make a simple Hello World. Remember, search for thing like Babel, Webpack and other things that React needs.

Maybe you are wondering: A Boilerplate? Do I need to learn another thing?

No, a boilerplate is a base with all set to start to code, without having to think in what version of Babel or Webpack we should use, how to configure them and all that stuff. There are a lot of boilerplates in the Internet to make an app with React, just make a simple Google search and you will see.

When I was looking for a boilerplate for React I was searching for something simple to understand and install, with a simple structure to make it work and then begin to do basic examples.

If React was made by Facebook, they should have a good base to start with. I found Create React made by Facebook Incubator, it brings a very simple structure and good documentation on how to use it.

To download Create React you need to have installed NodeJS and then follow the next steps that you can also find in their documentation:

  • $ npm install -g create-react-app
  • $ create-react-app my-app
  • $ cd my-app/
  • $ npm start

If everything works fine you should see an app running on your localhost http://localhost:3000 with a demo.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s