From the course: React Foundations by Pearson

Unlock this course with a free trial

Join today to access over 25,500 courses taught by industry experts.

Defining simple functional components

Defining simple functional components - React.js Tutorial

From the course: React Foundations by Pearson

Defining simple functional components

Right, okay, so I think it's time to actually see how to define functional components. It's very easy. To define a functional component, you just define a function. React is quite fussy that the name of the function must start with a capital letter. That's a rule, believe it or not. And basically in your function you just create the elements that you want, like a h1 or whatever, or paragraph, and then just return it. So there you go. Much easier than writing a class. You just write a function, you return some stuff, that's what's going to be rendered by your functional component. So I've got a very simple example. Example 1.html. It shows how to create a simple user interface via functional components. So I'm going to have a function that returns this content and a function that returns this content. If you want to have a look at it in a browser for yourself, it's example 1. Okay, so let's see. So So React Dev Demos, Lesson 3, example1.html. If we open that in a browser, here it is…

Contents