The journey to becoming a developer

My future is created by what I do today, not tomorrow.

What I learned/CodeSquad Log

CodeSquad Day 28 : Front-end Week 1

Millie 2022. 2. 17. 00:55

 

CodeSquad๐Ÿ”นDay 28

PR & Feedback & Git Rebase

12์‹œ๊นŒ์ง€ step1์„ ์™„๋ฃŒํ•˜๊ณ , Pull Request๋ฅผ ํ•ด์•ผ ํ–ˆ๋‹ค. ์–ด์ œ ๊ฑฐ์˜ ๋‹ค ํ–ˆ์–ด์„œ ํ•™์Šต์„ ์กฐ๊ธˆ ํ•˜๊ณ , ์•ฝ๊ฐ„์˜ ๋‹ค๋ฅธ ์ž๋ฃŒ ํƒ๋ฐฉ๋„ ํ•ด๋ณด๋‹ค๊ฐ€ PR์„ ๋‚ ๋ ธ๋‹ค. ํฌ๋กฑ์€ ํ”ผ๋“œ๋ฐฑ์ด ์ •๋ง ๋นจ๋ž๋‹ค. ํด๋ž˜์Šค ๋„ค์ด๋ฐ, ์ปค๋ฐ‹ ๋“ฑ์— ๋Œ€ํ•œ ํ”ผ๋“œ๋ฐฑ์„ ๋ฐ›์•˜๋‹ค.

๊ทธ ๋‹ค์Œ ํ•ด์•ผ ํ•  ์ผ์€ ๊ธฐ์กด step1 ๋ธŒ๋žœ์น˜๋Š” ์‚ญ์ œํ•˜๊ณ  upstream์—์„œ ๋กœ์ปฌ ์ €์žฅ์†Œ๋กœ fetch๋ฅผ ํ•ด ์˜จ ํ›„ rebase๋ฅผ ํ•ด์„œ ๊ธฐ์ค€์ ์„ ์žก๊ณ  step2๋ฅผ ์‹œ์ž‘ํ•˜๋Š” ๊ฒƒ์ด์—ˆ๋‹ค. ์•„์ง rebase๋ฅผ ๊ผผ๊ผผํ•˜๊ฒŒ ๊ณต๋ถ€ํ•˜์ง€ ์•Š์•„์„œ ์ด ๋ถ€๋ถ„์„ ๊ผญ ์‹œ๊ฐ„์„ ํˆฌ์žํ•ด ์ดํ•ดํ•ด์•ผ๊ฒ ๋‹ค. ๊ทธ๋ฃน ๋ฆฌ๋ทฐ์—์„œ๋„ git ๊ด€๋ จ ์ด์•ผ๊ธฐ๊ฐ€ ๋งŽ์ด ๋‚˜์™”๋‹ค.

 

Mission 2!

๋ณธ๊ฒฉ์ ์ธ ๋ฏธ์…˜ 2๋ฅผ ์‹œ์ž‘ํ–ˆ๋‹ค. ์ด์ œ JavaScript๋ฅผ ํ•  ์‹œ๊ฐ„. ํƒญ์„ ๋ˆŒ๋ €์„ ๋•Œ ์ปจํ…์ธ ๊ฐ€ ๋ฐ”๋€Œ์–ด์•ผ ํ–ˆ๋‹ค. ๋‚˜๋Š” json ํŒŒ์ผ์„ ๋งŒ๋“ค์–ด์„œ ์—ฌ๊ธฐ์— mock data๋ฅผ ๋„ฃ๊ณ , fetch๋ฅผ ์‚ฌ์šฉํ•ด์„œ ๋น„๋™๊ธฐ๋กœ ๋ฐ์ดํ„ฐ๋ฅผ ๊ฐ€์ ธ์™€์„œ ๊ทธ๋ ค์ฃผ๋Š” ์‹์œผ๋กœ ํ–ˆ๋‹ค. ์ด ๋ฐฉ์‹๋„ ๊ดœ์ฐฎ์€์ง€๋Š” ๋ฆฌ๋ทฐ๋ฅผ ๋ฐ›์•„ ๋ด์•ผ ์•Œ ๊ฒƒ ๊ฐ™๋‹ค. ์ผ๋‹จ์€ ์ด๋Ÿฐ ์‹์œผ๋กœ ํ•ด ๋ณด๋ ค๊ณ  ํ•œ๋‹ค. ํ˜„์žฌ ์š”์ผ ํƒญ๋งŒ ์™„๋ฃŒํ–ˆ๋‹ค.

