| ์ผ | ์ | ํ | ์ | ๋ชฉ | ๊ธ | ํ |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 | ||
| 6 | 7 | 8 | 9 | 10 | 11 | 12 |
| 13 | 14 | 15 | 16 | 17 | 18 | 19 |
| 20 | 21 | 22 | 23 | 24 | 25 | 26 |
| 27 | 28 | 29 | 30 | 31 |
- UX๋์์ธ
- ์คํฌ๋ฆฐ๋ฆฌ๋์ง์
- css์ ๋๋ฉ์ด์
- preferscolorscheme
- ui์ปดํฌ๋ํธ
- ๋คํฌ๋ชจ๋ํ ๊ธ
- ๋คํฌ๋ชจ๋
- JavaScript
- ์๋ฐ์คํฌ๋ฆฝํธui
- css๋ณ์
- ํ ๋ง์๋์ ํ
- ์น์ ๊ทผ์ฑ
- ์นui๋์์ธ
- uiux๋์์ธ
- ์น๋์์ธ
- js์คํฌ๋กค์ด๋ฒคํธ
- ๋ฐ์ํ์น
- ์คํฌ๋กค์ ๋๋ฉ์ด์
- ํ๋ก ํธ์๋
- ์นUI
- ๋ฐ๋๋ผjs
- ์๋ฐ์คํฌ๋ฆฝํธ
- ์ฝ๋ฉ์์
- ์ธํฐ๋ ํฐ๋ธui
- ๋ก์ปฌ์คํ ๋ฆฌ์ง
- ์ ๊ทผ์ฑ
- ์๋ฐ์คํฌ๋ฆฝํธ์ปดํฌ๋ํธ
- UIUX
- ๋ฐ๋๋ผ์คํฌ๋ฆฝํธ
- ์น๊ฐ๋ฐ
- Today
- Total
๋ชฉ๋ก2025/07/11 (1)
UI Code Lab
๋ฐ๋๋ผ ์๋ฐ์คํฌ๋ฆฝํธ๋ก ๋๋๊ทธ ์ค ๋๋กญ UI ์ปดํฌ๋ํธ ๊ตฌํํ๊ธฐ – ์ค์ ์ฌ๋ก ์ค์ฌ
์น UI์์ ์ฌ์ฉ์์์ ์ํธ์์ฉ์ ์์ฐ์ค๋ฝ๊ฒ ๋ง๋๋ ๋ฐฉ๋ฒ ์ค ํ๋๊ฐ ๋ฐ๋ก ๋๋๊ทธ ์ค ๋๋กญ ์ธํฐํ์ด์ค(Drag and Drop UI) ์ ๋๋ค. ํ์ผ ์ฒจ๋ถ, ๋ฆฌ์คํธ ์ ๋ ฌ, ๋์๋ณด๋ ๊ตฌ์ฑ ๋ฑ ๋ค์ํ ์ค๋ฌด ์ฌ๋ก์์ ์ฌ์ฉ๋๋ ์ด ๊ธฐ๋ฅ์ ์ฌ์ฉ์ ๊ฒฝํ(UX)์ ํฌ๊ฒ ํฅ์์ํฌ ์ ์์ต๋๋ค. ์ด ๊ธ์์๋ ๋ฐ๋๋ผ ์๋ฐ์คํฌ๋ฆฝํธ(Vanilla JavaScript)๋ฅผ ํ์ฉํ์ฌ ๋ค์ ์ธ ๊ฐ์ง ์ค์ ์ฌ๋ก๋ฅผ ์ค์ฌ์ผ๋ก ๋๋๊ทธ ์ค ๋๋กญ UI๋ฅผ ๊ตฌํํด ๋ณด๊ฒ ์ต๋๋ค. โ Gmail ์คํ์ผ์ ํ์ผ ์ฒจ๋ถ ๋๋กญ์กดโ TODO ์ฑ์์ ํ ์ผ ์์ ๋ณ๊ฒฝ ๊ธฐ๋ฅโ ๋์๋ณด๋ ์์ ฏ ์์น ์ด๋ UI ๐ 1. ํ์ผ ์ฒจ๋ถ ๋๋กญ์กด UI – Gmail ์คํ์ผ ๊ตฌํ ๋๋๊ทธ ์ค ๋๋กญ ๋ฐฉ์์ผ๋ก ํ์ผ์ ์ฒจ๋ถํ ์ ์๋ UI๋ ์ด๋ฉ์ผ, ๊ฒ์ํ, ๊ด๋ฆฌ์ ํ์ด์ง ๋ฑ์์ ๋ง์ด ์ฌ..