CodeSquad Day 47 : Front-end Week 5
CodeSquad๐นDay 47
Morning Algo & Algorithm
์ค๋์ ์ค์ 9์์ ์๊ณ ๋ฆฌ์ฆ ์คํฐ๋๊ฐ ์์๋ ๋ ์ด๋ค. ํ๋ก๊ทธ๋๋จธ์ค 1๋ฌธ์ , LeetCode 1๋ฌธ์ ์ ๋ํด์ ํ ๋ก ํ๋๋ฐ ์ด๋ฒ์ ๋ฌธ์ ๋์ด๋๊ฐ ๊ทธ๋ ๊ฒ ๋์ง ์์์์ธ์ง 30๋ถ๋ง์ ๋์ด ๋ฌ๋ค. ๊ทธ ํ์ ์ด์ผ๊ธฐ๋ฅผ ์ข ํ๋ค๊ฐ ๋๋ ๋ฐ๋์ ์ข ์ฌ๋ ค๊ณ ๋ฐ์ ๋๊ฐ๋ค ์๋ค.
๋ฐค์๋ LeetCode์ ์๊ณ ๋ฆฌ์ฆ ํ ๋ฌธ์ ๋ฅผ ํ์ด๋ณด์๋ค. ์๊ฐ ๋ณต์ก๋๊ฐ ๋๋ฌด ์์ข๊ฒ ํ์ด์ ๋ค์ ์ข ๋ ํจ์จ์ ์ธ ํ์ด๋ก ํ์ด์ผ ํ๋ค.
Mission: SASS!
๋ฏธ๋ค ์๋ SASS๋ฅผ ๋๋์ด ์ ๋๋ก ์ฌ์ฉํด ๋ณด์๋ค. ๋ฏธ๋ค ์จ ๊ฒ์ด ํํ๋ ์ ๋๋ก ์ฌ๋ฏธ์ ํจ์จ์ฑ์ ๋ชจ๋ ๋๊ผ๋ค. ์ฌ์ค SASS๋ ์๋ ๋ง์ฏค ๋ฐฐ์ฐ๋ ค๊ณ ์๋ํ๋๋ฐ ๋น์์๋ ์ข ๋ฏ์ค๊ณ ์ด๋ ต๊ฒ ๋๊ปด์ ธ์ ์ ์ ๋ฏธ๋ค์๋๋ฐ ์ง๊ธ์ ๊ทธ๋๋ ์ํ๊ฐ ์ด๋์ ๋๋ ๊ฐ๋ฅํ ๊ฑธ ๋ณด๋, ์ด์ ๋๋ฆ ์๋ก์ด ๊ฒ์ ๋ฐฐ์ฐ๋ ๊ฒ ์ต์ํด์ก๋ ๋ณด๋ค.
mixin์ด ์ ๋ง ์ ์ฉํ๊ณ , SASS๋ ์๋ง ๋ฐฐ์ฐ๋ฉด ์ ๋ง ํ์ฉ๋๊ฐ ์์ฒญ๋ ๊ฒ ๊ฐ๋ค.
๋๋ ํ ๋ฆฌ ๊ตฌ์กฐ ์ง๋ ๊ฒ, dart-sass ์ค์น์ ๊ฐ๋ฐ ํ๊ฒฝ ๊ตฌ์ถ๋ง ์ข ๋ ์ต์ํด์ง๋ฉด ์ข๊ฒ ๋ค. ๋ค์ ํ๋ก์ ํธ ๋์๋ ์ฌ๋งํ๋ฉด SASS๋ฅผ ์จ์ผ๊ฒ ๋ค.
SASS Architecture | 7-1 Pattern | Kiran Workspace
7-1 SASS Pattern means 7 Folders and 1 FIle. 7 Folders have their meaningful labels which include sass snippets or partials.
kiranworkspace.com
๋๋ ํ ๋ฆฌ ๊ตฌ์กฐ๋ฅผ ์งค ๋ ๋ง๋งํ๋๋ฐ ๋์์ ์ค ์ฌ์ดํธ์ด๋ค.
Group Review
5์ 15๋ถ๋ถํฐ ๋ฆฌ๋ทฐ๋ฅผ ์์ํ๋ค. ์๋ 5์๋ถํฐ์ด์ง๋ง ์ค๋์ ๋ฆฌ๋ทฐํ ๋ด์ฉ์ด ๋น๊ต์ ์ ์ ์ ์์ด์ 15๋ถ ๋ฆ๊ฒ ์์ํ๋ค. ์ฒ์์๋ ๋ง๋ก๋ง ๋ฌด์์ ํ๊ณ ๊ณต๋ถํ๋์ง ์๊ธฐํ๋ค๊ฐ, ํ๋ฉด ๊ณต์ ๋ฅผ ํ๋ค. ๊ฑฐ์ SASS๋ฅผ ํ๊ณ ์๋ ๋ถ๋ค์ด ๋ง์์ง๋ง JS ์ค๊ณ๋ฅผ ๋ฉ์ง๊ฒ ํ๊ณ ๋ฒ์จ JS ์ฝ๋๋ฅผ ์ง๊ณ ์๋ ๋ฉค๋ฒ, JSON ๋ฐ์ดํฐ๋ฅผ ์ง์ ๊ทธ๊ฑธ ๋ ๋๋งํ ๋ฉค๋ฒ๋ ์์๋ค. ์ญ์ ๊ฐ์ ๋ฏธ์ ์ ํ์ง๋ง ์์ ์ ์๋์ ๋ง์ถฐ์ ๋๊ฐ๋ ์ง๋๋ ์ฒ์ฐจ๋ง๋ณ์ด๋ค. ๋๋ ๋ด ์๋๋๋ก, ๋จ๋ค์ด ๋น ๋ฅด๋ค๊ณ ํด์ ์กฐ๊ธํดํ์ง ๋ง๊ณ ํ ๋ฐ ํ ๋ฐ์ฉ ๋์๊ฐ๋ ค๊ณ ํ๋ค.
โ์ค๋ ๊ฒ๋ํ์ด์ ์๋ค๊ฐ ์ ์ด๋ฏธ์ ์ค๋๋ง์ ์ด์ผ๊ธฐ๋ฅผ ๋๋ ๊ธฐํ๊ฐ ์์๋ค. ๋ฐ๊ฐ๊ฒ ์ด์ผ๊ธฐํ๋ค๊ฐ ์์นจ ์ด๋์ธ์ฆ ์ด์ผ๊ธฐ๊ฐ ๋์์ ํจ๊ป ํ์๊ณ ๊ถ์ ๋ฅผ ํ๋ค. ์๋ ์ผํ์ฑ์ธ ์ ์ด๋ฏธ๋ ๊ณ ๋ฏผ์ ์ค๋ ํ๋ค๊ฐ, ๋ด๊ฐ ์ฉ๊ธฐ๋ฅผ ๋ง์ด ๋ถ๋์์ค์ ์น๋ํ๋ค. ์ด๋ก์จ ์์นจ์ด๋ ๋ฉค๋ฒ๊ฐ ์ด 8๋ช
์ด ๋์๋ค! ์ ์ ์ธ๋ ฅ(?)์ ๋ถ๋ ค๊ฐ๊ณ ์๋ค. ๋ชจ์์ด ์ค๋ ๊ฐ์ ๋ค๋ค ๊พธ์คํ๊ฒ ์ด๋ํ๊ณ ์ฒด๋ ฅ๋ ์ข์์ง๊ธฐ๋ฅผ!