Framework/React

[Modern React] section1 : Let's Dive in!

yuri lee 2023. 1. 8. 23:06
๋ฐ˜์‘ํ˜•

1. How to Get Help

pass

 

2. Join Our Community!

done

 

3. Course Resourse

pass

 

4. Let's Build an App!

์–ด๋–ป๊ฒŒ ๋ฆฌ์•กํŠธ๋ฅผ ๋นจ๋ฆฌ ๋ฐฐ์› ์„๊นŒ๋ผ๋Š” ์งˆ๋ฌธ์„ ๋งŽ์ด ๋ฐ›์Šต๋‹ˆ๋‹ค. ์ด ์งˆ๋ฌธ์— ๋‹ตํ•  ์ˆ˜ ์žˆ๋Š” ๋Œ€๋‹ต์€ ๋”ฑ ํ•œ๊ฐ€์ง€์ž…๋‹ˆ๋‹ค. 

You have to write code and you have to work on projects

 

5.  Critical Questions

1. What's React All about?

๋ฆฌ์•กํŠธ๋Š” (1) HTML์„ ๋ณด์—ฌ์ฃผ๊ฑฐ๋‚˜ (2) ์‚ฌ์šฉ์ž๊ฐ€ ๋ฌด์–ธ๊ฐ€๋ฅผ ํ•  ๋•Œ, HTML์ด ๋ณ€ํ•œ๋‹ค.  

 

6.  A Few More Critical Questions

2. How does a React app start up?

1. All of your project's JS files are 'bundled' together into a single file, then placed onto a server

2. User makes a request to the server and gets an HTML file + the bundle 

3. User's browser executes your code 

 

3-1. Find the div with id of 'root in the DOM

3-2. Tell React to take control of that element

3-3. Tell React to getJSX from the App component, turn it into HTML, and show it in the root.

3. What were the 'useState' functions?

'useState' is a function that works with React's "state" system.

State is like a variable in React.

State is used to store data that changes over time.

Whenever state changes, React automatically updates content on the screen.

4. How did the text get translated to another language?

using goole translate API

 

7.  Node Setup

pass

 

8.  Creating a React Project

pass

 

9.  What is Create React App?

index.js : First file that gets executed when our app runs

index.html : Skeleton(๋ผˆ๋Œ€) for the React app

package.json : Lists dependencies our app needs

package-lock.json : Lists dependencies our app needs

node-modules : Contains dependencies our app needs 

 


https://www.udemy.com/course/react-redux/

๋ฐ˜์‘ํ˜•