์์ ์ ์์ฑํ๋ ์ฝ๋๋ฅผ ๋ก์ปฌ๋ก ๋ค์ ํด๋ก ๋ฐ์ ์ฝ๋๋ฅผ ์์ ํ๋ ค๊ณ ํ๋ค. ํ๋ฉด์ ๋ณด๊ธฐ์ํดnpm start๋ฅผ ํด์ฃผ์๋๋, script ์ค๋ฅ๊ฐ ๋ฌ๊ณ ๐คฆ๐ปโโ๏ธ ๋นํฉํ์ง ์๊ณ npm install์ ํด์ฃผ์๋ค. ๊ทธ๋ฌ๋๋ ์ด๋ฒ์ ๋ค์๊ณผ ๊ฐ์ code ERESOLVE ์ค๋ฅ๊ฐ ๋ฌ๋ค
์ผ๋ง์ ์ปดํจํฐ๋ฅผ ์๋ก ์๊ณ , clone๋ฐ์ ํ๋ก์ ํธ์ commit์ ๋ ๋ ธ๋๋ ์๋์ ๊ฐ์ ์ค๋ฅ ๋ฉ์ธ์ง๊ฐ ๋ด๋ค.๋๋ต, ์ฌ์ฉ์ ์ด๋ฆ์ ์ปดํจํฐ hostname์ ๊ธฐ์ค์ผ๋ก ์๋ ์ค์ ํ์ผ๋, ์ ํํ์ง ํ์ธํ๋ผ๋ ๋ง์ด๋ค. git log๋ฅผ ํตํด commit ๋ด์ญ์ ๋ณด๋, ์ปดํจํฐ๋ฅผ
์ ํ๋ธ ๊ฐ์๋ฅผ ๋ณด๋ค ๊ฐ์๋ฅผ ์งํํ์๋ ๊ฐ๋ฐ์๋์ด code . ๋ช ๋ น์ด๋ก ํฐ๋ฏธ๋์์ ๋ฐ๋ก vscode๋ฅผ ์ฌ๋ ๊ฒ์ ๋ณธ ์ ์๋ค. ๊ทผ๋ฐ ์ฉ์ ์์น๋ฅผ ๋ฐ๊ฟ๊ฐ๋ฉฐ ์๋ฌด๋ฆฌ ์ ๋ ฅํด๋ ๋์๊ฒ ๋์์ค๋๊ฑด zsh: command not found: code ๋ฟ ๐ฅฒ ์์ฃผ ๊ฐ๋จํ ๋ฐฉ๋ฒ์ผ๋ก
๊ธฐ์ ํ์ > 2์ฐจํ๋ก์ ํธ๋ฅผ ๋ง์น๊ณ ์จ์ ๊ณ ๋ฅผ์๋ ์์ด ๊ธฐ์ ํ์ ์ด ์์๋์๋ค. ์ฌํ์ ๋์ ์ฒซ ํ์ฌ์ ์ถ๊ทผํ๋ ๊ทธ๋ ์ฒ๋ผ ๋จ๋ ธ๋ค. ์ด๋ค ์ฌ๋๋ค์ ๋ง๋๊ฒ๋ ์ง, ์ด๋ค ์ ๋ฌด๋ฅผ ๋งก๊ฒ๋ ์ง, ๊ณผ์ฐ ์งง์ ์๊ฐ ๋์ ๋ฐฐ์ด ๋์ ์ค๋ ฅ์ผ๋ก ํ์ฌ์ ์ ๋ฌด๋ฅผ ์ ํด๋ผ ์ ์์์ง, ํจ๊ป๊ฐ๋ ๋๊ธฐ
Redux์ ํ๋ฆ์ ํ์ ํ๊ธฐ ์ํด, ๋ฒํผ์ ํด๋ฆญํ๋ฉด ์ซ์๊ฐ ์ฆ๊ฐ/๊ฐ์ํ๋ ๊ฐ๋จํ ์ฑ์ ๋ง๋ค์ด ๋ณด์. combineReducers์ฌ์ฉ ์๋ฅผ ๊ธฐ๋กํ๊ธฐ ์ํด isLogged๋ผ๋ reducer๋ฅผ ํ๋ ๋ ์์ฑํด ์ฃผ์๋ค. reducer๊ฐ ์ฌ๋ฌ๊ฐ์ผ ๊ฒฝ์ฐ combineReducer
Hoist๋ ๋ณ์ ์ ์ธ์ ๋์ด์ฌ๋ฆฌ๋ ๊ฒ์ ๋งํ๋ค. ์ฆ,1) ๋ณ์๊ฐ ํจ์ ๋ด์์ ์ ์๋์์ ๊ฒฝ์ฐ, ์ ์ธ์ด ํจ์์ ์ต์์๋ก ๋์ด์ฌ๋ ค์ง๋ฉฐ 2) ๋ณ์๊ฐ ํจ์ ๋ฐ๊นฅ์์ ์ ์๋์์ ๊ฒฝ์ฐ, ์ ์ญ ์ปจํ ์คํธ์ ์ต์์๋ก ๋์ด์ฌ๋ ค์ง๋ค.1) ๋ณ์๊ฐ ํจ์ ๋ด์์ ์ ์๋์์ ๊ฒฝ์ฐ, ์ ์ธ์ด ํจ์
Redux ๋? > ์๋ฐ์คํฌ๋ฆฝํธ ์ฑ์ ์ํ ์์ธก ๊ฐ๋ฅํ ์ํ ์ปจํ ์ด๋ ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ค. Redux๋ฅผ ์ฌ์ฉํ๋ ์ด์ ? react๋ฅผ ์ฌ์ฉํ๋ค๋ณด๋ฉด ๊ฒช๋ ๋ถํธํจ์ด ์๋ค. props๋ฅผ ๋ถ๋ชจ์์ ๋ฉ๋ฆฌ ๋จ์ด์ง ์์๊น์ง ์ ๋ฌํด์ผํ๊ฑฐ๋, ํน์ ์์์๊ฒ์ ๋ถ๋ชจ์๊ฒ๋ก, ๋ ์ฌ๊ธฐ์ ๊ธฐ๋ก pro
2์ฃผ๊ฐ ์งํ๋ ๋ง์ด๋ฆฌ์ผํธ๋ฆฝ ํด๋ก ํ๋ก์ ํธ์ ํ๊ณ ๋ก ๐ฑ 1. ํด๋ก ํ๋ก์ ํธ ์๊ฐ โ๏ธ ํด๋ก ์ฌ์ดํธ ๋ช : [๋ง์ด๋ฆฌ์ผํธ๋ฆฝ] (https://www.myrealtrip.com/) โ๏ธ ํ๋ช ๋ฐ ๊ตฌ์ฑ : ๋ง์ด๋๋ฌํธ๋ฆฝ ํ๋ก ํธ) ๊นํด์ธ(PM), ์๋ฏธํ, ์ดํ์ / ๋ฐฑ์๋) ์ด์ฃผ
Data Range Picker ๊ณต์๋ฌธ์ ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ฅผ ์ฌ์ฉํ์ฌ ๊ฐํธํ๊ฒ ๋ฌ๋ ฅ์ ๋ง๋ค์ด๋ณด์! ๋จผ์ install์ ํด์ฃผ๊ณ , ์ปดํฌ๋ํธ ์๋จ์ importํด์ฃผ๊ณ ,
styled component๋ฅผ react์ importํ๊ธฐ๋ง ํ๋ฉด error: Invalid hook call.์ด๋ผ๋ ์ค๋ฅ๊ฐ ์๊ฒผ๋ค. ๋์ ๊ฐ์ ์ค๋ฅ๋ก ๊ณ ์ํ์ค ๋ถ๋ค์ ์ํด ๊ฐ๋จํ๊ฒ ๋จ๊ฒจ ๋๋ ๊ธ. 1.npm install --save styled-components
Merge & Rebase Merge์ Rebase๋ ๋ชจ๋ ํ ๋ธ๋์น์์ ๋ค๋ฅธ ๋ธ๋์น๋ก ๋ณํฉํ์ง๋ง, git commit history ์์์ ์ฐจ์ด๊ฐ ์๋ค. Merge Git Merge๋ ์๊ฐ ์์์๋ฐ๋ผ ๋ค๋ฅธ ๋ธ๋์น์ ์ปค๋ฐ๊น์ง ๋ค ๋ด๊ฐ ์์ ํ๋ ๋ธ๋์น๋ก ๋ค์ด์ ๋ฒ๋ฆฐ๋ค.
์์ฝ๋์์ 4์ฃผ๊ฐ ์งํํ๋ Foundation ๊ธฐ๊ฐ์ ์๋ฃํ ํ ์์ํ 1์ฐจ ํ๋ก์ ํธ. ๊ทธ ๋ง๋ฌด๋ฆฌ๋ฅผ ์ํ ํ๊ณ ๋ก. 1. ํด๋ก ํ๋ก์ ํธ โ๏ธ ํด๋ก ์ฌ์ดํธ ๋ช : ๋ผ์ธํ๋์ฆ ์ต โ๏ธ ํ ๊ตฌ์ฑ : ํ๋ก ํธ) ์๋ฏธํ, ์ด์์ง, ๊ฐ๊ฒฝ์ค / ๋ฐฑ์๋) ๋ฌธ์นํฌ, ์ค์นํ โ๏ธ ๋ด๋น ํ
์์ด๋ ๊ฒ ์ฝ์งํ๊ณ ๋ณด๋ ์๋ก์ด ๋ฐฐ์ด์ ์ ์ธํ์ง ๋ง๋ผ๋ ์กฐ๊ฑด์ด ๋ณด์๋ค. ๋น์ฐํ๊ฒ๋ ๋น๋ฐฐ์ด์ ์ ์ธํด์ ๋ฐ๋ณต๋ฌธ์ ๊ฑฐ๊พธ๋ก ๋๋ ค pushํ๋ ค๊ณ ํ๋๋ฐ ๋ง์ด๋ค. ๊ทธ๋ ์ด๋ ๊ฒ ์ฌ์ธ๋ฆฌ๊ฐ ์์ง, ํ๋ฉฐ ๋ค์ ๋์ . ๋ฐฐ์ด์์์ ์์๋ฅผ ์ด๋์ํค๋ ค๋ฉด ๋ญ๊ฐ ๊ธฐ์ค์ ์ด ํ์ํ ๊ฒ ๊ฐ์์ lengt
1. ๋ฌธ์ 2. ํ์ด ๋ณต์์๋ฅผ ์ดํดํ
๊ฐ๋ฐ์๋ผ๋ ๊ฟ์ ๊พธ๋ฉฐ ์ฒซ๊ฑธ์์ ์์ํ์ง ํ ๋ฌ์ด ์ง๋ฌ๋ค. ์ง๋์จ ์๊ฐ๊ณผ ๋ง์์ ๊ธ๋ก ๋จ๊ฒจ๋ณด์. ๊ฐ๊ฐ ํ๋ฌ ์ , ์ฌ์ ์คํฐ๋ ์กฐ๊ฐ ๊พธ๋ ค์ง๊ณ ์จ๋ผ์ธ์ ํตํด ์ผ์ฃผ์ผ์ ํ๋ฒ ์ ํด์ง ์๊ฐ์ ๋ง๋ ํ ์ฃผ๊ฐ ๊ณต๋ถํ ๊ฒ์ ๋๋๋ ์๊ฐ์ ๊ฐ์ก๋ค. ํ ๋ฌ์ด๋ผ๋ ์๊ฐ๋์ ๋ง์ ์กฐ์๋ค์ด ์
1~3999 ์ฌ์ด์ ๋ก๋ง์ s๋ฅผ ์ธ์๋ก ์ฃผ๋ฉด ๊ทธ์ ํด๋นํ๋ ์ซ์๋ฅผ ๋ฐํํด์ฃผ์ธ์.๋ก๋ง ์ซ์๋ฅผ ์ซ์๋ก ํ๊ธฐํ๋ฉด ๋ค์๊ณผ ๊ฐ์ต๋๋ค.Symbol ValueI 1V 5X 10L 50C
componentDidMount() ๋ฉ์๋๋ฅผ ํตํด ๋ผ์ดํ ์ฌ์ดํด์ ๋ํ ์ดํด๋ฅผ ๋์ธ๋ค. fetch() ํจ์๋ฅผ ์ฌ์ฉํด API ํธ์ถ์ ํ ์ ์๋ค. Array.map() ํจ์๋ฅผ ํตํด component๋ฅผ ์ฌํ์ฉํ ์ ์๋ค. props ๋ฅผ ์ฌ์ฉํด ๋จ๋ฐฉํฅ(๋ถ๋ชจ ์ปดํฌ๋ํธ > ์์
state๋ฅผ ์ง์ ์์ ํ๋ฉด ์๋๋ ์ด์ ? setState๋ ๋น๋๊ธฐ์ ์ผ๋ก ๋์ํ๊ธฐ ๋๋ฌธ์ state๊ฐ ์ง์ ์์ ๋์ด ์ฌ๋ฌ๋ฒ ์ํ๋ฅผ ์ ๋ฐ์ดํธ ํ๋ ๊ฒฝ์ฐ, ์ด์ ์ ๋ฐ์ดํธ ๋ด์ฉ์ด ๋ค์ ์ ๋ฐ์ดํธ ๋ด์ฉ์ ๋ฎ์ด ์ฐ์ฌ์ง ์๊ฐ ์๋ค. ์ฆ, ์์์น ๋ชปํ ๊ณณ์์ ๋ฒ๊ทธ๊ฐ ๋ฐ์ ํ ์ ์๋ค.
Component๋ฅผ ๋ง๋๋ ๋ฐฉ๋ฒ์๋ Class ์ Function ๋๊ฐ์ง ๋ฐฉ๋ฒ์ด ์๋ค. Class Component๋ ๋ฆฌ์กํธ์์ ์ ๊ณตํ๋ ์ปดํฌ๋ํธ๋ผ๋ ํด๋์ค๋ฅผ ์์(extends)ํด์ ๋ง๋ ๋ค. => Class ์ปดํฌ๋ํธ๋ช extends Component state์ li
๋ ธ๋ JS ์น ๋ธ๋ผ์ฐ์ ธ ๋ฐ์์๋ JavaScript๋ก ํ๋ก๊ทธ๋๋ฐ์ ํ ์ ์๋๋ก ๋๋ ํ๊ฒฝ. JavaScript๋ ์๋ ๋ธ๋ผ์ฐ์ ์์์ ๋์ํ๋ ์นํ์ด์ง๋ ์น์ดํ๋ฆฌ์ผ์ด์ ์ ์ํด ์์ฑํ๋ ์ธ์ด์์ผ๋, Node.Js ์ธํด ์ด์ ์ด๋์๋ JavaScript๋ก ํ๋ก๊ทธ๋๋ฐ์ ํ