๐ช Programming
[HTML/CSS] CSS ์ธ์ ํ๋ ์๋ฆฌ๋จผํธ๋ค์ border ๊ฒน์นจ ๋ฌธ์ ํด๊ฒฐ
[HTML/CSS] CSS ์ธ์ ํ๋ ์๋ฆฌ๋จผํธ๋ค์ border ๊ฒน์นจ ๋ฌธ์ ํด๊ฒฐ
2024.05.03์ UI์์ ์๋จ/ํ๋จ ๋ฐ์ค์ ํ ๊ธ์ด ํ์ฑํ ๋๋ฉด border ์์์ด ํ๋์์ผ๋ก ๋ณ๊ฒฝ๋๋ค. ํ์ง๋ง โ์๋จ ๋ฐ์ค ์๋ border์ โํ๋จ ๋ฐ์ค ์์ชฝ border๊ฐ ๊ฒน์ณ์ 1px border๊ฐ 2px ์ฒ๋ผ ๋ณด์ด๊ฒ ๋๋ค(์ฃผํฉ์ ํ์ดํ ๋ถ๋ถ). ํ ๊ธ์ด ํ์ฑํ๋ ์ํ์์ ์๋จ ๋ฐ์ค์ margin-bottom ํ๋จ ์ฌ๋ฐฑ ๊ฐ์ -1px ์ฃผ๋ ๋ฐฉ์์ผ๋ก ํด๊ฒฐํ ์ ์์ง๋ง, ๋ค๋ฅธ ๋ฐ์ค์ ๋ชจ๋ ํ ๊ธ ์ํฉ์ ์ผ์ผ์ด ์ ์ฉํ๋๊ฑด ๋ฒ๊ฑฐ๋กญ๋ค. ๊ฒ๋ค๊ฐ ํ ๊ธ์ด 3๊ฐ ํน์ 4๊ฐ๊ฐ ํ์ฑํ ๋๋ ์ํฉ๋ ๊ณ ๋ คํด์ผ๋๋ฏ๋ก ๋ณต์กํ๋ค. ์ด๋ display: table;์ ํ์ฉํด์ ํด๊ฒฐํ ์ ์๋ค. ํ
์ด๋ธ ๊ตฌ์กฐ ๋ณ๊ฒฝ ์์
๊ตฌ์กฐ ๋ณ๊ฒฝ๐ก border-collapse: collapse ์์ฑ์ table ํ๊ทธ๋ฅผ ์ฌ์ฉํ์ ๋๋ง ์ ํจํ๋ค. ํ
์ด๋ธ ํ๊ทธ์ ๊ดํ ..
[HTML/CSS] ์ด๋ฉ์ผ ํ
ํ๋ฆฟ ์์ฑ๋ฒ (feat. ํ
์ด๋ธ ์ฝ๋ฉ)
[HTML/CSS] ์ด๋ฉ์ผ ํ ํ๋ฆฟ ์์ฑ๋ฒ (feat. ํ ์ด๋ธ ์ฝ๋ฉ)
2024.05.03์ด๋ฉ์ผ ํฌ๋งท์ ํ์ค์ด ์๋ค. ๋ค์ํ ์ด๋ฉ์ผ ํด๋ผ์ด์ธํธ์์ ์ ์์ ์ผ๋ก ๋ณด์ด๊ธฐ ์ํด์ ํ๊ทธ๋ฅผ ์ฌ์ฉํ์ง ์๊ณ , , ๋ง ์ด์ฉํด์ ์์ฑํ๋๊ฒ ์ข๋ค. ์ผ๋ช
ํ
์ด๋ธ ์ฝ๋ฉ์ด๋ผ๊ณ ๋ถ๋ฆฐ๋ค. ์ฌ๋ฐฑ์ ์ง์ ํ ๋ ๋ณดํต margin์ ์ฌ์ฉํ๋๋ฐ, ์ด ๋ํ padding ๋ฑ์ผ๋ก ๋์ฒดํ๋ค. ์คํ์ผ์ ์ธ๋ผ์ธ ๋ฐฉ์์ ์ฌ์ฉํ๋ค. DOCTYPE์ด๋ฉ์ผ ํด๋ผ์ด์ธํธ์๊ฒ HTML ์ ํ์ ์๋ ค์ค๋ค. XHTML 1.0 Transitional doctype ์ ์ฌ์ฉํ๋ฉด ์ด๋ฉ์ผ ํด๋ผ์ด์ธํธ๊ฐ ์ ํจ์ฑ์ ๊ฒ์ฌํ๊ณ ์ด๋ฉ์ผ์ ๋ ๋๋งํ๋๋ฐ ๋์์ด ๋๋ค. Headํ
์คํธ์ ํน์ ๋ฌธ์๋ฅผ ์ฌ๋ฐ๋ฅด๊ฒ ํ์ํ ์ ์๋๋ก ๋ฌธ์ ์ธ์ฝ๋ฉ ๋ฐฉ์์ UTF-8๋ก ์ค์ ํ๋ค. DOCTYPE์ XHTML๋ก ์ค์ ํ๊ธฐ ๋๋ฌธ์ Content-Type ์ ์ธ๋ ํฌํจํด์ผ ํ๋ค. Style ..
[React] ๋ฆฌ์กํธ ์ด๋ฏธ์ง ๋ฏธ๋ฆฌ๋ณด๊ธฐ(์
๋ก๋) ๊ตฌํ / File API
[React] ๋ฆฌ์กํธ ์ด๋ฏธ์ง ๋ฏธ๋ฆฌ๋ณด๊ธฐ(์ ๋ก๋) ๊ตฌํ / File API
2024.05.02file ํ์
์ ํ๊ทธ์ File API๋ฅผ ์ด์ฉํด ์ปดํจํฐ์ ์ ์ฅ๋ ์ด๋ฏธ์ง๋ฅผ ์
๋ก๋ํ ์ ์๋ค. ์ด๋ฏธ์ง ํ๊ทธ ์์ฒด๋ฅผ “ํ์ผ์ ํ” ๋ฒํผ์ผ๋ก ๊ธฐ๋ฅํ๋๋ก ํ ์ ์๊ณ , ๋ผ๋ฒจ์ ์คํ์ผ์ ์์ ํ๋ ๋ฐฉ์์ผ๋ก “ํ์ผ ์ ํ”(ํ์ผ ํ๋) ์คํ์ผ์ ๋ณ๊ฒฝํ ์๋ ์๋ค. ๊ธฐ๋ณธ ๊ตฌ์กฐ์
๋ก๋ํ ์ด๋ฏธ์ง๋ ์ปดํฌ๋ํธ ๋ด๋ถ ์ํ(image)๋ก ๊ด๋ฆฌํ๊ณ , ์
๋ก๋ ํ๊ธฐ ์ ์ ๊ธฐ๋ณธ ํ๋กํ ์ฌ์ง(fallbackUrl)์ ํ์ํ๋๋ก ํ๋ค. ํ๊ทธ์ type์ file๋ก ๋ช
์ํ๋ฉด “ํ์ผ ์ ํ” ๋ฒํผ์ด ํ์๋๋ค. accept ์์ฑ์ ํ์ฉํ ํ์ผ ์ ํ์ .ํ์ฅ์ ํํ๋ก ์
๋ ฅํ๋ค. ํ์ฅ์๋ ๋์๋ฌธ์๋ฅผ ๊ตฌ๋ถํ์ง ์๋๋ค. ์ฌ๋ฌ ๊ฐ์ ์
๋ ฅํ ๋ ์ฝค๋ง , ๋ก ๊ตฌ๋ถํ๋ค. ํน์ ํ์
(MIME ์ ํ)์ ๋ชจ๋ ํ์ฅ์๋ฅผ ํ์ฉํ๊ณ ์ถ์ผ๋ฉด ํ์
/* ์ ์
๋ ฅํ๋ค. ํ์ฉํ์ง..
[TS] ํ์
์คํฌ๋ฆฝํธ - ๋๋ํ ์ฐ์ฐ์
[TS] ํ์ ์คํฌ๋ฆฝํธ - ๋๋ํ ์ฐ์ฐ์
2024.05.02์๋ฐ์คํฌ๋ฆฝํธ์์ NOT ! ์ฐ์ฐ์๋ false๋ฅผ ์๋ฏธํ๋ค. ๋ฐ๋ฉด ํ์
์คํฌ๋ฆฝํธ์์ ์ด ๋๋ํ ! ์ฐ์ฐ์๊ฐ ๋ณ์ ๋ค์ ์ฌ ์ ์๋ค. if๋ฌธ ๋ฑ์ ์ฌ์ฉํ์ง ์๊ณ ํญ์ ์ ํจํ ๊ฐ์ด ์๋ค๊ณ ๋จ์ธ ํ ๋ ์ฌ์ฉํ๋ค. Non-null assertion operator (๋๋ํ)๐ก ESLint ๊ท์น์์ ๋๋ํ ์ฐ์ฐ์๋ฅผ ์ฌ์ฉํ๋ฉด null-checking mode์ ํํ์ ๋ฐ์ง ๋ชปํ๊ธฐ ๋๋ฌธ์ ๊ถ์ฅํ์ง ์๋๋ค. ๋์ foo.bar && foo.bar... AND ์ฐ์ฐ์ ํน์ ์ต์
๋ ์ฒด์ด๋ ์ฌ์ฉ์ ๊ถ์ฅํ๋ค. ๋๋ํ ์ฐ์ฐ์๋ฅผ ๊ผญ ์ฌ์ฉํด์ผ ํ๋ค๋ฉด ํญ์ ์ ํจํ ๊ฐ์ ๋ณด์ฅํ๋ ๋ณ์์๋ง ์ฌ์ฉํ๋ค. ๋ณ์ ๋ด๋ถ ๊ฐ์ ์ ๊ทผํ ๋ TS ์ปดํ์ผ๋ฌ๋ ํญ์ null undefined ์ธ์ง ์ฒดํฌํ๋ค. ์ด๋ if ๋ฌธ์ผ๋ก ํ์
๋จ์ธ์(๋ณ์์ ์ํ๋ ํ..
[Algorithm] ์๋ฐ์คํฌ๋ฆฝํธ ์(pairs)์ ํฌํจํ๋ ๋ฐฐ์ด์์ ์ ๋ํฌ ๋๋ฒ ์ฐพ๊ธฐ
[Algorithm] ์๋ฐ์คํฌ๋ฆฝํธ ์(pairs)์ ํฌํจํ๋ ๋ฐฐ์ด์์ ์ ๋ํฌ ๋๋ฒ ์ฐพ๊ธฐ
2024.05.02์๋ ๋ฐฐ์ด์์ ๋จ ํ๋ฒ๋ง ๋์ด๋๋ ์ ๋ํฌ ์ซ์๋ 17์ด๋ค. 1๊ณผ 3์ ์์ ์ด๋ฃจ๊ณ ์๊ธฐ ๋๋ฌธ์ ๋๋ฒ์ฉ ๋์ด๋๊ณ ์๋ค. ์ด๋ฐ ๋ฐฐ์ด์์ ์ ๋ํฌ ๋๋ฒ(17)๋ง ์ฐพ์๋ด๋ ค๋ฉด ์ด๋ป๊ฒ ํด์ผํ ๊น?[1, 3, 17, 3, 1] Naive Solution — O(n*n)2์ค for๋ฌธ์ ์ฌ์ฉํ ์์. ๋ชจ๋ ์ซ์๋ฅผ ํ๋ฒ์ฉ ๋์๊ฐ๋ฉด์ ๊ฒ์ฌํด์ผ ๋๊ธฐ ๋๋ฌธ์ O(n*n)์ ์๊ฐ๋ณต์ก๋๋ฅผ ๊ฐ๋๋ค. ๋ฐฐ์ด ๊ธธ์ด๊ฐ 5๋ผ๋ฉด ์ ๋ต์ ์ฐพ์ ๋๊น์ง ์ต๋ 25๋ฒ์ ์ํ๊ฐ ์ด๋ค์ง ์๋ ์๋ค.function singleNumber(nums) { for (let i = 0; i Linear Solution — O(n)๐ก O(n)์ ์๊ณ ๋ฆฌ์ฆ ์คํ ์๊ฐ์ด ์ ํ์ด ๋๋ ๊ฒ์ ๋ปํ๋ค. ์ ํ ์๊ฐ(Linear time; ็บฟๆงๆถ้ด)์ด๋ ๋ฐฐ์ด ๊ธธ์ด(n)์ ๋น๋ก..
[Git] git revert, git reset ์ฐจ์ด์ ๋ฐ HEAD ๋ถ๋ฆฌ
[Git] git revert, git reset ์ฐจ์ด์ ๋ฐ HEAD ๋ถ๋ฆฌ
2024.05.01TL;DRreset : ํ์ฌ ๋ธ๋์น๋ฅผ ์ง์ ํ ์ปค๋ฐ์ผ๋ก ์ด๋. ๊ทธ ์ดํ์ ์ปค๋ฐ ํ์คํ ๋ฆฌ๋ ์ญ์ revert : ์ปค๋ฐ ๋ณ๊ฒฝ์ฌํญ์ ์ทจ์ํ๋ ์๋ก์ด ์ปค๋ฐ ์์ฑ. ๊ธฐ์กด ์ปค๋ฐ ํ์คํ ๋ฆฌ๋ ์ ์ง HEAD ๋ฐฐ๊ฒฝ์ง์Git Branch ํ์ต/์ฐ์ตํ๊ธฐ ์ข์ ์ฌ์ดํธ โผ Learn Git BranchingAn interactive Git visualization tool to educate and challenge!learngitbranching.js.org HEAD๋ ํ์ฌ ๋ธ๋์น ์์
ํธ๋ฆฌ์ ๊ฐ์ฅ ์ต๊ทผ ์ปค๋ฐ์ ๊ฐ๋ฆฌํจ๋ค(ํ์ฌ ์์
์ค์ธ ์ปค๋ฐ).HEAD๋ฅผ ๋ธ๋์น ๋์ ์ปค๋ฐ์ ๋ถ์ด๋ ๊ฒ์ HEAD ๋ถ๋ฆฌ๋ผ๊ณ ๋ถ๋ฅธ๋ค.^(์บ๋ฟ) ์ฐ์ฐ์๋ ์๋์ฐธ์กฐ ๊ธฐ๋ฅ์ผ๋ก, ํ ๋จ๊ณ ์(๋ถ๋ชจ) ์ปค๋ฐ์ผ๋ก ์ด๋ํ ๋ ์ฌ์ฉํ๋ค.git checkout bugFix^..
[HTML/CSS] ์ค๋ฐ๊ฟ ์ ์ด ์์ฑ word-break / word-wrap(overflow-wrap)
[HTML/CSS] ์ค๋ฐ๊ฟ ์ ์ด ์์ฑ word-break / word-wrap(overflow-wrap)
2024.05.01TL;DR๋ฐ์ค ์์ญ์ ๋ฒ์ด๋๊ฑฐ๋, ๋ถํ์ํ ๊ณต๋ฐฑ์ด ์๊ธฐ๋ ๋ฑ ๋๋ถ๋ถ์ ์ค๋ฐ๊ฟ ๋ฌธ์ ๋ ์๋ ๋ ์์ฑ์ผ๋ก ํด๊ฒฐํ ์ ์๋ค.word-break: break-all; /* ์์ (๊ธ์)๋ฅผ ๊ธฐ์ค์ผ๋ก ์ค๋ฐ๊ฟ */word-wrap: break-word; /* ์์ญ์ ๋์น ๋จ์ด ๋ถ๋ฆฌ(์ค๋ฐ๊ฟ) */ word-break๐ก ์ค๋ฐ๊ฟํ ์ค๋จ์ ์ ๊ธฐ์ค์ ๋ฐ๊ฟ ์ ์๋ ์์ฑ word-break ์์ฑ์ ๊ธ์๋ฅผ ์ด๋ป๊ฒ ๋ถ๋ฆฌํด์ ์ค๋ฐ๊ฟํ ์ง ๊ฒฐ์ ํ๋ ์์ฑ์ด๋ค. CJK๋ ์์ (๊ธ์), non-CJK๋ ๊ณต๋ฐฑ๊ณผ - ํ์ดํ์ด ๊ธฐ๋ณธ ์ค๋จ์ ์ด๋ค. word-break ์์ฑ์ผ๋ก ์ค๋ฐ๊ฟํ ์ค๋จ์ ์ ๊ธฐ์ค์ ๋ฐ๊ฟ ์ ์๋ค. ์๋๋ ์ธ์ด๋ณ ์์ฑ ๊ฐ์ ๋ฐ๋ผ ๋ฌ๋ผ์ง๋ ์ค๋จ์ ์ ์ ๋ฆฌํ ํ — WIT ๋ธ๋ก๊ทธ ์ฐธ๊ณ normal (๊ธฐ๋ณธ๊ฐ)break-allkeep-a..
[DevTools] direnv๋ก ํด๋๋ง๋ค ๋ค๋ฅธ node ๋ฒ์ ์ ์ฉํ๊ธฐ / ์ ์ญ gitignore
[DevTools] direnv๋ก ํด๋๋ง๋ค ๋ค๋ฅธ node ๋ฒ์ ์ ์ฉํ๊ธฐ / ์ ์ญ gitignore
2024.05.01ํ๋ก์ ํธ๋ง๋ค ์ฌ์ฉํ๋ Node ๋ฒ์ ์ด ๋ค๋ฅด๋ค๋ฉด nvm์ ์ด์ฉํด์ ๋ฒ์ ์ ๋ณ๊ฒฝํ ์ ์๋ค. ํ์ง๋ง ๋งค๋ฒ ์๋์ผ๋ก ๋
ธ๋ ๋ฒ์ ์ ๋ฐ๊ฟ์ฃผ๋ ๊ฒ์ ๋ฒ๊ฑฐ๋ก์ด ์ผ์ด๋ค. direnv๋ฅผ ํ์ฉํ๋ฉด ํ๋ก์ ํธ ํด๋๋ฅผ ๋ฐ๊ฟ ๋๋ง๋ค ๋
ธ๋ ๋ฒ์ ์ด ์๋์ผ๋ก ๋ฐ๋๋๋ก ์ค์ ํ ์ ์๋ค. direnv๋ ํด๋๋ณ๋ก ํ๊ฒฝ์ ๊ด๋ฆฌํด์ฃผ๋ ๋๊ตฌ๋ค. ์ค์นโถ direnv ์ค์นbrew install direnv # homebrew๋ก direnv ์ค์น โท direnv hook ์ค์ (ํด๋ ์ด๋์ ํด๋น ํด๋์ .envrc ํ์ผ ์๋ ์คํ). oh-my-zsh๋ฅผ ์ฌ์ฉํ๋ค๋ฉด `.zshrc` ํ์ผ `plugins` ๋ฐฐ์ด์ `direnv`๋ฅผ ์ถ๊ฐํ๋ฉด ์๋์ผ๋ก ์ค์ ๋๋ค.# ~/.zshrcplugins=(... direnv) oh-my-zsh๋ฅผ ์ฌ์ฉํ์ง ์๋๋ค๋ฉด ์๋ ..
[HTML/CSS] ์์๋๋ฉด ์ ์ฉํ CSS ์ต์ ๊ธฐ๋ฅ 6๊ฐ์ง
[HTML/CSS] ์์๋๋ฉด ์ ์ฉํ CSS ์ต์ ๊ธฐ๋ฅ 6๊ฐ์ง
2024.05.01@supports@supports๋ฅผ ์ด์ฉํด ๋ธ๋ผ์ฐ์ ๊ฐ ํน์ CSS ์์ฑ์ ์ง์ํ ๋์, ์ง์ํ์ง ์์ ๋์ ์คํ์ผ์ ๊ฐ๊ฐ ์ง์ ํ ์ ์๋ค. @supports (์์ฑ๋ช
: ๊ฐ) {...} ํํ๋ก ์ฌ์ฉํ๋ค. ์ง์ํ์ง ์์ ๋ not ์ฐ์ฐ์๋ฅผ ์ถ๊ฐํ๋ค./* ๋ธ๋ผ์ฐ์ ๊ฐ display: grid๋ฅผ ์ง์ํ๋ฉด ์ ์ฉ */@supports (display: grid) { div { display: grid; }}/* ๋ธ๋ผ์ฐ์ ๊ฐ display: grid๋ฅผ ์ง์ํ์ง ์์ผ๋ฉด float ์ ์ฉ */@supports not (display: grid) { div { float: right; }} CSS ์คํ์ผ ์์ฑ๋ฟ๋ง ์๋๋ผ CSS ์ ํ์(์
๋ ํฐ)๋ฅผ ์ง์ํ๋์ง๋ ํ๋ณํ ์ ์๋ค./* ๋ธ๋ผ์ฐ์ ๊ฐ > ์์ ์
๋ ํฐ๋ฅผ ์ง..
[CS] RISC / CISC ์ํคํ
์ฒ ์ฐจ์ด์
[CS] RISC / CISC ์ํคํ ์ฒ ์ฐจ์ด์
2024.05.01์ ํ์ 2020๋
x86 ์ํคํ
์ฒ์์ ARM์ผ๋ก ์ ํํ๋ค. M1 ๋งฅ๋ถ๋ถํฐ ARM ์ํคํ
์ฒ๋ฅผ ์ฌ์ฉํ๋ค. ์ธํฐ๋ท, ์ ๋ฌธ์์ ์์์ด ๋ค์๋ ๋ง์ด๋ค. ํ์ง๋ง ์ ์ ์ ARM ํ๋ก์ธ์๋ฅผ ์ฌ์ฉํ ๋งฅ๋ถ์ด ๋ ๋น ๋ฅธ์ง, ์ ๋ฐ์คํฌํฑ ๊ธฐ๊ธฐ๋ ์ธํ
/AMD์ ์ฌ์ฉํ๊ณ ๋ชจ๋ฐ์ผ ๊ธฐ๊ธฐ๋ ARM์ ์ฌ์ฉํ๋์ง ๋ฑ์ ๋ชฐ๋๋ค. ๊ทธ๋์ ์ค๋์ ์ธํ
๊ณผ ARM ์ํคํ
์ฒ์ ์ฐจ์ด์ ์ ๋ํด์ ์์๋ณธ๋ค(์์ฆ์ ๋
ธํธ๋ถ, ์๋ฒ, ์ํผ ์ปดํจํฐ์์๋ ARM์ ์ฌ์ฉํ๋ค). ์ด์
๋ธ๋ฆฌ ์ธ์ด๐ก ์ด์
๋ธ๋ฆฌ ์ธ์ด๋ ๊ธฐ๊ณ์ด์ ํ ๋จ๊ณ ์ ์ธ์ด๋ค. ํน์ ํ๋ก์ธ์์ ๋ฐ์ธ๋ฉ๋ ๊ธฐ๋ณธ ๋ช
๋ น ์งํฉ์ผ๋ก ์์ฝ์ด๊ฐ ๋งค์ฐ ์ ๋ค. ์ด์
๋ธ๋ฆฌ ์ธ์ด ์ฝ๋๋ ์ปดํจํฐ๊ฐ ์ฒ๋ฆฌํ๊ธฐ ์ ์ ๊ธฐ๊ณ์ด(0๊ณผ 1)๋ก ๋ณํํด์ผ ํ๋ค. ์ด ๋ณํ์ ์ด์
๋ธ๋ฌ๋ฅผ ํตํด ์ด๋ค์ง๋ค. ๊ธฐ๊ณ์ด์ ์ด์
๋ธ๋ฆฌ์ด ๋ชจ๋ Low Level..
[JS] ์๋ฐ์คํฌ๋ฆฝํธ RORO ๋์์ธ ํจํด / ์คํ ํธ๋ ์ด์ค / ์๋ฌ ์ ํ
[JS] ์๋ฐ์คํฌ๋ฆฝํธ RORO ๋์์ธ ํจํด / ์คํ ํธ๋ ์ด์ค / ์๋ฌ ์ ํ
2024.05.01TL;DRRORO ํจํด์ Receive an Object, Return and Object์ ์ฝ์๋ค. ํจ์์ ํ๋ผ๋ฏธํฐ์ ๋ฆฌํด๊ฐ ๋ชจ๋ ๊ฐ์ฒด์ธ๊ฑธ ๋งํ๋ค. ES6๋ถํฐ ์ง์ํ๋ ๊ตฌ์กฐ๋ถํดํ ๋น ๋๋ถ์ ์๋ฐ์คํฌ๋ฆฝํธ์์๋ RORO ํจํด์ ์ฌ์ฉํ ์ ์๋ค. ํ๋ผ๋ฏธํฐ ์ ์ ๋ฐฉ์(RORO ํจํด)๋ง ์ด์ง ๋ฐ๊ฟจ์ง๋ง ๊ฐ๋
์ฑ์ ๋งค์ฐ ์ข์์ง๋ค. RORO ํจํด์ ์ฅ์ ์ ์๋์ ๊ฐ๋ค. ์ด๋ฆ์ด ์ง์ ๋ ํ๋ผ๋ฏธํฐ (Named parameters)๋ช
์์ ์ธ ํ๋ผ๋ฏธํฐ ๊ธฐ๋ณธ๊ฐ (Cleaner default parameters)๋ ๋ง์ ์ ๋ณด ๋ฐํ (Richer return values)ํจ์ ํฉ์ฑ ์ฉ์ด (Easy function composition) ์ด๋ฆ์ด ์ง์ ๋ ํ๋ผ๋ฏธํฐํ๋ผ๋ฏธํฐ์ {} ์ค๊ดํธ๋ง ์ถ๊ฐํด์ฃผ๋ฉด ๊ฐ๋จํ๊ฒ RORO ํจํด์ ์ ์ฉํ ์ ์๋ค. ..
[React] ๋ฆฌ์กํธ ๋ผ์ฐํฐ React Router v6 ๋ฐ๋์ ํบ์๋ณด๊ธฐ
[React] ๋ฆฌ์กํธ ๋ผ์ฐํฐ React Router v6 ๋ฐ๋์ ํบ์๋ณด๊ธฐ
2024.04.30React Router๊ฐ v6์ผ๋ก ์
๋ฐ์ดํธ ๋๋ฉด์ ๊ฝค ๋ง์ ๋ถ๋ถ์ด ๋ฐ๋์๋ค. ๊ณต์ ๋ฌธ์์์ ์์ธํ ๋ง์ด๊ทธ๋ ์ด์
๊ฐ์ด๋๋ ์ ๊ณตํ๊ณ ์๋ค. v6์ ์ฌ์ฉํ๋ ค๋ฉด React 16.8 ๋ฒ์ ์ด์ ์ฌ์ฉํด์ผ ํ๋ค. v6์ ์ด์ ๋ฒ์ ๋๋น ๋ฒ๋ค ์ฌ์ด์ฆ๋ 70% ์ด์ ์ค์๋ค๊ณ ํ๋ค(ํจํค์ง ์
๋ฐ์ดํธ๋ง์ผ๋ก ๋ฒ๋ค ํฌ๊ธฐ ์ต์ ํ๊ฐ ๊ฐ๋ฅํ๋ค๋ ๋ป). Switch → Routes ์ปดํฌ๋ํธ๊ฐ ๋ผ๋ ์ด๋ฆ์ผ๋ก ๋ณ๊ฒฝ๋๋ค. ๋ฐ๋ ์ด๋ฆ์ด ๋ ์ง๊ด์ ์ธ ๊ฒ ๊ฐ๋ค. ๋ง ๋จ๋
์ผ๋ก ์ฌ์ฉํ ์๋ ์๊ฒ ๋๋ค. ๋ฅผ ์ฌ์ฉํ๋ ค๋ฉด ํญ์ ๋ก ๊ฐ์ธ์ค์ผ ํ๋ค.// v5 // v6 exact ์ต์
์ญ์ v6๋ถํฐ ๊ฒฝ๋ก๊ฐ ์ ํํ ์ผ์นํ๋๋ก ๋งค์นญ ๊ท์น์ด ๋ฐ๊ผ๋ค. ๋์ด์ exact ์ต์
์ ๋ช
์ํ์ง ์์๋ ๋๋ค. ๋ชจ๋ ๋ผ์ฐํธ๋ ๊ธฐ๋ณธ์ ์ผ๋ก exact ์ต์
์ด ๋ถ๋๋ค๊ณ ๋ณด๋ฉด ๋๋ค...