์•„์ง ๋น„๋™๊ธฐ, event bubbling ๋“ฑ์— ๋Œ€ํ•ด ์„ค๋ช…ํ•˜๋ผ๊ณ  ํ•˜๋ฉด ๋ฏธํกํ•ด์„œ ์ด ๋ถ€๋ถ„๋„ ๋”ฐ๋กœ ์‹œ๊ฐ„์„ ๋“ค์—ฌ์„œ ์ž˜ ์„ค๋ช…ํ•  ์ˆ˜ ์žˆ์„ ์ •๋„๋กœ ๊ณต๋ถ€ํ•ด์•ผ๊ฒ ๋‹ค.

 

Web Browser & DOM

๋ฐค์—๋Š” Deep Dive ์ฑ…์„ ์ฝ์œผ๋ฉด์„œ ๋ธŒ๋ผ์šฐ์ €์˜ ๋ Œ๋”๋ง ๊ณผ์ •์„ ํ•™์Šตํ–ˆ๋‹ค. ์˜์ƒ์œผ๋กœ ๋ช‡ ๋ฒˆ ์Šค์ณ๊ฐ€๋“ฏ์ด ๋“ค์—ˆ๋˜ ๊ฒƒ๋“ค์ด ์ฑ…์„ ๊ผผ๊ผผํžˆ ์ฝ์œผ๋‹ˆ ์ž˜ ๋“ค์–ด์™”๋‹ค.

DOM ๋ถ€๋ถ„์€ ๋‹ค ์ฝ์ง„ ๋ชปํ•˜๊ณ  ์ผ๋ถ€๋งŒ ์ฝ์–ด์„œ ๋‚˜๋จธ์ง€ ๋ถ€๋ถ„์€ ๋‚ด์ผ ์ถ”๊ฐ€์ ์œผ๋กœ ์ฝ์„ ์˜ˆ์ •.

๊ฐ„๋งŒ์— ์ฑ…์„ ์ง‘์ค‘ํ•ด์„œ ์ฝ์—ˆ๋”๋‹ˆ ์žฌ๋ฏธ๋„ ์žˆ์—ˆ๋‹ค. ์ด๋ฏธ ์•ฝ๊ฐ„์€ ์•Œ์•˜๋˜, ๊ทธ๋Ÿฐ๋ฐ ์• ๋งคํ•˜๊ฒŒ ์•Œ์•˜๋˜ ๊ฒƒ๋“ค์ด ๋จธ๋ฆฟ์†์— ์ž๋ฆฌ์žกํžˆ๋Š” ๋Š๋‚Œ์ด ๋“ค์–ด์„œ ๋” ๊ทธ๋žฌ๋˜ ๊ฒƒ์ผ ์ˆ˜๋„.

์‚ฌ์‹ค ๋ฐค์— ๋ฐฐํƒˆ์ด ๊ฐ‘์ž๊ธฐ ๋‚˜์„œ ๋ฐฐ๊ฐ€ ์•„ํŒ ๋Š”๋ฐ๋„ ์ฐธ๊ณ  ์ฝ์€ ๋ณด๋žŒ์ด ์žˆ๋‹ค. ์ง€๊ธˆ์€ ์ข€ ๋‚˜์•„์ ธ์„œ ์ž๊ธฐ ์ „๊นŒ์ง€ ์ข€๋งŒ ๋” ์ฝ์–ด๋ณด๋ ค๊ณ  ํ•œ๋‹ค.

'What I learned > CodeSquad Log' ์นดํ…Œ๊ณ ๋ฆฌ์˜ ๋‹ค๋ฅธ ๊ธ€

CodeSquad Day 30 : Front-end Week 1  (0) 2022.02.19
CodeSquad Day 29 : Front-end Week 1  (0) 2022.02.18
CodeSquad Day 27 : Front-end Week 1  (0) 2022.02.16
CodeSquad Day 26 : Front-end Week 1  (0) 2022.02.15
CodeSquad Day 25 : CS10 (10/10)  (0) 2022.02.12