From the course: React Foundations by Pearson
Unlock this course with a free trial
Join today to access over 25,600 courses taught by industry experts.
Lab: using JSX - React.js Tutorial
From the course: React Foundations by Pearson
Lab: using JSX
Okay, so it's time for a lab to take a look at how to apply JSX in practice. So what you're going to do in this lab is you're going to take the library web application from before, which had the books and the films, and you're going to refactor it to use JSX rather than calling react create element everywhere. So by the time you finish, the page will behave the same way as before, but the code will be a lot more elegant and simple. So you probably would have guessed where to get the code from. The starter code is in React Dev Student 04, and the solution code is in Solutions 04 JSX. So let me take you through the exercises, and then you can have a go. So here are the exercises for this lab. There are four exercises altogether, familiar pattern to what we've been looking at in previous first of all in exercise one a quick familiarization with the solution web page so you can kind of see where you're looking to get to by the end once you know where you're heading to then in exercise two…
Contents
-
-
-
-
-
-
(Locked)
Learning objectives1m 21s
-
(Locked)
Getting started with JSX6m 40s
-
(Locked)
Creating a simple user interface via JSX13m 27s
-
(Locked)
Evaluating JavaScript expressions in JSX7m 4s
-
(Locked)
Data-driven JSX10m 52s
-
(Locked)
Passing properties to a component via JSX12m 56s
-
(Locked)
Additional JSX techniques16m 44s
-
(Locked)
Lab: using JSX9m 47s
-
(Locked)
Lab solution: Using JSX5m 24s
-
(Locked)
-
-
-
-
-
-
-
-
-