์ฃผ๊ฐ„ ํšŒ๊ณ 

    ์ฝ”๋“œ์ˆจ(CodeSoom) ๋ฆฌ์—‘ํŠธ 11๊ธฐ 5์ฃผ์ฐจ ํšŒ๊ณ 

    ํ•™์Šตํ•œ ๊ฒƒ๋น„๋™๊ธฐ ์ฒ˜๋ฆฌ๋™๊ธฐ ์ฒ˜๋ฆฌ vs ๋น„๋™๊ธฐ ์ฒ˜๋ฆฌ์ฝœ๋ฐฑ ํ•จ์ˆ˜์ฝœ๋ฐฑ ์ง€์˜ฅ Promise, async/awaitPromise ๊ฐ์ฒด๋ž€์ฝœ๋ฐฑ ์ง€์˜ฅ์„ ํ•ด๊ฒฐํ•˜๋Š” ๋ฐฉ๋ฒ•Promise์˜ 3๊ฐ€์ง€ ์ƒํƒœPromise ์—ฐ๊ฒฐ, ์—๋Ÿฌ ์ฒ˜๋ฆฌ ๋ฐฉ๋ฒ•async/await ๋ฌธ๋ฒ•์ด๋ž€  ๐Ÿ“Œ ๋ฌด์—‡์„ ๊ณต๋ถ€ํ–ˆ๋Š”์ง€๋Š” ์•„๋ž˜ ๊นƒํ—ˆ๋ธŒ ์ฃผ์†Œ์— ํ›จ์”ฌ ๋” ์ž์„ธํžˆ ๊ธฐ๋กํ•ด๋‘์—ˆ์Šต๋‹ˆ๋‹ค.๋งํฌ ๋ฐ”๋กœ๊ฐ€๊ธฐ ๐Ÿ‘‰ ๐Ÿ’ป CodeSoom ๋ฆฌ์—‘ํŠธ 11๊ธฐ - ํ•™์Šต ๋‚ด์šฉ ์ •๋ฆฌ ๋ฐ ํšŒ๊ณ ํšŒ๊ณ  ๋ฐ ๋Š๋‚€์ ์†”์งํ•œ ๊ณ ๋ฐฑ์„ ํ•˜์ž๋ฉด.. ์ด๋ฒˆ ์ฃผ๋Š” ํšŒ๊ณ ๋ฅผ ํ•  ๊ฒƒ์ด ๋ณ„๋กœ ์—†๋‹ค.์™œ๋ƒํ•˜๋ฉด ์ด๋ฒˆ ์ฃผ๋Š” ์ฝ”๋“œ์ˆจ ๊ต์œก์— ์‹œ๊ฐ„์„ ๊ฑฐ์˜ ํˆฌ์žํ•˜์ง€ ๋ชปํ–ˆ๊ธฐ ๋•Œ๋ฌธ์ด๋‹ค.๊ทธ๋ž˜์„œ ์ด๋ฒˆ ํšŒ๊ณ ๋Š” ๋‚ด๊ฐ€ ์‹คํŒจํ•œ ์ด์œ , ์Šค์Šค๋กœ์— ๋Œ€ํ•œ ๋ฐ˜์„ฑ์ด ์ฃผ๋ฅผ ์ด๋ฃฐ ๊ฒƒ ๊ฐ™๋‹ค. ์ด๋ฒˆ ์ฃผ ์ฝ”๋“œ์ˆจ ๊ณต๋ถ€๋ฅผ ๋ณ„๋กœ ํ•˜์ง€ ๋ชปํ•œ ์ด์œ ๋ฅผ ์ƒ๊ฐํ•ด๋ณด๋‹ˆ, ์—ฌ๋Ÿฌ ๊ฐ€์ง€๊ฐ€ ์žˆ์—ˆ์ง€๋งŒ,..

    ์ฝ”๋“œ์ˆจ(CodeSoom) ๋ฆฌ์—‘ํŠธ 11๊ธฐ 4์ฃผ์ฐจ ํšŒ๊ณ 

    ์ฝ”๋“œ์ˆจ(CodeSoom) ๋ฆฌ์—‘ํŠธ 11๊ธฐ 4์ฃผ์ฐจ ํšŒ๊ณ 

    ํ•™์Šตํ•œ ๊ฒƒํ…Œ์ŠคํŠธ ์ฝ”๋“œ ์ถ”๊ฐ€ ์‹ค์ŠตToDo์•ฑ (์ง€๋‚œ ์ฃผ ๊ณผ์ œ) ํ…Œ์ŠคํŠธ ์ฝ”๋“œ ์ฒ˜์Œ๋ถ€ํ„ฐ ํ˜ผ์ž ํž˜์œผ๋กœ ๋‹ค์‹œ ์ž‘์„ฑํ•ด๋ณด๊ธฐBDD ์Šคํƒ€์ผ (describe - context- it) ์‹ค์Šต Flux ์•„ํ‚คํ…์ฒ˜Flux Architecture ๊ฐœ๋… (๋‹จ๋ฐฉํ–ฅ์œผ๋กœ ๋ฐ์ดํ„ฐ ํ๋ฆ„์„ ๊ด€๋ฆฌํ•˜๋Š” ํŒจํ„ด)[Action] -> [Dispatcher] -> [Store] -> [View][View] -> [Action] -> [Dispatcher] ReduxRedux ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ž€? (์ƒํƒœ ๊ด€๋ฆฌ)Redux์˜ 3๊ฐ€์ง€ ์›์น™Redux์˜ ๋™์ž‘ ํ๋ฆ„acton, dispatch,reducer, store, subscribe, getState, render ๊ฐ๊ฐ์˜ ์—ญํ• Presentational Components, Container ComponentsProvi..

    ์ฝ”๋“œ์ˆจ(CodeSoom) ๋ฆฌ์—‘ํŠธ 11๊ธฐ 3์ฃผ์ฐจ ํšŒ๊ณ 

    ์ฝ”๋“œ์ˆจ(CodeSoom) ๋ฆฌ์—‘ํŠธ 11๊ธฐ 3์ฃผ์ฐจ ํšŒ๊ณ 

    ํ•™์Šตํ•œ ๊ฒƒ2์ฃผ์ฐจ ๋ณต์Šต (์ฝ”๋“œ ์ดํ•ด ์œ„์ฃผ)์ปดํฌ๋„ŒํŠธ ์ž‘์„ฑ ๋ฐ ๋ถ„๋ฆฌ ์—ฐ์ŠตSpecial Props Warning ๋ฌธ์ œ์— ๋Œ€ํ•œ ๊ณ ์ฐฐ์ง€๋‚œ ์ฃผ 2๋ฒˆ์งธ ๊ณผ์ œ (๊ฐ„๋‹จํ•œ Todo App ๋งŒ๋“ค๊ธฐ) ์ฝ”๋“œ ์ดํ•ดํ•˜๊ธฐ๊ฐ์ฒด ๋งค๊ฐœ๋ณ€์ˆ˜ ๊ตฌ์กฐ ๋ถ„ํ•ด ํ• ๋‹น ๋ฐฉ๋ฒ•, ...state ๊ตฌ๋ฌธ ํ•™์Šต TDD ๊ด€๋ จ ๊ฐœ๋… ํ•™์ŠตJest์™€ RTL (React Testing Library)์˜ ์—ญํ• ๋‹จ์œ„ ํ…Œ์ŠคํŠธ์™€ TDD๋ž€ ๋ฌด์—‡์ธ๊ฐ€TDD์˜ ๋ฃฐ๊ณผ TDD ์‚ฌ์ดํดJest ๋‹จ์–ธ๋ฌธ (Assertion) ๊ณผ ๊ตฌ์กฐ (expect ๋งค์„œ๋“œ + Matcher)Matcher์˜ ์ข…๋ฅ˜์™€ Jest DOMํ…Œ์ŠคํŠธ์˜ ์œ ํ˜• (์œ ๋‹› ํ…Œ์ŠคํŠธ, ๊ธฐ๋Šฅ ํ…Œ์ŠคํŠธ, ํ†ตํ•ฉ ํ…Œ์ŠคํŠธ, E2E ํ…Œ์ŠคํŠธ)์œ ๋‹› ํ…Œ์ŠคํŠธ์™€ ๊ธฐ๋Šฅ ํ…Œ์ŠคํŠธ์˜ ์žฅ๋‹จ์ ํ…Œ์ŠคํŠธ ์ฝ”๋“œ ์ž‘์„ฑ ์Šคํƒ€์ผ - BDD ํ…Œ์ŠคํŠธ ์ฝ”๋“œ ์ž‘์„ฑ ์‹ค์Šตํ…Œ์ŠคํŠธ ์ฝ”๋“œ ๋ฌธ๋ฒ• ๊ณต๋ถ€์ปดํฌ..

    ์ฝ”๋“œ์ˆจ(CodeSoom) ๋ฆฌ์—‘ํŠธ 11๊ธฐ 2์ฃผ์ฐจ ํšŒ๊ณ 

    ํ•™์Šตํ•œ ๊ฒƒ1์ฃผ์ฐจ ๋ณต์Šต (์ฝ”๋“œ ์ดํ•ด ์œ„์ฃผ)createElement ํ•จ์ˆ˜๋ฅผ ์ง์ ‘ ๊ตฌํ˜„ํ•˜๋Š” ๊ณผ์ •๋ถ€ํ„ฐ ๋ณต์Šต1์ฃผ์ฐจ ๊ณผ์ œ ๋ณต์Šต (๋‹ค์‹œ ๊ตฌํ˜„ํ•ด๋ณด๊ธฐ)๋…ผ๋ฆฌ์—ฐ์‚ฐ์ž || ์ด JavaScript์—์„œ ๋™์ž‘ํ•˜๋Š” ๋ฐฉ๋ฒ•์ค‘์ฒฉ if / else๋ฌธ์„ ํ”ผํ•˜๊ธฐ ์œ„ํ•œ Guard Clause ํ•™์Šต React ํ•™์ŠตReact ํ”„๋ ˆ์ž„์›Œํฌ๊ฐ€ ํƒ„์ƒํ•œ ๋ฐฐ๊ฒฝReact์˜ ํ•ต์‹ฌ ๊ฐœ๋…ReactDOM๊ณผ ๊ฐ€์ƒ DOM์ปดํฌ๋„ŒํŠธ์˜ ๊ฐœ๋…์ปดํฌ๋„ŒํŠธ ํ•ฉ์„ฑ, ์ปดํฌ๋„ŒํŠธ ๋ถ„๋ฆฌ (๊ด€์‹ฌ์‚ฌ์˜ ๋ถ„๋ฆฌ)๋ฆฌ์•กํŠธ Hook, useState์ปดํฌ๋„ŒํŠธ์˜ 'key' ์†์„ฑ Etc. webpack์— ์„œ๋ฒ„๋ฅผ ๋„์šธ ์‹œ ๊ฒฝ๋กœ ์„ค์ •์„ ๋ฐ”๊พธ๋Š” ๋ฐฉ๋ฒ• (index.js=>index.jsx) ๐Ÿ“Œ ๋ฌด์—‡์„ ๊ณต๋ถ€ํ–ˆ๋Š”์ง€๋Š” ์•„๋ž˜ ๊นƒํ—ˆ๋ธŒ ์ฃผ์†Œ์— ํ›จ์”ฌ ๋” ์ž์„ธํžˆ ๊ธฐ๋กํ•ด๋‘์—ˆ์Šต๋‹ˆ๋‹ค.๋งํฌ ๋ฐ”๋กœ๊ฐ€๊ธฐ ๐Ÿ‘‰ ๐Ÿ’ป CodeSoom ๋ฆฌ์—‘ํŠธ 11๊ธฐ..

    ์ฝ”๋“œ์ˆจ(CodeSoom) ๋ฆฌ์—‘ํŠธ 11๊ธฐ 1์ฃผ์ฐจ ํšŒ๊ณ 

    ์ฝ”๋“œ์ˆจ(CodeSoom) ๋ฆฌ์—‘ํŠธ 11๊ธฐ 1์ฃผ์ฐจ ํšŒ๊ณ 

    ํ•™์Šตํ•œ ๊ฒƒ๊ฐœ๋ฐœํ™˜๊ฒฝ ๊ตฌ์ถ•Node.JS, NPM ์„ค์น˜ ๋ฐ ์‚ฌ์šฉ ๋ชฉ์  ํ•™์ŠตNPM ๋ช…๋ น์–ด์— ์ต์ˆ™ํ•ด์ง€๊ธฐESLint, Webpack, Babel ์„ค์น˜ ๋ฐ ์ž‘๋™๋ฒ•๊ณผ ๊ฐ๊ฐ์˜ ์‚ฌ์šฉ ๋ชฉ์  ํ•™์Šต JavaScript๋ฅผ ํ™œ์šฉํ•œ Web ๊ฐœ๋ฐœ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ '๊ฐ์ฒด'์— ๋Œ€ํ•ด ํ•™์Šต๊ตฌ์กฐ๋ถ„ํ•ด ํ• ๋‹น, ์ž์ฃผ ์“ฐ์ด๋Š” ๋ฐฐ์—ด ํ•จ์ˆ˜ (map, filter, forEach), ์ „๊ฐœ์—ฐ์‚ฐ์ž ์‚ฌ์šฉ๋ฒ• ํ•™์Šต + ์ต์ˆ™ํ•ด์ง€๊ธฐDOM๊ณผ DOM Tree์˜ ์ดํ•ดJSX์˜ ์ดํ•ด ๊นƒ ์ดํ•ดํ•˜๊ณ  PR ๋ณด๋‚ด๊ธฐ๊นƒ์˜ ๊ฐœ๋… ๋ฐ ์šฉ์–ด ํ•™์Šต (์ปค๋ฐ‹, ๋ธŒ๋žœ์น˜, ์ €์žฅ์†Œ ๋“ฑ)๊นƒ์˜ ๋‹ค์–‘ํ•œ ๋ช…๋ น์–ด ํ•™์Šต + ์‚ฌ์šฉ ์—ฐ์ŠตPull Request ํ›ˆ๋ จ ๐Ÿ“Œ ๋ฌด์—‡์„ ๊ณต๋ถ€ํ–ˆ๋Š”์ง€๋Š” ์•„๋ž˜ ๊นƒํ—ˆ๋ธŒ ์ฃผ์†Œ์— ํ›จ์”ฌ ๋” ์ž์„ธํžˆ ๊ธฐ๋กํ•ด๋‘์—ˆ์Šต๋‹ˆ๋‹ค.๋งํฌ ๋ฐ”๋กœ๊ฐ€๊ธฐ ๐Ÿ‘‰ ๐Ÿ’ป CodeSoom ๋ฆฌ์—‘ํŠธ 11๊ธฐ - ํ•™์Šต ๋‚ด์šฉ ์ •๋ฆฌ ๋ฐ ํšŒ๊ณ ..