From the course: React for Web Designers
Unlock this course with a free trial
Join today to access over 22,600 courses taught by industry experts.
Attaching a data source - React.js Tutorial
From the course: React for Web Designers
Attaching a data source
- [Instructor] In this video, we're going to attach a source of inventory data for our little store page. The first component we'll be building is this size selector, which has hard coded values right here. But really, we'll be assuming that these sizes would be retrieved from sort of inventory system. Maybe it's an external API or who knows what. We're going to cheat a little bit just to make sure that this doesn't get too hellaciously complicated. We're going to have an external data source that our component is going to draw from. So let's start by installing that little data source. Switching over to my editor, the index dot html file is where I'll be installing that source of data, but we're going to get it from this inventory snippet that comes with the exercise files. It's a JavaScript file and I'm going to just select all of this and bring it over into my index dot html. We'll scroll all the way down. Command down arrow. And I'm going to install this right before my app dot…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
-
-
(Locked)
Installing React on an existing site8m 7s
-
(Locked)
Identifying your components and data3m 19s
-
(Locked)
Set up first simple component5m 31s
-
(Locked)
Start using JSX with the help of Babel7m 57s
-
(Locked)
Attaching a data source3m 20s
-
(Locked)
Create a new component with array data5m 56s
-
(Locked)
Implement props4m 28s
-
(Locked)
Implement state with the useState hook5m 11s
-
(Locked)
Add the color selector component3m 27s
-
(Locked)
Change options, see reactions6m 14s
-
(Locked)
Challenge: Activate the color selector1m 58s
-
(Locked)
Solution3m 4s
-
(Locked)
-
-
-