Create a teamlist component using again the listitem material-UI component. Then, insert some data through a function inside of the main app component. Render the list of the players into the team list component.
- [Instructor] In the last video,…we created a function that will return our players,…and in this video, we'll actually…render those players into the team list.…So, let's get started.…The very first thing that we need to do…is to import a few things to make our app…look a little bit better.…So, we'll import first,…the List item from material-ui.…This is basically a component that we'll use…to render list of things,…and it's going to be very useful,…especially in our TeamList component.…
The next thing that we'll need to import is a divider,…and you'll see what it does in a few seconds.…It's basically a divider that material-ui provides…that we can use to divide sections into our app.…There we go, divider.…So, now that we've done this,…we'll do the renderPlayer method.…So basically, that method will render…the players that we have at the top here,…and use the map function to map it into a team list.…
And this is all going to make a little bit more sense…in a few seconds, I'll explain as I type.…So basically, the renderPlayers method,…
- Setting up your editor
- Understanding the file structure and player components
- Setting up static data
- Routing with React
- Creating a schema and player form
- Building functions to add a player
- Adding a user login
- Assigning players to the user
- Securing database transactions
- Editing and deleting players
- Using Chart.js to display team stats
Skill Level Intermediate
Q: This course was updated on 05/01/2018. What changed?
A: We updated 13 videos to reflect the changes in the latest versions of Meteor (v1.6) and Node.js (v8).
1. Setting Up
2. React Refresher: Basic Player View
3. Reduce Player Stats
4. Players CRUD and Team View
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.