์ฐ๋ฆฌ๋ ํ๋ จ์ ์ํ ์ผ๋ จ์ ํ๋ก์ ํธ๋ฅผ ๊ณ์ํฉ๋๋ค.
ํ๋ก ํธ์๋ ๊ธฐ์ ์ ์ฐ๋งํ๊ธฐ ์ํ 9๊ฐ์ง ํ๋ก์ ํธ ํ๋ก ํธ์๋ ๊ฐ๋ฐ์๋ฅผ ์ํ XNUMX๊ฐ์ง ๊ณผ์ ๊ฐ๋ฐ์๋ฅผ ์ํ ์ฌ๋ฏธ์๋ ์ฐ์ต -
8๊ฐ ๊ต์ก ํ๋ก์ ํธ -
์ฐ์ตํ ๋ ๋ค๋ฅธ ํ๋ก์ ํธ ๋ชฉ๋ก
์ธต
๋ ์ด์ด(Layer)๋ ๋๊ตฌ๋ ๊ณต์ ํ๋ '๋ณด๋'์ ํฝ์ ์ ๊ทธ๋ฆด ์ ์๋ ์ปค๋ฎค๋ํฐ์ ๋๋ค. ์๋ ์์ด๋์ด๋ Reddit์์ ํ์ํ์ต๋๋ค. r/Layer ์ปค๋ฎค๋ํฐ๋ ๋ชจ๋ ์ฌ๋์ด ์ฐฝ์์๊ฐ ๋์ด ๊ณตํต์ ๋์์ ๊ธฐ์ฌํ ์ ์๋ค๋ ๊ณต์ ์ฐฝ์์ฑ์ ๋ํ ์์ ์ ๋๋ค.
๋๋ง์ ๋ ์ด์ด ํ๋ก์ ํธ๋ฅผ ๋ง๋ค ๋ ๋ฐฐ์ฐ๊ฒ ๋๋ ๋ด์ฉ:
- JavaScript ์บ๋ฒ์ค ์๋ ๋ฐฉ์ ์บ๋ฒ์ค๋ฅผ ์๋ํ๋ ๋ฐฉ๋ฒ์ ์๋ ๊ฒ์ ๋ง์ ์์ฉ ํ๋ก๊ทธ๋จ์์ ์ค์ํ ๊ธฐ์ ์ ๋๋ค.
- ์ฌ์ฉ์ ๊ถํ์ ์กฐ์ ํ๋ ๋ฐฉ๋ฒ. ๊ฐ ์ฌ์ฉ์๋ ๋ก๊ทธ์ธํ์ง ์๊ณ ๋ 15๋ถ๋ง๋ค ํ ํฝ์ ์ ๊ทธ๋ฆด ์ ์์ต๋๋ค.
- ์ฟ ํค ์ธ์ ์ ์์ฑํฉ๋๋ค.
Squoosh
Squoosh๋ ๋ค์ํ ๊ณ ๊ธ ์ต์ ์ ๊ฐ์ถ ์ด๋ฏธ์ง ์์ถ ์ ํ๋ฆฌ์ผ์ด์ ์ ๋๋ค.
GIF 20MB
๋๋ง์ Squoosh ๋ฒ์ ์ ๋ง๋ค๋ฉด ๋ค์ ๋ด์ฉ์ ๋ฐฐ์ธ ์ ์์ต๋๋ค.
- ์ด๋ฏธ์ง ํฌ๊ธฐ ์์ ๋ฐฉ๋ฒ
- Drag'n'Drop API์ ๊ธฐ๋ณธ ์ฌํญ ์์๋ณด๊ธฐ
- API ๋ฐ ์ด๋ฒคํธ ๋ฆฌ์ค๋์ ์๋ ๋ฐฉ์ ์ดํด
- ํ์ผ์ ์ ๋ก๋ํ๊ณ ๋ด๋ณด๋ด๋ ๋ฐฉ๋ฒ
์ฐธ๊ณ : ์ด๋ฏธ์ง ์์ถ๊ธฐ๋ ๋ก์ปฌ์ ๋๋ค. ์ถ๊ฐ ๋ฐ์ดํฐ๋ฅผ ์๋ฒ์ ๋ณด๋ผ ํ์๋ ์์ต๋๋ค. ์์ถ๊ธฐ๋ฅผ ์ง์ ๋ ์๋ ์๊ณ ์๋ฒ์์ ์ฌ์ฉํ ์๋ ์์ต๋๋ค.
๊ณ์ฐ๊ธฐ
์ด์ ํด๋ด์? ์ง์งํ๊ฒ? ๊ณ์ฐ์? ๋ค, ์ ํํ๋ ๊ณ์ฐ๊ธฐ์ ๋๋ค. ์ํ ์ฐ์ฐ์ ๊ธฐ๋ณธ๊ณผ ํจ๊ป ์๋ํ๋ ๋ฐฉ์์ ์ดํดํ๋ ๊ฒ์ ์ ํ๋ฆฌ์ผ์ด์ ์ ๋จ์ํํ๋ ๋ฐ ์ค์ํ ๊ธฐ์ ์ ๋๋ค. ์กฐ๋ง๊ฐ ์ซ์๋ฅผ ๋ค๋ฃจ์ด์ผ ํ๋ฉฐ ๋น ๋ฅผ์๋ก ์ข์ต๋๋ค.
๋๋ง์ ๊ณ์ฐ๊ธฐ๋ฅผ ๋ง๋ค๋ฉด ๋ค์ ๋ด์ฉ์ ๋ฐฐ์ธ ์ ์์ต๋๋ค.
- ์ซ์ ๋ฐ ์ํ ์ฐ์ฐ ์์
- ์ด๋ฒคํธ ๋ฆฌ์ค๋ API ์ฐ์ต
- ์์๋ฅผ ์ ๋ ฌํ๊ณ ์คํ์ผ์ ์ดํดํ๋ ๋ฐฉ๋ฒ
ํฌ๋กค๋ฌ(๊ฒ์ ์์ง)
๋๊ตฌ๋ ๊ฒ์ ์์ง์ ์ฌ์ฉํด ๋ณธ ์ ์ด ์์ ๊ฒ์ ๋๋ค. ์์ ๋ง์ ๊ฒ์ ์์ง์ ๋ง๋ค์ด ๋ณด๋ ๊ฒ์ ์ด๋จ๊น์? ์ ๋ณด๋ฅผ ๊ฒ์ํ๋ ค๋ฉด ํฌ๋กค๋ฌ๊ฐ ํ์ํฉ๋๋ค. ๋ชจ๋ ์ฌ๋์ด ๋งค์ผ ์ด๋ฅผ ์ฌ์ฉํ๋ฉฐ ์ด ๊ธฐ์ ๊ณผ ์ ๋ฌธ๊ฐ์ ๋ํ ์์๋ ์๊ฐ์ด ์ง๋จ์ ๋ฐ๋ผ ์ฆ๊ฐํ ๊ฒ์ ๋๋ค.
๊ตฌ๊ธ ๊ฒ์ ์์ง
์์ ๋ง์ ๊ฒ์ ์์ง์ ๋ง๋ค์ด์ ๋ฐฐ์ธ ์ ์๋ ๋ด์ฉ์ ๋ค์๊ณผ ๊ฐ์ต๋๋ค.
- ํฌ๋กค๋ฌ ์๋ ๋ฐฉ์
- ์ฌ์ดํธ๋ฅผ ์์ธํํ๋ ๋ฐฉ๋ฒ๊ณผ ํ์ ๋ฐ ํํ์ ๊ธฐ์ค์ผ๋ก ์์๋ฅผ ๋งค๊ธฐ๋ ๋ฐฉ๋ฒ
- ์์ธํ๋ ์ฌ์ดํธ๋ฅผ ๋ฐ์ดํฐ๋ฒ ์ด์ค์ ์ ์ฅํ๋ ๋ฐฉ๋ฒ ๋ฐ ๋ฐ์ดํฐ๋ฒ ์ด์ค ์์ ๋ฐฉ๋ฒ
๋ฎค์ง ํ๋ ์ด์ด(์คํฌํฐํ์ด, ์ ํ ๋ฎค์ง)
๋ชจ๋๊ฐ ์์ ์ ๋ฃ์ต๋๋ค. ์์ ์ ์ฐ๋ฆฌ ์ถ์ ํ์์ ์ธ ๋ถ๋ถ์ ๋๋ค. ํ๋ ์์ ์คํธ๋ฆฌ๋ฐ ํ๋ซํผ์ ๊ธฐ๋ณธ ๋ฉ์ปค๋์ฆ์ด ์ด๋ป๊ฒ ์๋ํ๋์ง ๋ ์ ์ดํดํ๊ธฐ ์ํด ์์ ํ๋ ์ด์ด๋ฅผ ๋ง๋ค์ด ๋ณด๊ฒ ์ต๋๋ค.
์คํฌํฐ ํ์ด
๋๋ง์ ์์ ์คํธ๋ฆฌ๋ฐ ํ๋ซํผ์ ๋ง๋ค์ด์ ๋ฐฐ์ธ ์ ์ ๋ค์๊ณผ ๊ฐ์ต๋๋ค.
- API๋ก ์์ ํ๋ ๋ฐฉ๋ฒ. Spotify ๋๋ Apple Music์ API ์ฌ์ฉ
- ๋ค์/์ด์ ํธ๋ ์ฌ์, ์ผ์ ์ ์ง, ๋๊ฐ๊ธฐ ๋ฐฉ๋ฒ
- ๋ณผ๋ฅจ์ ๋ณ๊ฒฝํ๋ ๋ฐฉ๋ฒ
- ์ฌ์ฉ์ ๋ผ์ฐํ ๋ฐ ๋ธ๋ผ์ฐ์ ๊ธฐ๋ก์ ๊ด๋ฆฌํ๋ ๋ฐฉ๋ฒ
PS
๊ธฐ์ ์ ํฅ์์ํค๊ธฐ ์ํด ์ค์ค๋ก "๋ณต์ "ํ ๊ฒ์ ์ ์ํ๋ ํ๋ก์ ํธ๋ ๋ฌด์์
๋๊น?
์ถ์ฒ : habr.com