ReactJS Tutorial for Beginners -8

React

Welcome to part-8 of the series. You can find part-7 here. When we build web-applications a common scenario is to display list of items.

In any web-app we generally get a list of array and we iterate over it using map and display individual items.

List Rendering

We will create a function based component PersonList inside components folder. Here, we have an array names containing three strings.

After that we are just mapping over it and displaying each name inside a h1 tag.

PersonList.js

You can read the rest of the article from my site. Link for the same is below.

https://thewebdev.tech/react-basics-8

This completes part-8 of the series. You can find part-9 here.

--

--

--

Founder TWD, JavaScript & ReactJS Trainer, Youtuber, Blogger

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Creating an Agency Site in GatsbyJS-1

TypeScript has continuously got more popular among developers in the past years. More than

Adding Firebase Database + RestAPI to React App

10 Effective Coding Style & JavaScript DOM

Redux concepts in React in 3 min.

Frontend-Design Knowledge Sharing #22

React Functional Components Crash Course

MERNN: To-Do App

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Nabendu Biswas

Nabendu Biswas

Founder TWD, JavaScript & ReactJS Trainer, Youtuber, Blogger

More from Medium

React App with Final Space API — Tinder Style

ReactJS Tutorial Part #1: Introduction to ReactJS Basics

How to create a React To-do App (CRUD) with Hooks (2022) — Part 3

This gif is part of the how to create a ReactJs to-do app using hooks in 2022. CRUD. Delete function

Introduction of React JS