Search⌘ K
AI Features
Home
Courses
Quick Start Full Stack Web Development

Tinker with the Live React App

Explore how to create and modify React components using class-based methods. Learn to handle component data with props and children while experimenting with live coding exercises to see immediate changes in the application.

We'll cover the following...

React Application

A React component can be defined as a function or class inheriting from the Component class. In some cases, the function-based components are preferable, but we’ll only use the class-based approach.

JavaScript (JSX)
import React, { Component } from 'react';
class App extends Component {
    render() {
        return (
            <div className="App">
                <p>FRAP applications are fun and powerful</p>
            </div>
        );
    }
}
export default App;

We’ve stripped off all of the non-essential imports, leaving only React and Component. An App component must be defined and exported so that index.js ...