๊ทธ๋ฆฌ๋(Grid) ํต์ฌ์ด๋ก ๋ฐ ์ค์ ํ์ฉ
์ต๊ณ ์ ๋ฐ์ํ ๋ ์ด์์ ์ ์ ๋ฐฉ์, CSS ๊ทธ๋ฆฌ๋~!! ๊ทธ๋ฆฌ๋(Grid) ํต์ฌ์ด๋ก ๋ฐ ์ค์ ํ์ฉ ์์ ๋ฅผ ํตํด์ CSS ๊ทธ๋ฆฌ๋๋ฅผ ์๋ฒฝํ๊ฒ ์ดํดํ์ค ์ ์์ต๋๋ค. ๋ํ ํต์ฌ์ด๋ก ์ ํ์ฉํ ๋ค์ํ ์ค์ ์์ ๊ฐ ์์ผ๋ ์ค๋ฌด ํ์ฉ์ ์ํ ์ถฉ๋ถํ ์ฐ์ต๋ ํ ์ ์์ต๋๋ค. ๊ทธ๋ฆฌ๋ ํต์ฌ์ด๋ก ์ ์์๋ฟ๋ง ์๋๋ผ PDF ๊ต์ฌ๋ก ๋ค์ด๋ฐ์ผ์ค ์ ์์ต๋๋ค. ์ค๊ธ ํผ๋ธ๋ฆฌ์ ๊ฐ ๋๊ธฐ ์ํ ํ์ ์ฝ์ค์ธ CSS ๊ทธ๋ฆฌ๋ ํต์ฌ์ด๋ก ๊ณผ ์ค์ ํ์ฉ์ ์ตํ์๋ฉด ์ทจ์ ๋ฟ๋ง ์๋๋ผ ํผ๋ธ๋ฆฌ์ ๋ก์ ์ค๋ฌด์์ ์ถฉ๋ถํ ๊ฒฝ์๋ ฅ์ ๊ฐ์ง์ค ์ ์์ต๋๋ค.
์๊ฐ์ 349๋ช
๋์ด๋ ์ด๊ธ
์๊ฐ๊ธฐํ ๋ฌด์ ํ
Tailwind CSS ๊ฐ์๊ฐ ์๋กญ๊ฒ ์คํ๋์์ต๋๋ค.
์๋ ํ์ธ์. ์ฝ๋ฉ์์ค์ ๋๋ค.
์ด๋ฒ์ ์ฝ๋ฉ์์ค๊ฐ ์ฌํ์ ๊ธฐ์ธ์ฌ์ ๋ง๋ Tailwind CSS ๊ฐ์๊ฐ ์คํ๋์์ต๋๋ค.
์ฝ๋ฉ์์ค๊ฐ ๋ง๋ Tailwind CSS ๊ฐ์๋ [Tailwind CSS๋ก ๊ฐ๋ฐ์๊ฐ ๋ง๋๋ ๋ฉ์ง UI ์คํ์ผ๋ง]๋ผ๋ ์ ๋ชฉ์ผ๋ก ๋ง๋ ๊ฒ ์ฒ๋ผ ๊ฐ๋ฐ์๊ฐ ํผ๋ธ๋ฆฌ์ฑ์ ํ ๋ ํผ๋ธ๋ฆฌ์
๋ชป์ง ์๊ฒ ์์ UI ์คํ์ผ๋ง์ ํ ์ ์๋ ๋ถ๋ถ์ ๊ฐ์ฅ ์ด์ ์ ๋ง์ท์ต๋๋ค.
[Tailwind CSS๋ก ๊ฐ๋ฐ์๊ฐ ๋ง๋๋ ๋ฉ์ง UI ์คํ์ผ๋ง] ๊ฐ์๋ ํ์ฌ ๊ฐ์ฅ ํซํ ํ๋ ์์ํฌ์ธ Tailwind CSS๋ฅผ ์ด๋ก ๋ถํฐ ์ค์ ๋ฐ์ํ ์น์ฌ์ดํธ๊น์ง 19์๊ฐ ์ด์์ ์์ ์๊ฐ์ผ๋ก ์ถฉ์คํ๊ฒ ๋ค๋ฃจ๊ณ ์์ต๋๋ค. ์์ ์๊ฐ์ด ๊ธธ๋ค๊ณ ์ข์ ๊ฐ์๋ ์๋๋๋ค. ํ์ง๋ง ํด๋น ๊ฐ์๋ ์๊ฐ๋ ๊ธธ๊ณ ๊ฐ์๋ ์ข๋ค๊ณ ์๋ถํฉ๋๋ค. ํนํ, Tailwind CSS ๋ชจ๋ ์ด๋ก ์ 8์๊ฐ 30๋ถ ๋์ ์์ธํ๊ฒ ๋ค๋ฃจ๊ธฐ ๋๋ฌธ์ CSS ์ด๋ก ์ด ๋ถ์กฑํ ์ฌ๋์๊ฒ CSS ์ด๋ก ์ ์ถฉ์คํ ํ์ตํ ์ ์์ต๋๋ค.
Tailwind CSS๋ CSS Frameworks Ranking์์ ํ์ฌ๊น์ง ๊พธ์คํ ์ธ๊ธฐ๋ฅผ ๋๋ฆฌ๊ณ ์๊ณ , ๋ง์กฑ๋ 1์๋ฅผ ํ๊ณ ์๋ Tailwind CSS๋ ์์ฆ ์ ์ธ๊ณ์ ์ผ๋ก ๊ฐ์ฅ ํซํ CSS ํ๋ ์์ํฌ์
๋๋ค. ํซํ ์ด์ ์ค์ ๊ฐ์ฅ ๋ํ์ ์ธ ๊ฒ์ด ๋ฐ๋ก ์ ํธ๋ฆฌํฐ ํด๋์ค๋ฅผ ์ฌ์ฉํ ์ฐฝ์์ ์ธ ์คํ์ผ๋ง์ ํ ์ ์๊ณ ๋ํ, ์ข์ ํ๋ฆฌํฐ์ ๋์์ธ์ ๋ง๋ค๊ธฐ ์ํ ์์
์๊ฐ์ด ๊ฝค ๋น ๋ฅด๋ค๋ ์ ์ด๋ผ ์๊ฐ๋ฉ๋๋ค.
์ด๋ก ์์ ๋ฟ๋ง ์๋๋ผ Tailwind CSS๋ก ๋ง๋๋ ์ค์ ์์ ๋ค ๊ทธ๋ฆฌ๊ณ ๊ฐ๋ฐ์ ๊ฒฝ๋ ฅ ์ด๋ ฅ์ & ํฌํธํด๋ฆฌ์ค ์๊ฐ ๋ฐ์ํ ์น ์ ์๋ ์ถฉ์คํ๊ฒ ๋ฐฐ์ฐ์๊ณ ๊ฒฐ๊ณผ๋ฌผ์ ์ป์ผ์ค ์ ์์ต๋๋ค.
โ ๊ฐ์์๊ฐ ๋ฐ ๋ฌด๋ฃ๊ฐ์ ๋ณด๋ฌ๊ฐ๊ธฐ : https://inf.run/pjqKk







