How to start coding React in 60 minutes

How to start coding React in 60 minutes

Why is React so popular among developers these days? If you are familiar with front-end development, by any chance, you have probably heard about React and seen dozens of tutorials that explain why with justification. As this tutorial aims for hands-on practice, I will try to make this as simple as possible to encourage you to start coding right away in React by giving core reasons.

Before getting hands-on experience, let’s understand some facts about React.

  • React is a free and open-source JavaScript library for building fast and interactive user interfaces which are designed & maintained by Facebook and a community of developers.
  • React is one of the fastest JavaScript libraries & frameworks out there. It has excellent performance at runtime and uses Virtual Dom to improve rendering performance. In addition, virtual DOM helps the library to detect the components that require re-rendering. You can find benchmark results for various libraries, frameworks here.
  • React has an optional feature, JSX, which lets you create JavaScript objects with HTML syntax. In addition, it simplifies the creation of React tree nodes with attributes.
  • Easy to learn and has an excellent documentation
  • One-way data binding
  • React is used for web applications development, and React Native framework is used for mobile applications.

How to start playing with React?

Online playgrounds for React

If you don’t want to bother with installations but only challenge yourself, then you are at the right place! Online playgrounds such as CodePen, CodeSandbox, or Stackblitz are great choices for you. They provide a simple Hello World template. Then, you can hack it as you wish.

Coding in your text editor

If you prefer to use your own text editor, you can also download this HTML file, edit it, and open it from the local filesystem in your browser.

Create your first React application

Make sure you have a recent version of node.js installed. Once installation is done, create a react app;

$ npx create-react-app my-first-react-app

#tip: Using npx instead of npm not to install packages globally!

Run “npm start” in the project folder to start the application;

$ cd my-first-react-app
$ npm start
Compiled successfully!
You can now view my-first-react-app in the browser.
  Local: http://localhost:3000
Note that the development build is not optimized.
To create a production build, use npm run build.

Congratulations! You can enjoy your first user interface from http://localhost:3000 in the browser. Feel free to add some interactivity or start a more complex application. Reactjs.org has an excellent practical tutorial that builds a small game for beginners who does not have any previous knowledge. If you are interested in concepts, then I will take you to the details page

As Exceptionly, we have a series of “how to start coding … in 60 minutes” for various languages and frameworks. Find out how you can start Java or Python in 60 minutes!

5 thoughts on "How to start coding React in 60 minutes"

  1. Pingback: Exceptionly
  2. Pingback: Exceptionly

Leave a Reply

Your email address will not be published. Required fields are marked *

#

“Exceptionly was such a fast and efficient process. Complete game changer for hiring remote.”

Liam Martin
Co-Founder at TimeDoctor

#

“Great service, outstanding speed, stunning quality.”

Andy Tryba
CEO at Gigster

Is Exceptionly an outsourcing business?

No. We encourage our clients to do direct hires. We provide payroll consultancy and services in a 100% transparent way if our clients are new to remote hiring.

Is Exceptionly a database of candidates?

Not really, data is only a small part of our business. While we own over 2 million publicly available software engineer data evaluated, our power lies in hands-on testing and engineer-to-engineer technical interviews.

Is Exceptionly expensive?

Exceptionly is more cost-efficient than any other serious competitor who owns a decent technical testing funnel. If you compare Exceptionly with HR agencies who only do resume screening before endorsement, yes, it is expensive.

Who is the founder of Exceptionly?

Sinan Ata is the founder of Exceptionly, who previously built two global technical talent acquisition enginess and tested over 2.5 million software engineers in his career.

Still have questions? Contact us.

Ready to meet top-notch engineers?

Let's get your talent pipelines up and running!

HIRE WITH EXCEPTIONLY

No hidden fees.