๋ชฉ๋ก๋ถ๋ฅ ์ ์ฒด๋ณด๊ธฐ (454)
Bibi's DevLog ๐ค๐
* ์ด ๊ธ์ ์ธํ๋ฐ์์ ์ ๊ณตํ๋ ํธ๋ ์ค๋์ ์ ๋ฃ ๊ฐ์ '์ฝ๊ณ ์์ฐ์ค๋ฝ๊ฒ ๋ฐฐ์๋ณด๋ Javascript ์ ๋ฌธ - ์ฝ๋์ค์ฟผ๋ ๋ง์คํฐ์ฆ ์ฝ์ค ๋ ๋ฒจ1'๋ฅผ ๋ฃ๊ณ ๊ณต๋ถํ๋ฉฐ ์ ๋ฆฌํ ๊ธ์ ๋๋ค. ๊ฐ์ ๋ด์ฉ์ ๋ํด, ์ ๊ฐ ํ๊ธฐํ๊ณ ๊ตฌ๊ธ๋งํ ๋ด์ฉ์ด ์ ๋ฆฌ๋์ด ์์ต๋๋ค. ์ด๋ณด์ธ ์ ๊ฐ ์ดํดํ ๋๋ก ์ ๋ฆฌํ๊ธฐ ๋๋ฌธ์, ๋ถ์ ํํ ๋ด์ฉ์ด ์์ ์ ์์์ ๊ฐ์ํด ์ฃผ์๊ธธ ๋ฐ๋๋๋ค. ๊ฐ์๋ฅผ ๋ฃ๊ณ ๋ด์ฉ์ ์ ๋ฆฌํ ๊ธ์ด๊ธฐ ๋๋ฌธ์ ๋ฌธ์ ๊ฐ ๋์ง ์๋๋ค๋ ์ธํ๋ฐ ์ธก ๋ต๋ณ์ ๋ฐ์ ์ ์ด ์์ผ๋(https://bibi6666667.tistory.com/37), ์ ์๊ถ์ ๋ฌธ์ ๊ฐ ๋๋ค๋ฉด ๋ณดํธ ๋ชจ๋(๋น๊ณต๊ฐ)๋ก ์ ํํ๊ฒ ์ต๋๋ค. [์ค์ต] ๊ณ์ฐ๊ธฐ ๊ตฌํํ๊ธฐ ์ด๋ฒ ์ค์ต์ ํตํด ๊ณ์ฐ๊ธฐ๋ฅผ ๊ตฌํํด ๋ณผ ๊ฒ์ด๋ค. ๋ฌธ์์ด ๊ณ์ฐ๊ธฐ ์์ ์์ํ๊ธฐ ๊ณ์ฐ๊ธฐ ํ๋ก๊ทธ๋๋ฐ์ ๋ํ ์๊ตฌ์ฌํญ ๊ณ์ฐ๊ธฐ..
๋ด๊ฐ ์ฝ๋์ค์ฟผ๋ ๋ง์คํฐ์ฆ & ์ฝ์ฝ์ ์ฝ์ค๋ฅผ ์ค๋นํ๋๋ผ ์ ์ ๋ฏธ๋ค์ก๋ mypick31ํ๋ก์ ํธใ ใ ์ด์ ์๋ฐ์คํฌ๋ฆฝํธ ์ ๋ฌธ ๊ฐ์๋ ๋ฐ ์ด์ ๋ค์์ผ๋ ํ๋ก์ ํธ๋ฅผ ๋ณํํ ์ ์์ ๊ฒ ๊ฐ์์ ์ด์ ๋ค์ Juni์ ๋ ผ์ํด ๋ณด์๋ค! ์ฝ์ฝ์ ์์ ์ ๊น์ง, ์ด๋ฒ ๋ฌ ๋ง (31์ผ)์ ์์ฑํ ์ ์์์ง..! ์ด์ฌํ ๋ฌ๋ ค์ ์ต๋ํ ์์ฑํด ๋ณด์์ผ๊ฒ ๋ค. ๊ณต๋ถ์ ํ๋ก์ ํธ (+์๋ฐ) ๋ณํ ํ์ดํ ! โ ํ๋ก์ ํธ ๋ง๋ฌด๋ฆฌ๊น์ง ์์ผ๋ก ํด์ผ ํ ์ผ๋ค! 1. DB(์์ฆ์์ด์คํฌ๋ฆผ์ ๋ณด, ์ด๋ฏธ์ง) ์๋ฃ ๋ฃ๊ธฐ 2. ๋ก๊ทธ์์ ๊ธฐ๋ฅ (๋๋ฒ๊น ์ค) 3. ํํฐ๋ง ๊ธฐ๋ฅ 4. ์ข์์ ๊ธฐ๋ฅ 5. ๋ฐ์นญ ์ ๋ง๋ฌด๋ฆฌ ์์ → ๋ฐ์นญ! ๐ 1. DB - ์์ด์คํฌ๋ฆผ ์ด๋ฏธ์ง & ์์ฆํ๋ ์ด๋ฒ ์ ๋ณด ๋ฃ๊ธฐ, ์์ํ db๊ตฌ์กฐ์์ ์์ → bibi๊ฐ ๋งก์์ ์ ๋ก๋. 2. ๋ก๊ทธ์์ ๋๋ฒ๊น ..
CSS ์ํ ์ฝ๋ฉ WEB2 CSS๋ฅผ ๊ณต๋ถํด ์ฃผ์ธ์. ๋ฐฐ์ฐ๋ฌ ๊ฐ๊ธฐ WEB2 - CSS - ์ธํ๋ฐ ์ด ์์ ์ https://opentutorials.org(์ํ์ฝ๋ฉ ์ฌ์ดํธ)๋ฅผ ๋ง๋ค์ด๊ฐ๋ฉด์ CSS์ ๋ํ ์ง์๊ณผ ๊ฒฝํ์ ๋์์ ์ฑ์๋๋ฆฌ๊ธฐ ์ํ ๋ชฉ์ ์ผ๋ก ๋ง๋ค์ด์ง ์์ ์ ๋๋ค. ์ด๊ธ ์น ๊ฐ๋ฐ HTML/CSS ์จ๋ผ์ธ ๊ฐ์ ์ํ์ฝ๋ฉ์ www.inflearn.com ** ๋์ค์ ๊ณต๋ถํ๋ ๊ฒ ์์ง ์๊ธฐ ์ํด ๊ฐ๋ณ ํฌ์คํ ์ผ๋ก ์์ฑ.
๋ณดํธ๋์ด ์๋ ๊ธ์ ๋๋ค.
* ์ด ๊ธ์ ์ธํ๋ฐ์์ ์ ๊ณตํ๋ ํธ๋ ์ค๋์ ์ ๋ฃ ๊ฐ์ '์ฝ๊ณ ์์ฐ์ค๋ฝ๊ฒ ๋ฐฐ์๋ณด๋ Javascript ์ ๋ฌธ - ์ฝ๋์ค์ฟผ๋ ๋ง์คํฐ์ฆ ์ฝ์ค ๋ ๋ฒจ1'๋ฅผ ๋ฃ๊ณ ๊ณต๋ถํ๋ฉฐ ์ ๋ฆฌํ ๊ธ์ ๋๋ค. ๊ฐ์ ๋ด์ฉ์ ๋ํด, ์ ๊ฐ ํ๊ธฐํ๊ณ ๊ตฌ๊ธ๋งํ ๋ด์ฉ์ด ์ ๋ฆฌ๋์ด ์์ต๋๋ค. ์ด๋ณด์ธ ์ ๊ฐ ์ดํดํ ๋๋ก ์ ๋ฆฌํ๊ธฐ ๋๋ฌธ์, ๋ถ์ ํํ ๋ด์ฉ์ด ์์ ์ ์์์ ๊ฐ์ํด ์ฃผ์๊ธธ ๋ฐ๋๋๋ค. ๊ฐ์๋ฅผ ๋ฃ๊ณ ๋ด์ฉ์ ์ ๋ฆฌํ ๊ธ์ด๊ธฐ ๋๋ฌธ์ ๋ฌธ์ ๊ฐ ๋์ง ์๋๋ค๋ ์ธํ๋ฐ ์ธก ๋ต๋ณ์ ๋ฐ์ ์ ์ด ์์ผ๋(https://bibi6666667.tistory.com/37), ์ ์๊ถ์ ๋ฌธ์ ๊ฐ ๋๋ค๋ฉด ๋ณดํธ ๋ชจ๋(๋น๊ณต๊ฐ)๋ก ์ ํํ๊ฒ ์ต๋๋ค. ์ด๋ฒ ์๊ฐ์๋ DOM์ ํตํด ๋ฒํผ์ ์ถ๊ฐํด ๋ณผ ๊ฒ. - ๊ธฐ์กด element์ ๊ณ์ธต ๊ตฌ์กฐ๋ก ์์์ ์ถ๊ฐํ๊ธฐ - ๋ฒํผ์ ์ถ๊ฐํ๊ธฐ ์ค๋นํ๊ธฐ ์๋์..
* ์ด ๊ธ์ ์ธํ๋ฐ์์ ์ ๊ณตํ๋ ํธ๋ ์ค๋์ ์ ๋ฃ ๊ฐ์ '์ฝ๊ณ ์์ฐ์ค๋ฝ๊ฒ ๋ฐฐ์๋ณด๋ Javascript ์ ๋ฌธ - ์ฝ๋์ค์ฟผ๋ ๋ง์คํฐ์ฆ ์ฝ์ค ๋ ๋ฒจ1'๋ฅผ ๋ฃ๊ณ ๊ณต๋ถํ๋ฉฐ ์ ๋ฆฌํ ๊ธ์ ๋๋ค. ๊ฐ์ ๋ด์ฉ์ ๋ํด, ์ ๊ฐ ํ๊ธฐํ๊ณ ๊ตฌ๊ธ๋งํ ๋ด์ฉ์ด ์ ๋ฆฌ๋์ด ์์ต๋๋ค. ์ด๋ณด์ธ ์ ๊ฐ ์ดํดํ ๋๋ก ์ ๋ฆฌํ๊ธฐ ๋๋ฌธ์, ๋ถ์ ํํ ๋ด์ฉ์ด ์์ ์ ์์์ ๊ฐ์ํด ์ฃผ์๊ธธ ๋ฐ๋๋๋ค. ๊ฐ์๋ฅผ ๋ฃ๊ณ ๋ด์ฉ์ ์ ๋ฆฌํ ๊ธ์ด๊ธฐ ๋๋ฌธ์ ๋ฌธ์ ๊ฐ ๋์ง ์๋๋ค๋ ์ธํ๋ฐ ์ธก ๋ต๋ณ์ ๋ฐ์ ์ ์ด ์์ผ๋(https://bibi6666667.tistory.com/37), ์ ์๊ถ์ ๋ฌธ์ ๊ฐ ๋๋ค๋ฉด ๋ณดํธ ๋ชจ๋(๋น๊ณต๊ฐ)๋ก ์ ํํ๊ฒ ์ต๋๋ค. DOM๊ณผ HTML HTML HyperText Markup Language ์ ์ฝ์ WWW(World Wide Web)์ 3์์ ์ค ํ๋. H..
* ์ด ๊ธ์ ์ธํ๋ฐ์์ ์ ๊ณตํ๋ ํธ๋ ์ค๋์ ์ ๋ฃ ๊ฐ์ '์ฝ๊ณ ์์ฐ์ค๋ฝ๊ฒ ๋ฐฐ์๋ณด๋ Javascript ์ ๋ฌธ - ์ฝ๋์ค์ฟผ๋ ๋ง์คํฐ์ฆ ์ฝ์ค ๋ ๋ฒจ1'๋ฅผ ๋ฃ๊ณ ๊ณต๋ถํ๋ฉฐ ์ ๋ฆฌํ ๊ธ์ ๋๋ค. ๊ฐ์ ๋ด์ฉ์ ๋ํด ์ ๊ฐ ํ๊ธฐํ๊ณ ๊ตฌ๊ธ๋งํ ๋ด์ฉ์ด ์ ๋ฆฌ๋์ด ์์ต๋๋ค. ์ด๋ณด์ธ ์ ๊ฐ ์ดํดํ ๋๋ก ์ ๋ฆฌํ๊ธฐ ๋๋ฌธ์, ๋ถ์ ํํ ๋ด์ฉ์ด ์์ ์ ์์์ ๊ฐ์ํด ์ฃผ์๊ธธ ๋ฐ๋๋๋ค. ๊ฐ์์ ๋จ์ ๋ณต๋ถ์ด ์๋ ๋ด์ฉ์ ์ ๋ฆฌํ ๊ธ์ด๊ธฐ ๋๋ฌธ์ ๋ฌธ์ ๊ฐ ๋์ง ์๋๋ค๋ ์ธํ๋ฐ ์ธก ๋ต๋ณ์ ๋ฐ์ ์ ์ด ์์ผ๋(https://bibi6666667.tistory.com/37), ์ ์๊ถ์ ๋ฌธ์ ๊ฐ ๋๋ค๋ฉด ๋ณดํธ ๋ชจ๋(๋น๊ณต๊ฐ)๋ก ์ ํํ๊ฒ ์ต๋๋ค. Prototype ๋์ด๋๊ฐ ๊ฝค ์๋ ๊ฐ์ข์ด๋ฏ๋ก ๊ทธ๋ฅ ์ ๋ฐฐ์ฐ์๊ณ ๋์ด๊ฐ๋ ๋ฌด๋ฐฉํฉ๋๋ค. ํ๋กํ ํ์ prototype ์์ฑ์๋ก ๋ง๋ ..
* ์ด ๊ธ์ ์ธํ๋ฐ์์ ์ ๊ณตํ๋ ํธ๋ ์ค๋์ ์ ๋ฃ ๊ฐ์ '์ฝ๊ณ ์์ฐ์ค๋ฝ๊ฒ ๋ฐฐ์๋ณด๋ Javascript ์ ๋ฌธ - ์ฝ๋์ค์ฟผ๋ ๋ง์คํฐ์ฆ ์ฝ์ค ๋ ๋ฒจ1'๋ฅผ ๋ฃ๊ณ ๊ณต๋ถํ๋ฉฐ ์ ๋ฆฌํ ๊ธ์ ๋๋ค. ๊ฐ์ ๋ด์ฉ์ ๋ํด, ์ ๊ฐ ํ๊ธฐํ๊ณ ๊ตฌ๊ธ๋งํ ๋ด์ฉ์ด ์ ๋ฆฌ๋์ด ์์ต๋๋ค. ์ด๋ณด์ธ ์ ๊ฐ ์ดํดํ ๋๋ก ์ ๋ฆฌํ๊ธฐ ๋๋ฌธ์, ๋ถ์ ํํ ๋ด์ฉ์ด ์์ ์ ์์์ ๊ฐ์ํด ์ฃผ์๊ธธ ๋ฐ๋๋๋ค. ๊ฐ์๋ฅผ ๋ฃ๊ณ ๋ด์ฉ์ ์ ๋ฆฌํ ๊ธ์ด๊ธฐ ๋๋ฌธ์ ๋ฌธ์ ๊ฐ ๋์ง ์๋๋ค๋ ์ธํ๋ฐ ์ธก ๋ต๋ณ์ ๋ฐ์ ์ ์ด ์์ผ๋(https://bibi6666667.tistory.com/37), ์ ์๊ถ์ ๋ฌธ์ ๊ฐ ๋๋ค๋ฉด ๋ณดํธ ๋ชจ๋(๋น๊ณต๊ฐ)๋ก ์ ํํ๊ฒ ์ต๋๋ค. ๊ฐ์ ์ํ ์ ๋ฌ ์ดํดํ๊ธฐ ์ด๋ฒ ์๊ฐ์๋ ๊ฐ์ ์ํ ์ ๋ฌ(call by Value)๊ณผ ์ฐธ์กฐ์ ์ํ ์ ๋ฌ(call by Reference) ์ ..