| ์ผ | ์ | ํ | ์ | ๋ชฉ | ๊ธ | ํ |
|---|---|---|---|---|---|---|
| 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 |
- css๋ณ์
- ์ฝ๋ฉ์์
- ์นui๋์์ธ
- uiux๋์์ธ
- ์น๊ฐ๋ฐ
- ๋ฐ๋๋ผjs
- ๋คํฌ๋ชจ๋ํ ๊ธ
- ํ๋ก ํธ์๋
- ๋ฐ๋๋ผ์คํฌ๋ฆฝํธ
- ์๋ฐ์คํฌ๋ฆฝํธui
- ui์ปดํฌ๋ํธ
- ์นUI
- JavaScript
- ํ ๋ง์๋์ ํ
- UX๋์์ธ
- ์ธํฐ๋ ํฐ๋ธui
- preferscolorscheme
- css์ ๋๋ฉ์ด์
- ์คํฌ๋ฆฐ๋ฆฌ๋์ง์
- ์๋ฐ์คํฌ๋ฆฝํธ์ปดํฌ๋ํธ
- ๋ก์ปฌ์คํ ๋ฆฌ์ง
- js์คํฌ๋กค์ด๋ฒคํธ
- ์๋ฐ์คํฌ๋ฆฝํธ
- ์น์ ๊ทผ์ฑ
- ์น๋์์ธ
- ์ ๊ทผ์ฑ
- ๋คํฌ๋ชจ๋
- ๋ฐ์ํ์น
- ์คํฌ๋กค์ ๋๋ฉ์ด์
- UIUX
- Today
- Total
๋ชฉ๋ก2025/07/04 (1)
UI Code Lab
์๋ฐ์คํฌ๋ฆฝํธ๋ก ๋ง๋๋ ์๋ฆผ(Toast) ์ปดํฌ๋ํธ
๐ ๊ฐ์ Toast ์๋ฆผ์ ์ฌ์ฉ์์๊ฒ ๋น ๋ฅด๊ณ ๊ฐ๋จํ ํผ๋๋ฐฑ์ ์ ๊ณตํ๋ UI ์์์ ๋๋ค. ์๋ฅผ ๋ค์ด “์ ์ฅ๋์์ต๋๋ค”์ฒ๋ผ ํ๋ฉด ์๋จ์ด๋ ํ๋จ์ ์งง๊ฒ ๋ํ๋๋ ์๋ฆผ ๋ง์ด์ฃ . ์ด ๊ธ์์๋ ๋ฐ๋๋ผ ์๋ฐ์คํฌ๋ฆฝํธ(Vanilla JS)๋ง์ผ๋ก ์ฌ์ฌ์ฉ ๊ฐ๋ฅํ toast ์ปดํฌ๋ํธ๋ฅผ ๋ง๋๋ ๋ฒ์ ์๊ฐํฉ๋๋ค. โ ์์ JS๋ก ๊ฐ๋ณ๊ฒ ๊ตฌํโ ์์น, ์ง์ ์๊ฐ, ์ ๋๋ฉ์ด์ ์ค์ ๊ฐ๋ฅโ ์คํฌ๋ฆฐ ๋ฆฌ๋ ์ฌ์ฉ์๋ ๊ณ ๋ คํ ์ ๊ทผ์ฑ ๐ก Toast UI๋?Toast๋ ํ๋ฉด ํ์ชฝ์ ๋ช ์ด๊ฐ ํ์๋๋ ์ผ์์ ์ธ ๋ฉ์์ง์ ๋๋ค. ์ฌ์ฉ์๊ฐ ๋ณ๋์ ์กฐ์ ์์ด ํผ๋๋ฐฑ์ ๋ฐ์ ์ ์์ด UX ํฅ์์ ํจ๊ณผ์ ์ด์ฃ . ๐ ์์ฃผ ์ฐ์ด๋ ์ํฉ ์์ํผ ์ ์ถ ํ “์ ์ถ์ด ์๋ฃ๋์์ต๋๋ค”๋ณต์ฌ ๋ฒํผ ํด๋ฆญ ์ “ํด๋ฆฝ๋ณด๋์ ๋ณต์ฌ๋จ”์ ์ฅ, ์ญ์ , ์ค๋ฅ ์๋ด ๋ฑ ๐ ๏ธ HTML..