๐ ์ด๋ฒ ์ฃผ์ ํ๊ณ ์ ํ๋ ๊ฒ
- [JavaScript] ๊ฐ๋จํ Todo app ๊ตฌํ ๊ณผ์
- [JavaScript] ๋ ธ์ ํด๋ก ์ฝ๋ฉ ํ๋ก์ ํธ
- [JavaScript] ์คํ์ฝํ ์คํธ ES5 ๋ฒ์ ๋ฐํ
- [JavaScript] XMLHttpRequest, Promise, async, await, fetch, history api ๊ฐ์ ๋ณต์ต
- [์ฝ๋ ๋ฆฌ๋ทฐ] ํจ์ํ ํ๋ก๊ทธ๋๋ฐ ๊ณผ์ ์ฝ๋ ๋ฆฌ๋ทฐ
๐ฏ ์ด๋ฒ ์ฃผ์ ์๋ฃํ ๊ฒ
- ์นญ์ฐฌํ ๊ฒ
- ๊ณผ์ ๋ฅผ ์ค์ค๋ก ์ดํดํ ์ฝ๋๋ก(!!) ์ ์๊ฐ์ ์ ์ถํ ๊ฒ
- ๋ชจ๋ฅด๋ ๊ฒ์ ํ์๋คํํ ๋ฌผ์ด๋ณด๋ฉด์ ์ต๋ํ ๊ฐ์๋ฅผ ๋ณด์ง ์๊ณ ํผ์ ๊ตฌํํ๋ ค๊ณ ํ ๊ฒ
- ์คํ์ฝํ ์คํธ๋ฅผ ์ด๋ ์ ๋๋ ์ดํดํ ๊ฒ
- Promise, async, await๊น์ง๋ ์ต๋ํ ์ดํดํ๋ฉฐ ๊ฐ์๋ฅผ ๋ณต์ตํ ๊ฒ
- ๊ฐ์ ๋ฃ๊ณ ์ฝ๋๋ ๋ค์ ํผ์ ์ง๋ณด๋ ์์ผ๋ก ๊ณต๋ถํด์ ์ต๋ํ ์ฝ๋๋ฅผ ์ง์ ์์ฑํ ์ ์๊ฒ๋ ๊ณต๋ถํ ๊ฒ
- ํจ์ํ ํ๋ก๊ทธ๋๋ฐ์ ์ ์ดํดํ ๊ฑด ์๋์ง๋ง ๋ ์ ์๋ฏธํ ์ฝ๋ ๋ฆฌ๋ทฐ๋ฅผ ํ๋ ค๊ณ ๋ ธ๋ ฅํ ๊ฒ
- ์์ฌ์ ๋ ๊ฒ
- ๊ฐ์ ๋ณต์ต์ ๋๋ด์ง ๋ชปํ ๊ฒ
- ์์ง ๋ ธ์ ํ๋ก์ ํธ๋ฅผ ์์ํ์ง ๋ชปํ ๊ฒ
- ์คํ์ฝํ ์คํธ ๊ฐ๋ ์์ ์์ง๋ ๊ถ๊ธํ ๋ถ๋ถ์ด ๋ง์๋ฐ ์ ๋๋ก ์ ๋ฆฌํ์ง ๋ชปํ ๊ฒ
- ์ค์ ๊ณต๋ถํ๋ ์๊ฐ์ด ๋ณ๋ก ์ ๋๋ ๊ฒ
๐ ๋ค์ ์ฃผ์ ํ ๊ฒ
- [๊ฐ์ธ ํ๋ก์ ํธ] ๋ ธ์ ํด๋ก๋ ํ๋ก์ ํธ ์์ฑ
- [๊ฐ์] ์์ง ๋ชป ๋ค์ ๊ฐ์ ์๊ฐํ๊ธฐ
- [์ฝ๋ ๋ฆฌ๋ทฐ] Todo app ๊ณผ์ ์ฝ๋ ๋ฆฌ๋ทฐ
- [์ฝ๋ฉํ ์คํธ] ์๋ฃ ๋ชปํ ์ฝ๋ฉํ ์คํธ ์ค์ต ๋๋ด๊ธฐ
- [Javascript] ์คํ์ฝํ ์คํธ ES6 ๋ฒ์ ๊ฐ๋ ์ ๋ฆฌ
๐ Reflection
- ์ผ์์ผ์ ๊ฐ์
- fetch๋ history api๊น์ง ๋ค ๋๋ด์ ํ๋ ๋ค์ง์ ๋ฌผ๊ฑฐํ์ด ๋์๊ณ ... XMLHttpRequest๋ก GET ํต์ ํ๋ ํจ์๋ฅผ Promise, async, await์ผ๋ก ๋ฆฌํฉํ ๋งํด๋ณด๋ฉด์ ๋น๋๊ธฐ ํต์ ์ ์ดํดํ ๊ฒ์ผ๋ก ๋ง์กฑํด์ผ๊ฒ ๋ค.
- ์ง์ง ์ชฝํ๋ฆฐ ๋ง์ด์ง๋ง ๊ทธ๋์ async๋ await์ ๋์ฒด ์ด๋์ ๋ถ์ฌ์ผ ํ๋ ๊ฑด์ง ๋ชฐ๋๋ค. ๊ทธ๋ฅ ๋์ถฉ ์๋ฌด๋ฐ๋ ๋ถ์๋๋ฐ(;;;) ์ด๋ฒ ๊ธฐํ์ ์๊ฒ ๋๋ค.
- ๋น๋๊ธฐ ํต์ ์ ์ด์ฉํด์ todolist ๋ชฉ๋ก๊ณผ ๊ฐ todo์ ์ฐ๊ฒฐ๋ ๋๊ธ ๋ชฉ๋ก์ ๋ถ๋ฌ์ค๋ ์ฐ์ต์ ํ๋๋ฐ ์์ง๋ ์๋ก ๋ค๋ฅธ ์ปดํฌ๋ํธ ๊ฐ์ ๋ฐ์ดํฐ๋ฅผ ์ฃผ๊ณ ๋ฐ์ ๋ ์ด๋ป๊ฒ ์ฒ๋ฆฌํด์ผํ๋์ง ์ ์ดํด๋ฅผ ๋ชปํ ๊ฒ ๊ฐ๋ค. ๋ ์ฐ์ตํด๋ด์ผ ํ ๋ฏ.
- ์์์ผ ์ฝ์ดํ์ ์์ ์ ๊น์ง fetch๋ฅผ ๋ค ๋ณต์ตํ๊ณ .. ๊ฐ๋ฅํ๋ฉด history api๋ ๋ฃ๊ณ ... ๊ฐ๋ฅํ๋ฉด todo app ๊ฐ์๊น์ง... (๋ถ๊ฐ๋ฅ)
- ๋ฐฑ๋ง๋ ๋ง์ 30๋ถ ๊ฑท๊ธฐ ์ด๋์ ํ๋ค. ์์ธ ๊ต์ ์ ์ํด์ ์์ง์๊ฐ๋ฝ์ ์๋ก ๊ฐ๊ฒ ํ๊ณ ํ์ ์๋ค๋ก ์ต๋ํ ํฌ๊ฒ ํ๋ค๋ฉฐ ๊ฑธ์๋๋ ๋ค๋ฆฌ๋ณด๋ค ํ์ด ์ํ๋ค...
- ์ ์๋ฆฌ์ ๋์์ ๋ณ์๋ณ ์๊ฐ์ ํ๋ค๊ฐ ๋๋ ๋๊ฒฝ์ด๋ผ๋ ๊ฐ์ ์ ์งํฌ๋ก ํ์ถํ๋ ์ฌ๋ ๊ฐ๋ค๊ณ ์๊ฐํ๋ค. ๊ทธ๊ฑธ๋ก ์ธ๋ฐ์๋ ๊ฐ์ ์ ๋ง์ด ์๋นํ๋ ๊ฒ ๊ฐ๋ค. ์ ๋ง ๋๋ก ์ด๊ธฐ ํผ๊ณคํ๋ค. ๋จ์ด ์ํ๋ ๊ฑด ์ง์ฌ์ผ๋ก ์นญ์ฐฌํด์ฃผ๊ณ ๋๋ ๋ณธ๋ฐ๊ธฐ ์ํด์ ๋ ธ๋ ฅํ๋ ๊ทธ๋ฐ ์ฟจํ ์ธ๊ฐ์ด ๋ ์๋ ์๋ ๊ฒ์ธ๊ฐ?
- Todo app ๊ณผ์ ์ ๋ํ ๊ฐ์
- ์ด์ TIL์ ๊ฑฐ์ ์ ์๋ค.
- CS ๊ธฐ์ด ์คํฐ๋์ ๋ํ ๊ฐ์
- ๋ง์ CS๋ ๊ฑด๋ค์ง๋ ๋ชปํ๊ณ Javascript ์ค์ ๊ฐ๋ ์ ๋๋ง ๊ณต๋ถํ๊ณ ์๋๋ฐ 2์ฃผ์งธ ์ฃผ์ ๋ฅผ ์คํ์ฝํ ์คํธ๋ก ์ก์๋๋ฐ ์์ง๋ ์ดํด๋ฅผ ๋ชปํ๋ค. ES3 ๋ฒ์ ์ ๊ฐ๋ ์ค๋ช ์ด ๋๋ฆฌ ์๋ ค์ ธ ์๋๋ฐ, ES5, ES6์์ ๊ฐ๋ ์ด ์กฐ๊ธ์ฉ ๋ฌ๋ผ์ง๋ฉด์ ๋ชจ๋ ๊ฒ์ด ์งฌ๋ฝ์ด ๋์ด์ ์ ํํ ๊ฐ๋ ์ด ์ด๋ป๊ฒ ๋๋์ง ์ ์๊ฐ ์๋ค... ๋๋ฌด ์ฐ์ฐํ๋ค... ์ด์ฉ๋ค ์ด๋ ๊ฒ ์คํ์ฝํ ์คํธ ์ง์ฐฉ๋ ๊ฐ ๋์๋์ง... ๊ทธ๋๋ ์ด๋๋ก ํฌ๊ธฐํ ์ ์๋ค... ํ๋ก์ ํธ๋ง ๋๋ด๋ฉด ์ง์ง ๋ณต์ตํด์ ์ํฐํด๋ ์จ์ผ์ง...
- ๋ฐํ ๋ชปํด๋ ๋๋ฌด ๋ชปํ๋๋ฏ... ๋ ธ๋ ฅ ์ข ํ์...
- ๊ฐ์๋ฅผ ์ ๋ ์ ๋ ๋ฃ์
- ๊ฐ์๋ฅผ ์ ๋๋ก ์ดํดํ๋ฉด์ ๋ค์ผ๋ ค๊ณ ํ๋ค ๋ณด๋๊น ์ ์ง๋๋ฅผ ๋ชป ๋ฐ๋ผ ๊ฐ๊ฒ ๋๋ค. (์์์ผ๊น์ง ์ฝ๋ ๋ฆฌ๋ทฐ๋ ์คํ์ฝํ ์คํธ ๊ณต๋ถ๋ง ํ๋ ๊ฒ๋ ํ ๋ชซ ํ๋ค...) ์ง๋๋ฅผ ๋ฐ๋ฆฌ๋๊น ๋ค๋ฅธ ์ฌ๋๋ค์ด ์ฌ๋ฆฌ๋ ์ง๋ฌธ ๋ด์ฉ์ ์ ํ ์ดํด ๋ชปํ๊ฒ ๋๋ค(ใ ใ ) ์ผ๋ฅธ ๊ฐ์ ๋ค ๋ณต์ตํ๊ณ ๋ค์๋ถํด ์ง์ง ์ ๋ ์ ๋ ๋ฃ๋๋ก ํ์...
- ์ฝ๋ ๋ฆฌ๋ทฐ์ ๋ํ ๊ฐ์
- ๋๋ ๊ณผ์ ๋ฅผ ๋ต์ง ๋ถ์ํด์ ๋ด๊ฐ์ง๊ณ ... ์ฝ๋ ๋ฆฌ๋ทฐ๋ฅผ ๋ฐ์ ์ ์์๋๋ฐ ใ ๋ค๋ฅธ ์ฌ๋๋ค ์ฝ๋ ๋ฆฌ๋ทฐ๋ณด๋ฉด์ ๋ง์ด ๋ฐฐ์ ๋ ๊ฒ ๊ฐ๋ค. ํจ์ํ ํ๋ก๊ทธ๋๋ฐ์ด๋ ๋์ฒด ๋ญ๊ฐ ์ถ์๋๋ฐ ๋ค๋ฅธ ์ฌ๋๋ค ์ฝ๋ ์ฝ๋ฉํธ ๋ณด๋ฉด์ reduce ์ ์ผ๋ก ์๊ฐํ๋ ๊ฒ ์ค์ํ๊ตฐ... ์ดํฐ๋ฌ๋ธ, ์ดํฐ๋ ์ดํฐ ๊ฐ๋ ์ ์ ํํ ์ก์์ผ๊ฒ ๊ตฐ... ๊ณต์ ์ํ๋ฅผ ์ ์ฅํ๋ ๋ณ์๋ ์ฌ์ฉ์ ์ง์ํด์ผ๊ฒ ๊ตฐ... ๋ฑ๋ฑ์ ๊ฒ๋ค์ ๊นจ๋ฌ์ ์ ์์๋ค. ๋๋ ์ธ์ ๊น์ง ์ด๋ ๊ฒ ๋ฐ์ ๋จน์ผ๋ ค๊ณ ๋ง ํ ๊ฒ์ธ์ง ์ข ๊ฑฑ์ ๋๊ธด ํ์ง๋ง ๊ทธ๋๋ ์ฝ๋ ๋ฆฌ๋ทฐ ํ๊ธฐ ์ ์ ๋นํด ํจ์ํ ํ๋ก๊ทธ๋๋ฐ์ ์กฐ๊ธ์ด๋๋ง ๋ ์ดํดํ ์ ์๊ฒ ๋ ๊ฒ ๊ฐ์์ ์ข์๋ค.
'TIL' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
[TIL] 20210904 (0) | 2021.09.05 |
---|---|
[TIL] 20210903 (2) | 2021.09.03 |
[TIL] 20210828 (2) | 2021.08.29 |
[TIL] 20210826 (2) | 2021.08.27 |
[WIL] 20210820 3์ฃผ์ฐจ ํ๊ณ (8) | 2021.08.20 |