๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
728x90
๋ฐ˜์‘ํ˜•

๋ฆฌ์•กํŠธ๊ฐ•์˜์ถ”์ฒœ2

[React] ReactJS๋กœ ์˜ํ™” ์›น ์„œ๋น„์Šค ๋งŒ๋“ค๊ธฐ (STATE #1) * ๋…ธ๋งˆ๋“œ์ฝ”๋” ๊ฐ•์˜ ์ •๋ฆฌ ๊ธ€ ์ž…๋‹ˆ๋‹ค. ReactJS๋กœ ์˜ํ™” ์›น ์„œ๋น„์Šค ๋งŒ๋“ค๊ธฐ – ๋…ธ๋งˆ๋“œ ์ฝ”๋” Nomad Coders React for Beginners nomadcoders.co STATE 1 - ์ด์ „ ๊ฐ•์˜์— ์ด์–ด์„œ ๊ณ„์† - ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๋ฉด ์ˆซ์ž๊ฐ€ ์นด์šดํŠธ ๋˜๋Š” ํ”„๋กœ๊ทธ๋žจ์„ ๋งŒ๋“œ๋Š” ์ค‘ 1. React.js (๋ฆฌ๋ Œ๋”๋ง ํ•˜๋Š” ๋ฐฉ๋ฒ•) - ์šฐ๋ฆฌํ•œํ…Œ ์–ด๋–ค๊ฒŒ ํ•„์š”ํ•˜๊ณ , ์–ด๋–ค๊ฑธ ํ•ด์•ผํ•˜๋Š”์ง€ ์ดํ•ดํ•˜๊ธฐ ์œ„ํ•ด ์•ˆ ์ข‹์€ ๋ฐฉ๋ฒ•๋ถ€ํ„ฐ ์‹œ์ž‘ - ์ด๋ ‡๊ฒŒ ์ฝ”๋“œ๋ฅผ ์งœ๊ณ  ์‹คํ–‰ํ•˜๊ฒŒ ๋˜๋ฉด ์‹ค์ œ๋กœ counter์˜ ๊ฐ’์€ ์ฆ๊ฐ€ํ•˜์ง€๋งŒ UI๊ฐ€ ์—…๋ฐ์ดํŠธ ๋˜์ง€ ์•Š์•„ 0์œผ๋กœ ๋ณด์ธ๋‹ค. (์ด์œ ๋Š” ์ปดํฌ๋„ŒํŠธ๋ฅผ ๋‹จ ํ•œ ๋ฒˆ๋งŒ ๋ Œ๋”๋ง ํ•˜๊ณ  ์žˆ๊ธฐ ๋•Œ๋ฌธ) - ๋™์ž‘์„ ์‚ดํŽด๋ณด๋ฉด, 1. ์–ดํ”Œ๋ฆฌ์ผ€์ด์…˜ ์‹คํ–‰ โž” ํŽ˜์ด์ง€ ๋กœ๋“œ 2. countUp(), Container()๋Š” ํ•จ์ˆ˜์ด๊ธฐ ๋•Œ๋ฌธ์—.. 2024. 2. 22.
[React] ReactJS๋กœ ์˜ํ™” ์›น ์„œ๋น„์Šค ๋งŒ๋“ค๊ธฐ (The BASICS OF REACT) * ๋…ธ๋งˆ๋“œ์ฝ”๋” ๊ฐ•์˜ ์ •๋ฆฌ ๊ธ€ ์ž…๋‹ˆ๋‹ค. ReactJS๋กœ ์˜ํ™” ์›น ์„œ๋น„์Šค ๋งŒ๋“ค๊ธฐ – ๋…ธ๋งˆ๋“œ ์ฝ”๋” Nomad Coders React for Beginners nomadcoders.co The BASICS OF REACT - ๋ฆฌ์•กํŠธ ๊ฐ•์˜ ์‹œ์ž‘ ์ „ JS์™€ ReactJS๋ฅผ ๋น„๊ตํ•ด๋ณธ๋‹ค. ์œ„์™€ ๊ฐ™์ด ํด๋ฆญ ์ด๋ฒคํŠธ๊ฐ€ ์žˆ๋Š” ์นด์šดํŠธ ํ”„๋กœ๊ทธ๋žจ์„ ๋งŒ๋“ ๋‹ค๊ณ  ์น˜์ž. JavaScript Total Clicks : 0 Click me โœ” HTML โž” JS ์ˆœ์„œ React 1 (createElement) - ์‰ฌ์šด๋ฐฉ๋ฒ•์ด ์žˆ์ง€๋งŒ ๋ฆฌ์•กํŠธ์˜ ๋™์ž‘ ๋ฐฉ์‹์„ ์ดํ•ดํ•˜๊ธฐ ์œ„ํ•ด์„œ ์–ด๋ ค์šด ๋ฐฉ๋ฒ•์œผ๋กœ ์ฝ”๋“œ ์ž‘์„ฑ - ์ง€๊ธˆ ํ•˜๋Š” ๋ฐฉ๋ฒ•์„ ์•”๊ธฐํ•  ํ•„์š”๋Š” ์—†์Œ * React : UI๋ฅผ ๋งŒ๋“ค ์ˆ˜ ์žˆ๊ฒŒํ•˜๋Š” ์—”์ง„ * React-dom : ๋ชจ๋“  react element๋“ค์„ H.. 2024. 2. 21.
728x90
๋ฐ˜์‘ํ˜•