Homework 23.1, 23.2, 24.1 & 24.2

Introduction of React & JSX

• This React app combine many homework together.
• The links in this project can not use.
• Pokemon database is not complete yet.
• This app use Thai language.

23.1: Build components

1. Remember the project building pattern.
2. Call a TA for test your memory.

23.2: Pikkanode X React

1. Use Create React App to create a project.
2. Write a homepage UI of Pikkanode by requirement
   • A navbar has a logo, a create pikka, signup, signin, signout.
   • Card rows

React Props, State & Event Handler

24.1: Pikkanode Picture Card

Build a picture card component to display each picture card. By this component will get prop values as follows

• id: an id of Pikka
• imgSrc: an image source
• createBy: who is post this photo?
• date: post date;
• likeCount: a number of likes
• commentCount: a number of comment

This is not connect the database yet, So I mock the data.

24.2: User Generator App

1. Fetch data from (https://randomuser.me/api/)
2. Display the data as follows
   • Email
   • Gender
   • Name (title, first, last)
   • Image (use a large image.)