๐๊ณต๋ถ72 ํ๋ก ํธ์๋์ธ ๋ด๊ฐ ์๋ฒฝ2์์ ์ถ๊ทผํด์ ์๋ฒ๊ต์ฒด๋ฅผ? ๋ค ๊ทธ๊ฒ ์ค์ ๋ก ์ผ์ด๋ฌ์ต๋๋ค. โ ์ฐ๋ฆฌ๋ ์ ์๋ฒ๊ต์ฒด๋ฅผ ํ๊ฒ ๋์๋๊ฐ? ํ์ฌ ์ฌ์ง์ค์ธ ํ์ฌ๋ ํธ๋ํฝ์ด ์ผ์ ํ์ง ์๋ค. ํน์ ์ด๋ฒคํธ๊ฐ ์์ ๋์๋ง ํ ๋ชฐ๋ฆฌ๊ณ , ๊ทธ ์ธ ์๊ฐ์๋ ์ ์ ํ ํธ์ด๋ค. 2022๋ ์ด๊น์ง๋ ๊ณ ์ ์ธ์คํด์ค๋ฅผ ์ฌ์ฉํ๊ณ ์์๋ค. ๊ทธ๋ฌ๋ค๊ฐ ์ด๋ ๊ฒ ์ฌ๋์ด ๋ชฐ๋ฆฌ๊ฒ ๋๋ฉด... ์์ ์ฃฝ์ด๋ฒ๋ ค์ ์~๋ฌด๊ฒ๋ ๋ชปํ๋ ๋ํ์ด์๊ฐ ๋ฐ์ํ๋ค. ๊ทธ๋์ ์คํ ์ค์ผ์ผ๋ง์ด ๋๋ serverless v1์ผ๋ก ๋ณ๊ฒฝ์ ํ์๋ค. (๊ทธ ๋์๋ ์ ๊ฒ์ค ํ๋ฉด์ ๋ง๋ค์์์ง) ๊ทธ๋ฐ๋ฐ๋! ์ด๋ฒคํธ๊ฐ ์์ ๋ RDS์ ์ปค๋ฅ์ ํ์ด ๊ฝ์ฐจ๊ณ , CPU๊ฐ ํฐ์ง๋ค. serverless v2๋ RDS Proxy๋ ์ ์ฉ ๊ฐ๋ฅํ๊ณ , Reader/Writer๋ ๋๋ ์ ์๊ธฐ ๋๋ฌธ์ ์ฐ๋ฆฌ๋ v2๋ก ๋ณ๊ฒฝ์ ํ๊ธฐ๋ก ๊ฒฐ์ฌํ๊ฒ ๋๋ค... โ ์ด๋ป๊ฒ ๋ณ๊ฒฝ์ ํ๋๊ฐ? (0.. 2022. 10. 1. [JavaScript] JS์ ๋ฐ๋ณต๋ฌธ ๊ทธ๋์ ๋ฐฐ์ด ๊ฒ๋ค์ด ์์๋ค... ๊ทธ๋ฅ for๋ฌธ์ ์จ๋ ๋๋ ์ํฉ์ ๊ตณ์ด๊ตณ์ด map์ ์ฌ์ฉํ ๋๋ ๋ฐ๋ณด๋ค ๊ทธ๋์ ์์ ์ ์ ๋ฆฌํด๋ ๋ฐ๋ณต๋ฌธ์ ๊ฐ์ ธ์๋ค... ๐ ๋์ค ์์ฝ ๊ฐ์ฒด ์ํ ํ ๋ → Object.keys, Object.values, Object.entries ๋ฐฐ์ด ์ํ ํ ๋ → forEach, map, filter, reduce ๋ฑ๋ฑ โ for for (let i = 0; i < 10; i++) { console.log(i); } ๋๋์๊ณ ๋๋์๊ณ ๋ชจ๋๊ฐ ์๋ ๊ทธ for๋ฌธ โ for in const obj = { name: '๊น์ ํ', age: '4' } for (const key in obj) { console.log(`${key} : ${obj[key]}`); } // name : ๊น์ ํ // .. 2021. 11. 21. [React] ๋ฆฌ์กํธ์์ ์ useState๋ฅผ ์ฐ๋ผ๊ณ ํ ๊น ์ฝ๋๋ฆฌ๋ทฐ๋ฅผ ๋ฐ์๋๋ฐ, ์์ฒญ ์์ธํด์ ๋๋๋ค! ์ญ์ ํด๋ด์ผ ์๋ ๊ฒ๋ค์ด ์์ฃผ ๋ง๋ค๋ ๊ฒ์ ๊นจ๋ซ๋ ์์ฆ์ด๋ค๐ ๐ค ๊ทธ๋ฅ ๋ณ์ ๋ง๊ณ state๋ฅผ ์ฐ๋ ๊ฐ์ฅ ํฐ ์ด์ state๊ฐ ๋ณ๊ฒฝ ๋ ๋ ๊ด๋ จ๋ DOM์ ๋ค์ ๋ ๋๋ง ๋๊ฒ ํด์ผ ํ๋ค๋ฉด, state๋ฅผ ์จ์ผ ํ๋ค! → SPA๋ฅผ ์ฌ์ฉํ๊ณ ์ถ์ผ๋ฉด state๋ฅผ ์จ์ผํ๋ค ์๋ํ๋ฉด ๋ฆฌ์กํธ๋ state์ ์์ ์ด ์ผ์ด๋๋ฉด state๊ฐ ํฌํจ๋ DOM์ ์ฌ๋ ๋๋ง ํด์ฃผ๊ธฐ ๋๋ฌธ์ธ๋ฐ.... ๊ทธ๊ฑธ ์๊ธฐ ์ํด์๋ ๋ฆฌ์กํธ์ Life cycle์ ์์์ผ ํ๋ค๐คฏ #๊ฐ๋ณด์๊ณ ๐ค setState๋ง๊ณ state๋ฅผ ์ง์ ๋ณ๊ฒฝํด์ฃผ๋ฉด ์ ํ๋ฉด ๊ฐฑ์ ์ด ์๋ ๊น? ๋ฆฌ์กํธ์ ์ปดํฌ๋ํธ๋ Mount ์ํ์์ ํ๋ฒ render() ๋ฅผ ์คํํ๊ณ , ํ์๋ Update ์ํ์ ์ง์ ํ์ฌ shouldComponentUpdate.. 2021. 10. 26. [JavaScript] ๋๋ฐ์ด์ค(Debounce) vs ์ค๋กํ(Throttle) โ ๊ณตํต์ ์งง์ ์๊ฐ์ ์ฌ๋ฌ๋ฒ ๋ฐ์ํ๋ ์ด๋ฒคํธ๋ฅผ ๊ทธ๋ฃนํํด์, ๊ณผ๋ํ ์ด๋ฒคํธ ํธ์ถ์ ๋ฐฉ์ง ์์ฒญ๋๊ฒ ๋น ๋ฅธ์๋๋ก ํด๋ฆญ์ ์ฌ๋ฌ๋ฒ ํ๊ธฐ ๊ฒ์์ฐฝ์ ํค๋ณด๋๋ก ์ ๋ ฅํ๊ธฐ ์คํฌ๋กค๋ฐ๋ฅผ ์์๋๋ก ์ญ์ญ ์์ง์ด๊ธฐ ์ฐฝ์ ๋ฆฌ์ฌ์ด์งํ๊ธฐ ๋ฑ๋ฑ... โ ๋๋ฐ์ด์ค (Debounce) ์์ฒญ์ด ๋ค์ด์ค๋ฉด ์ผ์ ์๊ฐ์ ๊ธฐ๋ค๋ฆฐ ํ ์์ฒญ์ ์ํํ๋๋ฐ, ๊ธฐ๋ค๋ฆฌ๋ ๋์ ๊ฐ์ ์์ฒญ์ด ์ถ๊ฐ๋ก ๋ค์ด์ค๋ฉด ์ด์ ์์ฒญ์ ์ทจ์๋จ ์ฐ์ด์ด์ ํธ์ถ๋๋ ํจ์ ์ค ๊ฐ์ฅ ๋ง์ง๋ง(๋๋ ๊ฐ์ฅ ์ฒ์)๋ง ํธ์ถ ๋๋๋ก ํจ ์ผ์์ด ๊ณ~~~์ ํด๋ฆญํ๋ฉด ํด๋ฆญ์ด ๋ฉ์ถ๋๊น์ง ๊ธฐ๋ค๋ ธ๋ค๊ฐ ๋ฉ์ถ๋ฉด ์คํํจ ๊ทธ๋์ ๋ง์ฝ ๋ฌดํ ์ ๋ ฅ์ ํ๋ฉด ๋ฌดํ ๊ธฐ๋ค๋ฆผ์ ํจ toggle ๋ฒํผ ์ด๋ฒคํธ ๋ฑ์ ์ฃผ๋ฉด ์ข์ function debounce(callback, limit = 100) { let timeout return.. 2021. 10. 12. [JavaScript] var๊ณผ ํธ์ด์คํ โ ํธ์ด์คํ ์ด๋? catName("ํด๋ก์ด"); function catName(name) { console.log("์ ๊ณ ์์ด์ ์ด๋ฆ์ " + name + "์ ๋๋ค"); } /* ๊ฒฐ๊ณผ: "์ ๊ณ ์์ด์ ์ด๋ฆ์ ํด๋ก์ด์ ๋๋ค" */ ํจ์ ์์ ์๋ ์ ์ธ๋ค์ ๋ชจ๋ ๋์ด์ฌ๋ ค์, ํด๋น ํจ์ ์ ํจ ๋ฒ์์ ์ต์๋จ์ ์ ์ธํ๋ ๊ฒ ํจ์ ์ ์ธ๋ง! ๋์ด์ฌ๋ ค์ง (ํ ๋น์โ) //๋ณ์์ ํธ์ด์คํ ์์ console.log(name); // undefined var name = "๊น์ ํ"; //------------------------------- var name; // name๋ณ์๊ฐ ํธ์ด์คํ ๋์ด ์๋จ์ผ๋ก ์ด๋ console.log(name); name = "๊น์ ํ"; //ํจ์์ ํธ์ด์คํ ์์ foo(); foo2(); funct.. 2021. 10. 11. ์ด์ 1 2 3 4 ยทยทยท 15 ๋ค์