Video 46-1 Module overview and modern application
core parts
Component, Template, State, Routing
Video 46-2 Web component, 4 types of component,
identify component
Video 46-3 Template, dynamically create HTML
elements based on data
Video 46-4 Single Page Application (SPA),
Performance benefit
Video 46-5 Routing, Route parameter, Routing in
React
Video 46-6 Explore destructuring and send data to
html elements using props
Video 46-7 Website state, state management, purpose
of state
Video 46-8 Install React App and explore
folder structure and edit
Video 46-9 Module Summary and concept recap
Rest Countries I am Coming To
Youuuu!
QUIZ
Q1: SPA stands for______
Ans: Single Page Application
Q2: How will you recognise components in a website?
Ans: Similar in look, different in data; Large area broken down into smallar areas; Container of smallar
parts of a website
Q3: What does window.location.href return?
Ans: returns the href (URL) of the current Page
Q4: const nayok = {
name: “Salman Shah” ,
birthPlace:”sylhet” ,
firstSerial: “Pathor Somoy”
}
How will you destructure name and firstSerial from the above object?
Ans: const{ name, firstSerial}= nayok
Q5: What are the advantages of a Single Page Application?
Ans: Optimization; User Experience; Client side Rendering
Q6: What will you use to create similar looking website parts that has
different data?
Ans: Component
Q7: let ul = ` <li>Programming
<li> `;
ul += `
<li> Hero
<li>`;
console.log(ul);
What will you get?
Ans:
<li>Programming <li >
<li >Hero <li >
Q8: What is a website state?
Ans: Web Application data that could change
Q9: Suppose you open “https://react.dev/learn/tutorial-tic-tac-toe” in
your browser and write location.pathname in your browser console . What will you get?
Ans: '/learn/tutorial-tic-tac-toe'
Q10: What is routing?
Ans: Define the URL and based on the URL set different parts of the website.