Simple React App

Let's learn to render hello world using React.

Here is the proverbial Hello World application in React. It is hosted in the Educative Single Page Application (SPA) widget. This will be our coding environment throughout this course, so you’ll see it over and again.

Press the RUN button to see hello world displayed on the output tab below:

import React from 'react';
require('./style.css');

import ReactDOM from 'react-dom';
import App from './app.js';

ReactDOM.render(
  <App />, 
  document.getElementById('root')
);

Congratulations!🎉 You have run your first React app.

Let’s walk you through the SPA environment. The names of the files that are part of the project (index.js, app.js, and style.css) are displayed on the left-hand side. Clicking on any of these names will open the respective file in the code editor. You may make changes to any file and click the RUN button to run the application with the modified code.

📜 Explore the code and the widget, without worrying too much about the syntax, as it will be explained soon.