profile
๐Ÿšง์ดˆ๋ณด ๊ฐœ๋ฐœ ๋ธ”๋กœ๊ทธ๐Ÿšง
post-thumbnail

[React] ์›น ๊ฒŒ์ž„-1 ๊ตฌ๊ตฌ๋‹จ

1. ์ฒซ ๋ฆฌ์•กํŠธ ์ปดํฌ๋„ŒํŠธ create-react-app์—†์ด html๋กœ ์ปดํฌ๋„ŒํŠธ ๋งŒ๋“ค๊ธฐ lecture ๋””๋ ‰ํ„ฐ๋ฆฌ ๋งŒ๋“ค๊ณ  ๊ทธ ์•ˆ์— index.html ์ƒ์„ฑ index.html 2. HTML ์†์„ฑ๊ณผ ์ƒํƒœ(state) ์ƒํƒœ(state)๋Š” ๋ฐ”๋€Œ๋Š” ๋ถ€๋ถ„, ํ˜น์€ ๋ฐ”๋€” ์ˆ˜ ์žˆ๋Š” ๋ถ€๋ถ„

์•ฝ 12์‹œ๊ฐ„ ์ „
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
post-thumbnail

[React] ์ƒํ™œ์ฝ”๋”ฉ-6 Update, Delete๊ตฌํ˜„

1.Update Read๊ธฐ๋Šฅ, Create ๊ธฐ๋Šฅ ๊ฒฐํ•ฉ components ๋””๋ ‰ํ„ฐ๋ฆฌ์— UpdateContents.js ํŒŒ์ผ ์ƒ์„ฑ App.js render()ํ•จ์ˆ˜ ์•ˆ ์ฝ”๋“œ๊ฐ€ ๋ณต์žกํ•˜๊ธฐ ๋•Œ๋ฌธ์— ์ƒˆ๋กœ์šด ํ•จ์ˆ˜๋กœ ์ชผ๊ฐœ์„œ ๋ถ„๋ฆฌ์‹œ์ผœ๋ณด๊ธฐ UpdateContent ์ปดํฌ๋„ŒํŠธ ์‹คํ–‰ ์‹œ ์ž…

6์ผ ์ „
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
post-thumbnail

[React] ์ƒํ™œ์ฝ”๋”ฉ-5 Create ๊ตฌํ˜„

1. mode ๋ณ€๊ฒฝ `์™€ ` ์ปดํฌ๋„ŒํŠธ ์‚ฌ์ด์— create, update, delete ๋ฒ„ํŠผ ๋งŒ๋“ค๊ธฐ components ๋””๋ ‰ํ„ฐ๋ฆฌ ์•ˆ์— Control.js ํŒŒ์ผ ์ƒ์„ฑ Control.js App.js 2. mode ์ „ํ™˜ create ํด๋ฆญ ์‹œ `` ์ปดํฌ๋„ŒํŠธ๋กœ ๋ฐ”๊ฟ”๋ณด๊ธฐ ์›

2020๋…„ 7์›” 4์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
post-thumbnail

[React] ์ƒํ™œ์ฝ”๋”ฉ-4 ์ด๋ฒคํŠธ

1. ์ด๋ฒคํŠธ state props ๊ทธ๋ฆฌ๊ณ  redner ํ•จ์ˆ˜ props, state, event ์ด 3๊ฐœ๊ฐ€ ์„œ๋กœ ์ƒํ˜ธ์ž‘์šฉํ•˜์—ฌ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์˜ ์—ญ๋™์„ฑ์„ ๋งŒ๋“ฆ App.js mode๊ฐ’์ด welcome, read์— ๋”ฐ๋ผ ์‹คํ–‰๋˜๋Š” ์ฝ”๋“œ๊ฐ€ ๋ฐ”๋€œ props, state๊ฐ’์ด ๋ฐ”๋€Œ๋ฉด

2020๋…„ 6์›” 30์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
post-thumbnail

[React] ์ƒํ™œ์ฝ”๋”ฉ-3 State

Props: ์‚ฌ์šฉ์ž๊ฐ€ ์ปดํฌ๋„ŒํŠธ๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ์ž…์žฅ์—์„œ ์ค‘์š”State: Props์˜ ๊ฐ’์— ๋”ฐ๋ผ ๋‚ด๋ถ€์˜ ๊ตฌํ˜„์— ํ•„์š”ํ•œ ๋ฐ์ดํ„ฐ, ์™ธ๋ถ€์—์„œ ์•Œ ํ•„์š” ์—†๋Š” ์ •๋ณด ์€๋‹‰์œ„ props์˜ ๊ฐ’๋“ค์ด ํ•˜๋“œ์ฝ”๋”ฉ๋˜์–ด ์žˆ๋Š” ๊ฑธ state๋กœ ๋งŒ๋“ค๊ณ , state๊ฐ’์„ Subject์˜ props๋กœ ์ „๋‹ฌํ•˜๋Š”

2020๋…„ 6์›” 29์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
post-thumbnail

[React] ์ƒํ™œ์ฝ”๋”ฉ-2 ์ปดํฌ๋„ŒํŠธ ๋งŒ๋“ค๊ธฐ

1. ์ปดํฌ๋„ŒํŠธ ๋งŒ๋“ค๊ธฐ App.js ์‹คํ–‰๊ฒฐ๊ณผ ` ์•ˆ์— `ํƒœ๊ทธ๊ฐ€ ๋“ค์–ด๊ฐ€ ์žˆ์Œ > โ— ์œ„์—์„œ ์ง  ์ฝ”๋“œ๋Š” ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์ฝ”๋“œ๊ฐ€ ์•„๋‹Œ JSX JSX๋กœ ์ฝ”๋“œ ์ž‘์„ฑ์‹œ Creat React App์ด ์•Œ์•„์„œ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์ฝ”๋“œ๋กœ ๋ณ€ํ™˜ ํƒœ๊ทธ๋ฅผ ์—ด์—ˆ์œผ๋ฉด ๊ผญ ๋‹ซ์•„์•ผ ํ•จ ๋‘ ๊ฐœ ์ด์ƒ์˜ ํƒœ๊ทธ๋Š”

2020๋…„ 6์›” 29์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
post-thumbnail

[React] ์ƒํ™œ์ฝ”๋”ฉ-1 ๋ฆฌ์•กํŠธ ์ž…๋ฌธ

1. ๋ฆฌ์•กํŠธ ์™œ ์“ธ๊นŒ? : ์‚ฌ์šฉ์ž ์ •์˜ ํƒœ๊ทธ Component๋กœ ์ž‘์„ฑ ๊ฐ€๋…์„ฑ ์žฌ์‚ฌ์šฉ์„ฑ ๋†’์•„์ง ์œ ์ง€๋ณด์ˆ˜๋ฅผ ์‰ฝ๊ฒŒ ํ•  ์ˆ˜ ์žˆ์Œ 2. ๊ฐœ๋ฐœํ™˜๊ฒฝ ์ข…๋ฅ˜ https://reactjs.org/ 1) Online Playgrounds ์ปดํ“จํ„ฐ์— ์„ธํŒ…ํ•  ์ˆ˜ ์—†๋Š” ํ™˜๊ฒฝ์ด๋ผ

2020๋…„ 6์›” 28์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€