[D+81] React Hook D+81 - React Hook - (React Hook) React Hook ๊ธฐ์กด์ ์ฐ๋ฆฌ๋ ๋ฆฌ์กํธ์์ ์ํ๋ฅผ ๊ด๋ฆฌํด์ฃผ๊ธฐ ์ํด์๋ function์ด ์๋ Class๋ฅผ ์ฌ์ฉํด ์ํ๋ฅผ ๊ด๋ฆฌํด ์๋ค. Class๋ก ์ํ๋ฅผ ๊ด๋ฆฌํด์ค๋ฉด์ ๋๋์ ์ ์ด๊ธฐ์ํ๋ฅผ ์ค์ ํด์ฃผ๊ณ ํน์ ์ํ๋ฅผ ๋ณ๊ฒฝํ๊ธฐ ์ํด์ ์ํ๋ฅผ ๋ถ๋ฌ์ค๊ณ ๋ถ๋ฌ์จ ์ํ๋ฅผ ๋ณ๊ฒฝํ๋ ๊ณผ์ ์์ ๊ฝค๋ ๋ณต์กํ ๊ณผ์ ์ด๋ผ๋ ๊ฒ์ ๋๊ผ๋ค. ๋ฟ๋ง this์ ๋ํ ๊ฐ๋ ์ด ์ด๋์ ๋ ์์ด์ผ ํ๊ธฐ ๋๋ฌธ์ bind๋ฅผ ์ฌ์ฉํด์ฃผ๊ณ , this๋ฅผ ์ ์ฌ์ฉํด์ผ๋ง ํฐ ์ค์ ์์ด ์ํ๋ฅผ ์ ๋๋ก ๊ด๋ฆฌํ ์ ์์๋ค. ์ด๋ฌํ ๊ฝค ๋ถํธํ ์ ์ ํด์ํ๊ธฐ ์ํด Hook์ด ๋ค์ด์ค๊ฒ ๋์๋๋ฐ ์ด๋ป๊ฒ Hook์ ์ฌ์ฉํ๋์ง์ ๋ํด์ ๊ฐ๋จํ๊ฒ ์์๋ณด๋ ค๊ณ ํ๋ค. useState import React, { useSta.. 2021. 1. 8. [D+80] ์๊ณ ๋ฆฌ์ฆ๋ฌธ์ 5๋ฒ D+80 - ์๊ณ ๋ฆฌ์ฆ๋ฌธ์ 5๋ฒ - (Toy Problem 5) # 05 2*n ๋ณด๋์ 2*1ํฌ๊ธฐ์ ํ์ผ์ ๊ฐ์ง๊ณ ๋ณด๋๋ฅผ ์ฑ์ฐ๋ ๋ฐฉ๋ฒ์ ๊ฒฝ์ฐ์ ์๋ฅผ ๋ฆฌํดํ๋ ๋ฌธ์ ์๋๋ฐ ์ฌ์ค ๋ฌธ์ ๋ฅผ ์ดํดํ๋๋ฐ ์์ฒญ ์ค๋๊ฑธ๋ ธ๋ค. (ํ 30๋ถ์ ๋....ใ ใ ) ๋ฌธ์ ๋ฅผ ์ดํดํ๊ณ ๋์๋ ๋ฌธ์ ๋ฅผ ๊ฑด๋๋ฆด ์๊ฐ ์์ด์ Reference๋ฅผ ๋ณด๋๋ฐ ๋ฌธ์ ์์ memo ๋ฐฐ์ด ์์ ๊ฐ์ ์ ์ ๋ ๊ฒ ๋ฃ๋์ง์ ๋ํด์๋ ์ดํดํ๋๋ฐ ์์ฒญ ์ค๋๊ฑธ๋ ธ๋ค.. ๋์ค์ ๋ด๊ฐ ์ดํดํ ๋ฐ๋ก๋ memo๋ ์์๋๋ก 2*0, 2*1, 2*2์ ๊ฒฝ์ฐ์ ์๋ฅผ ํํํ๊ฑฐ๋ก ์ฌ๊ท์ ์ธ ํจ์๋ฅผ ํ๊ธฐ ์ํด ํ์ํ ๊ฒ์ด์๋ค. ๊ทธ๋ฆฌ๊ณ ํ์ผ์ ์ธ๋ก๋ ๊ฐ๋ก๋ก ๋๊ณ ๋ณด๋์ ํฌ๊ธฐ์ ์ํฅ์ ๋ฏธ์น๊ธฐ ๋๋ฌธ์ ํจ์๋ฅผ ์ชผ๊ฐ ํ๊ฐ๊ฐ ์๋ ์ฌ๋ฌ๊ฐ์ ์ฌ๊ท๋ฅผ ํตํด ๋ฌธ์ ๋ฅผ ํด๊ฒฐํด๋๊ฐ๋ ๊ฒ์ ๋ํด ์์ฒญ ๊ฐํํ๋ค. ์.. 2021. 1. 6. [D+79] ์๊ณ ๋ฆฌ์ฆ๋ฌธ์ 3 - 4๋ฒ D+79 - ์๊ณ ๋ฆฌ์ฆ๋ฌธ์ 3 - 4๋ฒ - (Toy Problem 3 - 4) # 03 ๋๊ฐ์ ๋ฐฐ์ด์ ์ ๋ ฅ๋ฐ์ sample์ด base์ ๋ถ๋ถ์งํฉ์ธ์ง๋ฅผ ๊ตฌ๋ณํ๋ ๋ฌธ์ ์๋๋ฐ ๊ธฐ๋ณธ์ ์ธ ๋ฌธ์ ๋ค์ ๋ค ์์ฑํ์ง๋ง ์์ฝ๊ฒ๋ Advancedํ ๋ฌธ์ ๋ ํต๊ณผํ์ง ์์๋ค. ์ฌ์ค Advancedํ ๋ฌธ์ ๋ก ํ ์คํธ๊ฐ ์์ ๋์๊ฐ์ง ์์์ ์ฝ์์ฐฝ์์ ํ ์คํธ๋ฅผ ๋๋ ค๋ณด์๋ค ใ ใ ใ ์๊ฐ ๋ณต์ก๋๋ฅผ ๊ฐ์ ํด์ ๋ฌธ์ ๋ฅผ ์์ฑํ๋ ๊ฒ์ด์๋๋ฐ ์๊ฐ๋ณด๋ค ์ฝ์ง ์์๋ค. ๋ํผ๋ฐ์ค์ฝ๋๋ฅผ ๋ดค๋๋ฐ๋ ์ดํดํ๋๋ฐ ์ฝ์ง ์์์ ์ธํฐ๋ท์ ๊ฒ์์ ํตํด ๋ด๊ฐ ์ดํดํ ์ ์๋ ์ฝ๋๋ฅผ ์ฐธ๊ณ ๋ก ์์ฑํด ๋ณด์๋ค. ํ์ธํด ๋ณด๋ ๋๋ index๋ฅผ ๋ณ์๋ก ๋ฐ๋ก ์ฃผ๋ฉด์ ๊ณ์ฐํ์ง ์์๋๋ฐ ์ ๋ ๊ฒ ํ์ง ์์ผ๋ฉด ํ ์คํธ๊ฐ ๋์๊ฐ์ง ์๋ ๋ค๋๊ฑธ ์์๋ค. ์๋ฌด๋๋ ์๊ฐ ๋ณต์ก๋ ๊ฐ์ ์ ์ํด ๊ผญ ๊ฑฐ์ณ.. 2021. 1. 5. [D+78] React Lifecycle D+78 - React Lifecycle - ( ๋ฆฌ์กํธ ์๋ช ์ฃผ๊ธฐ ) Lifecycle ๋ฆฌ์กํธ์์์ ๋ผ์ดํ์ธ์ดํด์ ์ฐ๋ฆฌ์ ์ธ์๊ณผ๋ ๋น์ทํ ๋ฉด์ด ์๋๋ฐ ์ธ์์ ์์ด์ ์ค์ํ ์๊ฐ์ ์ ์ด๋ณด์๋ฉด • ํ์ด๋ ๋ • ์ฑ์ธ์ด ๋ ๋ • ๊ฒฐํผ์ ํ ๋ • ์ฃฝ์์ ์๋๊ณ ์์ ๋ ๋ณดํธ์ ์ผ๋ก ์ด๋ฌํ ๊ฒ๋ค์ด ์์ ์ ์๊ฒ ๋ค. ์ด์ฒ๋ผ ๋ฆฌ์กํธ์์ ์ปดํฌ๋ํธ์์๋ ์ค์ํ ์๊ฐ์ด ์กด์ฌํ๋๋ฐ ํฌ๊ฒ 3๊ฐ์ง๋ก ์์ฑ, ์ ๋ฐ์ดํธ, ์ ๊ฑฐ๋ก ๋๋ ์ ์๋ค. ์ด๋ ์ปดํฌ๋ํธ์์๋ ์ค์ํ ์๊ฐ๋ง๋ค ์ปดํฌ๋ํธ๋ฅผ ๋ ๋๋งํ๊ฒ ๋๋๋ฐ ์ด๋ฅผ ๋ค์ด์ด๊ทธ๋จ์ผ๋ก ํํํ ๊ทธ๋ฆผ์ด ๋ฐ๋ก ์ด ์ฌ์ง์ด๋ค. ๋ฆฌ์กํธ์์๋ ์ด 3๊ฐ์ง๋ฅผ ํํํด์ฃผ๊ธฐ ์ํด์ ์ฌ์ฉํ๋ ๋ฉ์๋๊ฐ ์๋๋ฐ ๋ฐ๋ก componentDidMount, componentDidUpdate, componentWillUnmo.. 2021. 1. 5. [D+77] Immersive 5์ฃผ์ฐจ D+77 - Immersive 5์ฃผ ์ฐจ - ( ์ฝ๋์คํ ์ด์ธ ์ด๋จธ์๋ธ ์ฝ์ค 5์ฃผ ์ฐจ ) ์๊ฐ์ด ์ด์ฐ๋ ๋น ๋ฅธ์ง... ๋ฒ์จ 5์ฃผ์ฐจ๊ฐ ๋์๋ค. ์ด๋ฒ์ฃผ๋ ์ฌ์ค ์ด์ ์ ๋ฐฐ์ ๋ ๊ฐ๋ ๋ค์ ๋ํด์๋ ๊ณต๋ถํ๋๋ผ ์ ์ ์์๋ ํ ์ฃผ ์๋ ๊ฒ ๊ฐ๋ค. ์ง๊ธ์ ๋ณต์ตํ๋ค๊ณ ์๋ฃ๊ตฌ์กฐ์ ๋ฆฌ์กํธ๋ฅผ ๋์์ ๊ณต๋ถํด ๋๊ฐ๊ณ ์์ง๋ง ์๋ฌด๋๋ ํ์ ํ๋ ๊ฒ ๋ณด๋ค 2๋ฐฐ์ ๋๊ฐ ๋์ด๋๋ค ๋ณด๋ ์ ์ ์๊ณ ๋จธ๋ฆฌ๊ฐ ํฐ์ง ๊ฒ ๊ฐ๋ค. ๐คฏ ๊ทธ๋๋ ์์ ์๋ณด๊ณ ๋ฐ๋ก ๋ฌด์ธ๊ฐ๋ฅผ ํ๋ ๊ฒ ๋ณด๋ค๋ ํจ์ฌ ์์ฐจ๊ณ ๋ณด๋์ฐฌ ์๊ฐ์ด๋ผ๊ณ ์๊ฐํ๋ค. (๋ฌผ๋ก ๋ด ๋จธ๋ฆฟ์๋ ์์ฐจ๋ค!) ์ด๋ฒ์ฃผ๋ ์ฌ์ค ์ ๋ ๋ ์ด์ฌํ ํ ๋๋์ธ๋ฐ ์๋ํ๋ฉด ์ง๋ ๊ธฐ์๋ ์๋ฒ์์ ๋งํ๋ฒ๋ฆฐ ์ดํ๋ถํฐ ๋ค๋ฅธ ๋ฌธ์ ๋ฅผ ํด๊ฒฐํ๋๋ฐ์๋ ๋ฌธ์ ํด๊ฒฐ์ ์ด๋ ค์์ ๊ฒช์๋ ๊ฒ์ ๋๋ํ ๊ธฐ์ตํ๊ธฐ ๋๋ฌธ์ ์ด๋ฒ์๋ ์๋ฒ์ ๋ํด ์ ๋๋ก ์ด๋ ค.. 2021. 1. 4. [D+76] ์๊ณ ๋ฆฌ์ฆ๋ฌธ์ 1 - 2๋ฒ D+76 - ์๊ณ ๋ฆฌ์ฆ๋ฌธ์ 1 - 2๋ฒ - (Toy Problem 1 - 2) ์ด๋ฒ์ ์๊ณ ๋ฆฌ์ฆ ๋ฌธ์ ๊ฐ ์๋กญ๊ฒ ์ ๊ทธ๋ ์ด๋๊ฐ ๋ ๊ด๊ณ๋ก 1๋ฒ๋ถํฐ ์๋ก ์์ํ๋ ๋ง์์ผ๋ก ์์ํ๊ธฐ๋ก ํ๋ค. (๋ง์ด ์ด๋ ค์์ก๋๋ผ... ใธในใน) # 01 ๊ฐ์๋ฐ์๋ณด ๊ฒ์์ ๊ฒฝ์ฐ์ ์๋งํผ ๋์ค๋ ๋ฐฐ์ด์ ๋ฆฌํดํ๋ ๋ฌธ์ ์๋๋ฐ ๊ธฐ๋ณธ์ ์ธ ๋ฌธ์ ๋ ๋ฐ๋ณต์ ์ธ for๋ฌธ์ ํตํด์ ๋ฌธ์ ๋ฅผ ํ์์์ง๋ง ์์ฝ๊ฒ๋ advancedํ ๋ฌธ์ ๋ ๊ฑด๋๋ฆฌ์ง๋ ๋ชปํ๋ค. rounds์ ๊ฐ์ ๋ฃ์ผ๋ฉด์ ์ฌ๊ท์ ์ผ๋ก ๋๊ณ ๋๋ค๋ ๊ฒ์ ํ์ ํ์ผ๋ ์์ ๋๋ค์ ํจ์๋ฅผ ๋ฃ์ด ๊ฑฐ์ ์ด์ค๊ธ์ผ๋ก ์ฌ๊ท๊ฐ ๋๋ค๋ ๊ฒ๊น์ง๋ ํ์ ํ์ง ๋ชปํ๋ค. ๋ํผ๋ฐ์ค ์ฝ๋๋ฅผ ๋ด๋ ์ดํด๊ฐ ๊ฑฐ์ ์๋์ด์ ์์ผ๋ก ์ง์ ์ ์ด์ ๋ฌธ์ ๋ฅผ ํ์ด๋ณด์๊ณ , ๊ทธ์ ์์ผ ์ด๋์ ๋๋ ์ดํดํ ์ ์๊ฒ ๋์๋ค. (rounds๋ฅผ 2๋ฅผ ๋ฃ์๊ธฐ์ ๋ง.. 2021. 1. 2. ์ด์ 1 ยทยทยท 3 4 5 6 7 8 9 ยทยทยท 18 ๋ค์