diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000..1cc333b Binary files /dev/null and b/.DS_Store differ diff --git a/README.md b/README.md index 99b72d9..cde2cb1 100644 --- a/README.md +++ b/README.md @@ -1,50 +1,52 @@ -# ๐Ÿผ ํŒ๋‹ค๋งˆ์ผ“ ํ”„๋กœ์ ํŠธ +# ๐Ÿ“ [ํŒ๋‹ค๋งˆ์ผ“ ์›นํŽ˜์ด์ง€(์Šคํ”„๋ฆฐํŠธ ๋ฏธ์…˜)] -> _์ด ์ €์žฅ์†Œ๋Š” ํŒ๋‹ค๋งˆ์ผ“ ํ”„๋กœ์ ํŠธ์˜ ํ”„๋ก ํŠธ์—”๋“œ ์ฝ”๋“œ๋ฅผ ๊ด€๋ฆฌํ•˜๋Š” ๊ณณ์ž…๋‹ˆ๋‹ค. ํ”„๋กœ์ ํŠธ๋ฅผ ํด๋ก ํ•˜์—ฌ ๊ฐœ๋ฐœ ํ™˜๊ฒฝ์„ ์„ค์ •ํ•˜๊ณ , ๊ฐ ๋ธŒ๋žœ์น˜์—์„œ ํ•ด๋‹น ์Šคํ”„๋ฆฐํŠธ ๋ฏธ์…˜์„ ์ˆ˜ํ–‰ํ•ด ์ฃผ์„ธ์š”!_ ๐Ÿ› ๏ธ +![๋ฐฐ๋„ˆ ์ด๋ฏธ์ง€](/images/Group%2019.svg) +
+**ํ•œ ์ค„ ์†Œ๊ฐœ**: ๊ฑฐ๋ž˜์‚ฌ์ดํŠธ "ํŒ๋‹ค๋งˆ์ผ“"์˜ ์›นํŽ˜์ด์ง€๋ฅผ ๋งŒ๋“ญ๋‹ˆ๋‹ค. -## ์†Œ๊ฐœ +
-์•ˆ๋…•ํ•˜์„ธ์š”! ํŒ๋‹ค๋งˆ์ผ“ ํ”„๋กœ์ ํŠธ์— ์˜ค์‹  ๊ฒƒ์„ ํ™˜์˜ํ•ฉ๋‹ˆ๋‹ค! ๐Ÿฅณ -ํŒ๋‹ค๋งˆ์ผ“์€ ๋”ฐ๋œปํ•œ ์ค‘๊ณ ๊ฑฐ๋ž˜๋ฅผ ์œ„ํ•œ ์ปค๋ฎค๋‹ˆํ‹ฐ ํ”Œ๋žซํผ์ด์—์š”. ์—ฌ๋Ÿฌ๋ถ„์€ ์ด๊ณณ์—์„œ ์ƒํ’ˆ์„ ๋“ฑ๋กํ•˜๊ณ , ๋‹ค๋ฅธ ์‚ฌ์šฉ์ž๋“ค๊ณผ ์†Œํ†ตํ•˜๋ฉฐ, ์ž์œ ๋กญ๊ฒŒ ์ด์•ผ๊ธฐ๋ฅผ ๋‚˜๋ˆŒ ์ˆ˜ ์žˆ์–ด์š”. ๋งค์ฃผ ์Šคํ”„๋ฆฐํŠธ ๋ฏธ์…˜์„ ํ†ตํ•ด ๊ธฐ๋Šฅ์„ ํ•˜๋‚˜์”ฉ ๋งŒ๋“ค์–ด ๊ฐ€๋ฉฐ ์„ฑ์žฅํ•ด ๋‚˜๊ฐ€๋Š” ์—ฌ์ •์„ ํ•จ๊ป˜ํ•ด์š”. ๐Ÿš€ + +## ๐Ÿ”— ๋ฐฐํฌ ๋งํฌ (v2.2.1) +๐Ÿ‘‰ [์›น์‚ฌ์ดํŠธ ๋ณด๋Ÿฌ๊ฐ€๊ธฐ](https://sprint-project-min.netlify.app/) -![PandaMarket](https://github.com/user-attachments/assets/3784b99f-73c9-4349-a9a9-92b2a7563574) -_์œ„ ์ด๋ฏธ์ง€๋Š” ํŒ๋‹ค๋งˆ์ผ“์˜ ๋Œ€ํ‘œ ์ด๋ฏธ์ง€์ž…๋‹ˆ๋‹ค._ ๐Ÿ“ธ +
-## ์Šคํ”„๋ฆฐํŠธ ๋ฏธ์…˜์ด๋ž€? ๐Ÿค” +## ๐Ÿ’ก ํ”„๋กœ์ ํŠธ ์†Œ๊ฐœ (Description) +**์–ด๋–ค ์›น์‚ฌ์ดํŠธ์ธ๊ฐ€์š”?** +์ด ํ”„๋กœ์ ํŠธ๋Š” ์›น ๊ฐœ๋ฐœ ํ•™์Šต์„ ์œ„ํ•ด ์ œ์ž‘๋˜์—ˆ์Šต๋‹ˆ๋‹ค. ์Šคํ”„๋ฆฐํŠธ ๊ณผ์ œ๋ฅผ ์ˆ˜ํ–‰ํ•˜๋ฉฐ ์ฝ”๋”ฉ์‹ค๋ ฅ์„ ํ–ฅ์ƒ์‹œํ‚ค๋Š”๋ฐ ๋„์›€์ด ๋  ๊ฒƒ์ž…๋‹ˆ๋‹ค. ```VS code, Git, Figma``` ๋“ฑ ๋‹ค์–‘ํ•œ ๋„๊ตฌ์™€ ```netfliy``` ๋“ฑ์˜ ์‚ฌ์ดํŠธ๋ฅผ ํ†ตํ•ด ์ฝ”๋“œ์ž‘์„ฑ, ๋””์ž์ธ, ๊ณต์œ  ๋ฐ ๋ฐฐํฌ์˜ ๊ณผ์ •์„ ์ตํž ๊ฒƒ์ž…๋‹ˆ๋‹ค. ์ดˆ๋ฐ˜์—๋Š” ```html/ css/ javascript``` ๋“ฑ์˜ ๊ฐœ๋ฐœ์— ํ•„์š”ํ•œ ๊ธฐ๋ณธ ์Šคํƒ์„ ์ตํžˆ๋ฉฐ ๋‚˜์ค‘์—๋Š” ```react/ express``` ๋“ฑ์„ ๋ฐฐ์šฐ๊ณ  ํ™œ์šฉํ•  ๊ฒƒ์ž…๋‹ˆ๋‹ค. -์Šคํ”„๋ฆฐํŠธ ๋ฏธ์…˜์€ **ํ•˜๋‚˜์˜ ๊ฐœ์ธ ํ”„๋กœ์ ํŠธ๋ฅผ ๊ธธ๊ฒŒ ์ง„ํ–‰ํ•˜๋ฉด์„œ, ๊ทธ ๊ณผ์ •์—์„œ ์ฃผ๊ธฐ์ ์œผ๋กœ ํ”ผ๋“œ๋ฐฑ์„ ๋ฐ›์„ ์ˆ˜ ์žˆ๋Š” ์‹œ์Šคํ…œ**์ด์—์š”. ๊ฐ ์Šคํ”„๋ฆฐํŠธ๋งˆ๋‹ค ๋ฐฐ์šด ์ด๋ก ์„ ์ ์šฉํ•ด ๋ณด๊ณ , **๋ฉ˜ํ† ๋‹˜๊ป˜ ์ฝ”๋“œ ๋ฆฌ๋ทฐ๋ฅผ ๋ฐ›์•„๊ฐ€๋ฉฐ ์‹ค๋ ฅ์„ ์‘ฅ์‘ฅ ํ‚ค์›Œ๊ฐˆ ์ˆ˜ ์žˆ๋Š” ์ค‘์š”ํ•œ ๊ฐœ์ธ ๊ณผ์ œ**๋ž๋‹ˆ๋‹ค. ๐Ÿ’ช +**๊ฐœ๋ฐœ ๊ธฐ๊ฐ„** +* 2025.12.01 ~ ๊ฒŒ์† -## ์ฃผ์š” ๊ธฐ๋Šฅ โœจ +
-1. **์ƒํ’ˆ ๋“ฑ๋ก**: ๋‚ด๊ฐ€ ๊ฐ€์ง„ ๋ฌผ๊ฑด์„ ์˜ฌ๋ฆฌ๊ณ , ์‚ฌ์ง„๊ณผ ์„ค๋ช…์„ ์ถ”๊ฐ€ํ•ด ์ง์ ‘ ํŒ๋งคํ•  ์ˆ˜ ์žˆ์–ด์š”! -2. **๋ฌธ์˜ ๋Œ“๊ธ€**: ์ƒํ’ˆ์— ๋Œ€ํ•œ ๊ถ๊ธˆํ•œ ์ ์ด๋‚˜ ์˜๊ฒฌ์„ ์ž์œ ๋กญ๊ฒŒ ๋‚จ๊ธธ ์ˆ˜ ์žˆ๋‹ต๋‹ˆ๋‹ค. ๐Ÿ“ -3. **์ž์œ ๊ฒŒ์‹œํŒ**: ๋‹ค์–‘ํ•œ ์ฃผ์ œ๋กœ ์นœ๊ตฌ๋“ค๊ณผ ์ด์•ผ๊ธฐ๋ฅผ ๋‚˜๋ˆ„๊ณ , ์ •๋ณด๋ฅผ ๊ณต์œ ํ•  ์ˆ˜ ์žˆ๋Š” ๊ณต๊ฐ„์ด์—์š”! ๐Ÿ—ฃ๏ธ +## ๐Ÿ›  ๊ธฐ์ˆ  ์Šคํƒ (Tech Stack) -## ํ”„๋กœ์ ํŠธ ๋ธŒ๋žœ์น˜ ๊ตฌ์กฐ ๐Ÿ—๏ธ +| ๋ถ„๋ฅ˜ | ๊ธฐ์ˆ  | +| :-- | :-- | +| **Frontend** | ![React](https://img.shields.io/badge/React-20232A?style=flat&logo=react&logoColor=61DAFB) ![JavaScript](https://img.shields.io/badge/JavaScript-F7DF1E?style=flat&logo=javascript&logoColor=black) ![HTML5](https://img.shields.io/badge/HTML5-E34F26?style=flat&logo=html5&logoColor=white)| +| **Backend** | ![node.js](https://img.shields.io/badge/Node.js-339933?style=flat&logo=node.js&logoColor=white) ![express](https://img.shields.io/badge/Express.js-000000?style=flat&logo=express&logoColor=white)| +| **Styling** |![CSS3](https://img.shields.io/badge/CSS3-1572B6?style=flat&logo=css3&logoColor=white)| +| **Tools** | ![Git](https://img.shields.io/badge/Git-F05032?style=flat&logo=git&logoColor=white) ![VS Code](https://img.shields.io/badge/VS_Code-007ACC?style=flat&logo=visual-studio-code&logoColor=white)| -ํ”„๋กœ์ ํŠธ๋Š” ๋‹จ๊ณ„๋ณ„๋กœ ๋‚˜๋‰˜์–ด ์žˆ๊ณ , ๊ฐ ์Šคํ”„๋ฆฐํŠธ ๋ฏธ์…˜์— ๋งž๋Š” ๋ธŒ๋žœ์น˜๊ฐ€ ์žˆ์–ด์š”. ๊ฐ ๋ธŒ๋žœ์น˜๋ฅผ ํ†ตํ•ด ์ฒด๊ณ„์ ์œผ๋กœ ๊ฐœ๋ฐœํ•˜๋ฉฐ ํ•™์Šตํ•  ์ˆ˜ ์žˆ์–ด์š”. ๐ŸŽฏ +
-### ๋ธŒ๋žœ์น˜ ์„ค๋ช… +## โœจ ์ฃผ์š” ๊ธฐ๋Šฅ (Key Features) +* โœ… **๊ธฐ๋Šฅ 1**: ๊ฐ ํŽ˜์ด์ง€ ์ž‘์„ฑ ๋ฐ ๋””์ž์ธ +* โœ… **๊ธฐ๋Šฅ 2**: ๋งํฌ๋ฅผ ํ†ตํ•œ ํŽ˜์ด์ง€ ์—ฐ๊ฒฐ +* โœ… **๊ธฐ๋Šฅ 3**: github๋ฅผ ํ™œ์šฉํ•œ ๊ณต์œ  -1. **basic (part1): ์Šคํ”„๋ฆฐํŠธ ๋ฏธ์…˜ 1 ~ 4 FE ์š”๊ตฌ์‚ฌํ•ญ** +
- - ๊ธฐ๋ณธ์ ์ธ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ๊ธฐ๋Šฅ ๊ตฌํ˜„์„ ์œ„ํ•œ ์ดˆ๊ธฐ ๋ธŒ๋žœ์น˜์ž…๋‹ˆ๋‹ค. HTML, CSS, JavaScript ๋“ฑ์„ ์‚ฌ์šฉํ•ด ๊ธฐ๋ณธ์„ ๋‹ค์ง‘๋‹ˆ๋‹ค. - - **์Šคํ”„๋ฆฐํŠธ ๋ฏธ์…˜ 1๋ถ€ํ„ฐ 4๊นŒ์ง€**์˜ ํ”„๋ก ํŠธ์—”๋“œ ๋‚ด์šฉ์„ ํฌํ•จํ•˜๊ณ  ์žˆ์–ด์š”. +## ๐Ÿ“ธ ์Šคํฌ๋ฆฐ์ƒท (Screenshots) +| ๋ฉ”์ธ ํ™”๋ฉด | ๊ธฐ๋Šฅ ํ™”๋ฉด | +| :--: | :--: | +| ![Main](/images/screenshots/์Šคํฌ๋ฆฐ์ƒท%202025-12-05%20์˜คํ›„%201.16.00.png) | ![Feature](/images/screenshots/์Šคํฌ๋ฆฐ์ƒท%202025-12-05%20์˜คํ›„%201.15.37.png) | +
-2. **react (part2): ์Šคํ”„๋ฆฐํŠธ ๋ฏธ์…˜ 5 ~ 7 FE ์š”๊ตฌ์‚ฌํ•ญ** +## ๐Ÿ’ป ์‹คํ–‰ ๋ฐฉ๋ฒ• (Installation) +์ด ํ”„๋กœ์ ํŠธ๋ฅผ ๋กœ์ปฌ ์ปดํ“จํ„ฐ์—์„œ ์‹คํ–‰ํ•˜๋ ค๋ฉด ํ„ฐ๋ฏธ๋„์— ์•„๋ž˜ ๋ช…๋ น์–ด๋ฅผ ์ž…๋ ฅํ•˜์„ธ์š”. - - React ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ์‚ฌ์šฉํ•ด ํ”„๋ก ํŠธ์—”๋“œ ๊ธฐ๋Šฅ์„ ๊ตฌํ˜„ํ•˜๋Š” ๋ธŒ๋žœ์น˜์ž…๋‹ˆ๋‹ค. ์ปดํฌ๋„ŒํŠธ ๊ธฐ๋ฐ˜ ์•„ํ‚คํ…์ฒ˜์™€ ์ƒํƒœ ๊ด€๋ฆฌ๋ฅผ ๋ฐฐ์›๋‹ˆ๋‹ค. - - **์Šคํ”„๋ฆฐํŠธ ๋ฏธ์…˜ 5๋ถ€ํ„ฐ 7๊นŒ์ง€, ๊ทธ ์ดํ›„**์˜ ํ”„๋ก ํŠธ์—”๋“œ ๋‚ด์šฉ์„ ํฌํ•จํ•˜๊ณ  ์žˆ์–ด์š”. - - ๋งŒ์•ฝ ์Šคํ”„๋ฆฐํŠธ ๋ฏธ์…˜ 9๋ถ€ํ„ฐ ํ”„๋ก ํŠธ์—”๋“œ ์ฝ”๋“œ๋ฅผ Next๊ฐ€ ์•„๋‹Œ React๋กœ ๊ตฌํ˜„ํ•˜๊ณ  ์‹ถ๋‹ค๋ฉด react ๋ธŒ๋žœ์น˜๋ฅผ ์‚ฌ์šฉํ•ด์š”. - -3. **next (part3,4): ์Šคํ”„๋ฆฐํŠธ ๋ฏธ์…˜ 8 FE ์š”๊ตฌ์‚ฌํ•ญ~** - - - Next.js๋ฅผ ์‚ฌ์šฉํ•ด ์„œ๋ฒ„ ์‚ฌ์ด๋“œ ๋ Œ๋”๋ง(SSR)๊ณผ ์ •์  ์‚ฌ์ดํŠธ ์ƒ์„ฑ(SSG) ๋“ฑ ๊ณ ๊ธ‰ ๊ธฐ๋Šฅ์„ ๊ตฌํ˜„ํ•ฉ๋‹ˆ๋‹ค. - - **์Šคํ”„๋ฆฐํŠธ ๋ฏธ์…˜ 8๋ถ€ํ„ฐ** ์‹œ์ž‘ํ•˜๋Š” ํ”„๋ก ํŠธ์—”๋“œ ๋‚ด์šฉ์„ ํฌํ•จํ•˜๊ณ  ์žˆ์–ด์š”. - - ๋งŒ์•ฝ ์Šคํ”„๋ฆฐํŠธ ๋ฏธ์…˜ 9๋ถ€ํ„ฐ ํ”„๋ก ํŠธ์—”๋“œ ์ฝ”๋“œ๋ฅผ React๊ฐ€ ์•„๋‹Œ Next๋กœ ๊ตฌํ˜„ํ•˜๊ณ  ์‹ถ๋‹ค๋ฉด next ๋ธŒ๋žœ์น˜๋ฅผ ์‚ฌ์šฉํ•ด์š”. - -> _์Šคํ”„๋ฆฐํŠธ ๋ฏธ์…˜ ๋‚ด ๋ฐฑ์—”๋“œ ์š”๊ตฌ์‚ฌํ•ญ์€ [๋ฐฑ์—”๋“œ ๋ ˆํฌ์ง€ํ† ๋ฆฌ](https://github.com/codeit-sprint-fullstack/11-sprint-mission-be)์˜ ๋ธŒ๋žœ์น˜์—์„œ ๊ด€๋ฆฌํ•ด์ฃผ์„ธ์š”_ - ---- - -๋ณธ ํ”„๋กœ์ ํŠธ๋Š” [์ฝ”๋“œ์ž‡](https://www.codeit.kr)์˜ ์†Œ์œ ์ด๋ฉฐ, ๊ต์œก ๋ชฉ์ ์œผ๋กœ๋งŒ ์‚ฌ์šฉ๋ฉ๋‹ˆ๋‹ค. ยฉ 2025 Codeit. All rights reserved. +```bash +git clone https://github.com/alstjddl0513-sys/11-sprint-mission-fe.git diff --git a/css/login.css b/css/login.css new file mode 100644 index 0000000..d9ec8b8 --- /dev/null +++ b/css/login.css @@ -0,0 +1,127 @@ +* { + box-sizing: border-box; +} + +:root { + --primary-100: #3692ff; + --cool-gray-100: #f3f4f6; + --secondry-800: #1f2937; +} + +html { + font-size: 62.5%; +} + +body { + font-family: 'pretendard', sans-serif; + font-style: normal; + white-space: nowrap; + display: flex; + width: 100%; + padding: 23.1rem 64rem 28.4rem; + justify-content: center; + align-items: center; +} + +body#signup_page { + padding: 0.6rem 64rem 17.8rem; +} + +main { + display: flex; + width: 64rem; + flex-direction: column; + align-items: center; + flex-shrink: 0; +} + +a #logo { + width: 39.6rem; + height: 13.2rem; + margin-bottom: 4rem; +} + +.forms, +form { + display: flex; + flex-direction: column; + gap: 2.4rem; + width: 100%; +} + +.inputs input { + width: 100%; + margin-top: 1.6rem; + padding: 1.6rem 2.4rem; + border: 0rem; + border-radius: 1.2rem; + background-color: var(--cool-gray-100); +} + +.inputs label { + color: var(--secondry-800); + font-size: 1.8rem; + font-weight: 700; + line-height: 2.6rem; +} + +input:focus { + border: 0.1rem solid var(--primary-100); +} + +.login-button { + display: flex; + justify-content: center; + align-items: center; + height: 5.6rem; + padding: 1.6rem 12.4rem; + border-radius: 4rem; + background-color: #9ca3af; + color: var(--cool-gray-100); + font-size: 2rem; + font-weight: 600; + line-height: 3.2rem; + cursor: pointer; +} + +.login-button:hover { + background-color: var(--primary-100); +} + +h1 { + color: var(--secondry-800); + font-size: 1.6rem; + font-weight: 500; + line-height: 2.6rem; +} + +.easy-login { + width: 100%; + padding: 1.6rem 2.3rem; + margin: 2.4rem 0; + display: flex; + justify-content: space-between; + align-items: center; + border-radius: 0.8rem; + background-color: #e6f2ff; +} + +.icons { + display: flex; + gap: 1.6rem; +} + +.signup { + display: flex; + justify-content: center; + align-items: center; + gap: 0.4rem; + color: var(--secondry-800); + font-size: 1.4rem; + font-weight: 500; + line-height: 2.4rem; +} + +.signup a { + color: var(--primary-100); +} diff --git a/css/reset.css b/css/reset.css new file mode 100644 index 0000000..45a05ec --- /dev/null +++ b/css/reset.css @@ -0,0 +1,129 @@ +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) +*/ + +html, +body, +div, +span, +applet, +object, +iframe, +h1, +h2, +h3, +h4, +h5, +h6, +p, +blockquote, +pre, +a, +abbr, +acronym, +address, +big, +cite, +code, +del, +dfn, +em, +img, +ins, +kbd, +q, +s, +samp, +small, +strike, +strong, +sub, +sup, +tt, +var, +b, +u, +i, +center, +dl, +dt, +dd, +ol, +ul, +li, +fieldset, +form, +label, +legend, +table, +caption, +tbody, +tfoot, +thead, +tr, +th, +td, +article, +aside, +canvas, +details, +embed, +figure, +figcaption, +footer, +header, +hgroup, +menu, +nav, +output, +ruby, +section, +summary, +time, +mark, +audio, +video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +/* HTML5 display-role reset for older browsers */ +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +menu, +nav, +section { + display: block; +} +body { + line-height: 1; +} +ol, +ul { + list-style: none; +} +blockquote, +q { + quotes: none; +} +blockquote:before, +blockquote:after, +q:before, +q:after { + content: ""; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} diff --git a/css/style.css b/css/style.css new file mode 100644 index 0000000..82c2307 --- /dev/null +++ b/css/style.css @@ -0,0 +1,217 @@ +* { + box-sizing: border-box; +} + +html { + font-size: 62.5%; +} + +body { + font-family: "pretendard", sans-serif; + font-style: normal; + width: 100%; + white-space: nowrap; +} + +main { + background-color: #fcfcfc; + width: 100%; +} + +a { + text-decoration: none; + cursor: pointer; +} + +header { + padding: 0.9rem 20rem; + width: 100%; + height: 7rem; + border-bottom: 0.1rem solid #dfdfdf; + background-color: #ffffff; + position: sticky; + top: 0; +} + +.container { + display: flex; + justify-content: space-between; + align-items: center; +} + +.button { + display: inline-flex; + justify-content: center; + align-items: center; + background-color: #3692ff; + font-weight: 600; + gap: 1rem; +} + +#login-button { + width: 12.8rem; + height: 4.8rem; + padding: 1.2rem 2.3rem; + border-radius: 0.8rem; + color: #f3f4f6; + font-size: 1.6rem; + line-height: 2.6rem; +} + +#look-button { + width: 100%; + height: 5.6rem; + padding: 1.6rem 12.4rem; + border-radius: 4rem; + color: #f9fafb; + font-size: 2rem; + line-height: 3.2rem; +} + +h1 { + color: #374151; + font-size: 4rem; + font-weight: 700; + line-height: 140%; +} + +h1.sum { + letter-spacing: 0.08rem; +} + +.feature { + display: flex; + justify-content: center; + align-items: center; + padding: 13.8rem 34.4rem; + background-color: #ffffff; +} + +.content { + width: 98.8rem; + display: flex; + gap: 6.4rem; + justify-content: center; + align-items: center; +} + +.section-img { + width: 58.8rem; + height: 44.4rem; + flex-shrink: 0; +} + +.description { + display: flex; + flex-direction: column; + align-items: flex-start; + gap: 1.2rem; +} + +.tag { + color: #3692ff; + font-size: 1.8rem; + font-weight: 700; + line-height: 2.6rem; +} + +p { + margin-top: 1.2rem; + color: #374151; + font-size: 2.4rem; + font-weight: 500; + line-height: 3.2rem; +} + +footer { + width: 100%; + height: 16rem; + padding: 3.2rem 20rem; + background-color: #111827; + display: flex; + flex-direction: column; + align-items: flex-start; +} + +.foot { + width: 100%; + display: flex; + justify-content: space-between; + align-items: center; + font-size: 1.6rem; + font-weight: 400; + text-align: center; +} + +.foot a { + color: #e5e7eb; +} + +.codeit-foot { + color: #9ca3af; +} + +.footermenu { + display: flex; + align-items: flex-start; + gap: 3rem; +} + +.social-site { + display: flex; + align-items: center; + width: 11.6rem; + gap: 1.2rem; +} + +.imgs { + width: 74.6rem; + background-repeat: no-repeat; + background-position: center; + background-size: cover; + display: flex; + flex-shrink: 0; +} + +#img2.imgs { + height: 39.7rem; + background-image: url(/images/Img_home_bottom.svg); +} + +#img1.imgs { + height: 34rem; + background-image: url(/images/Img_home_top.svg); +} + +.cont { + display: flex; + justify-content: center; + align-items: center; +} + +#bottom .cont { + gap: 6.9rem; +} + +#top .cont { + gap: 0.7rem; +} + +.banner { + display: flex; + flex-direction: column; + gap: 3.2rem; + padding-bottom: 6rem; +} + +#bottom.banners { + margin-top: 13.8rem; +} + +.banners { + display: flex; + justify-content: center; + align-items: flex-end; + height: 54rem; + background-color: #cfe5ff; +} \ No newline at end of file diff --git a/faq.html b/faq.html new file mode 100644 index 0000000..7f45731 --- /dev/null +++ b/faq.html @@ -0,0 +1,19 @@ + + + + + ํŒ๋‹ค๋งˆ์ผ“-FAQ + + + + + + + ํŒ๋‹ค๋งˆ์ผ“-FAQ + + diff --git a/images/.DS_Store b/images/.DS_Store new file mode 100644 index 0000000..f4c674f Binary files /dev/null and b/images/.DS_Store differ diff --git a/images/Group 19.svg b/images/Group 19.svg new file mode 100644 index 0000000..31c250d --- /dev/null +++ b/images/Group 19.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/images/Img_home_01.svg b/images/Img_home_01.svg new file mode 100644 index 0000000..eb3c5ea --- /dev/null +++ b/images/Img_home_01.svg @@ -0,0 +1,67 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/images/Img_home_02.svg b/images/Img_home_02.svg new file mode 100644 index 0000000..eed41b9 --- /dev/null +++ b/images/Img_home_02.svg @@ -0,0 +1,23 @@ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/images/Img_home_03.svg b/images/Img_home_03.svg new file mode 100644 index 0000000..faa6979 --- /dev/null +++ b/images/Img_home_03.svg @@ -0,0 +1,53 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/images/Img_home_bottom.svg b/images/Img_home_bottom.svg new file mode 100644 index 0000000..e44de5d --- /dev/null +++ b/images/Img_home_bottom.svg @@ -0,0 +1,111 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/images/Img_home_top.svg b/images/Img_home_top.svg new file mode 100644 index 0000000..1cb74f2 --- /dev/null +++ b/images/Img_home_top.svg @@ -0,0 +1,78 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/images/favicon.ico b/images/favicon.ico new file mode 100644 index 0000000..9fecc69 Binary files /dev/null and b/images/favicon.ico differ diff --git a/images/icon/btn_visibility_off_24px.svg b/images/icon/btn_visibility_off_24px.svg new file mode 100644 index 0000000..d3076d6 --- /dev/null +++ b/images/icon/btn_visibility_off_24px.svg @@ -0,0 +1,3 @@ + + + diff --git a/images/icon/facebook.svg b/images/icon/facebook.svg new file mode 100644 index 0000000..e95500b --- /dev/null +++ b/images/icon/facebook.svg @@ -0,0 +1,3 @@ + + + diff --git a/images/icon/google.svg b/images/icon/google.svg new file mode 100644 index 0000000..72a799c --- /dev/null +++ b/images/icon/google.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/images/icon/ic_instagram.svg b/images/icon/ic_instagram.svg new file mode 100644 index 0000000..c83306f --- /dev/null +++ b/images/icon/ic_instagram.svg @@ -0,0 +1,3 @@ + + + diff --git a/images/icon/ic_twitter.svg b/images/icon/ic_twitter.svg new file mode 100644 index 0000000..14a6069 --- /dev/null +++ b/images/icon/ic_twitter.svg @@ -0,0 +1,3 @@ + + + diff --git a/images/icon/kakaotalk.svg b/images/icon/kakaotalk.svg new file mode 100644 index 0000000..e546fa5 --- /dev/null +++ b/images/icon/kakaotalk.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/images/icon/youtube.svg b/images/icon/youtube.svg new file mode 100644 index 0000000..3fea6e2 --- /dev/null +++ b/images/icon/youtube.svg @@ -0,0 +1,3 @@ + + + diff --git "a/images/screenshots/\354\212\244\355\201\254\353\246\260\354\203\267 2025-12-05 \354\230\244\355\233\204 1.15.37.png" "b/images/screenshots/\354\212\244\355\201\254\353\246\260\354\203\267 2025-12-05 \354\230\244\355\233\204 1.15.37.png" new file mode 100644 index 0000000..6ad26bb Binary files /dev/null and "b/images/screenshots/\354\212\244\355\201\254\353\246\260\354\203\267 2025-12-05 \354\230\244\355\233\204 1.15.37.png" differ diff --git "a/images/screenshots/\354\212\244\355\201\254\353\246\260\354\203\267 2025-12-05 \354\230\244\355\233\204 1.16.00.png" "b/images/screenshots/\354\212\244\355\201\254\353\246\260\354\203\267 2025-12-05 \354\230\244\355\233\204 1.16.00.png" new file mode 100644 index 0000000..17198fa Binary files /dev/null and "b/images/screenshots/\354\212\244\355\201\254\353\246\260\354\203\267 2025-12-05 \354\230\244\355\233\204 1.16.00.png" differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..acbc04f --- /dev/null +++ b/index.html @@ -0,0 +1,167 @@ + + + + + ํŒ๋‹ค๋งˆ์ผ“ + + + + + + + + + + +
+
+ + ํŒ๋‹ค๋งˆ์ผ“ ํ™ˆ์œผ๋กœ + + ๋กœ๊ทธ์ธ +
+
+ +
+
+
+ +
+
+
+ +
+
+ ์ธ๊ธฐ ์ƒํ’ˆ +
+

Hot item

+

+ ์ธ๊ธฐ ์ƒํ’ˆ์„ +
+ ํ™•์ธํ•ด ๋ณด์„ธ์š” +

+

+ ๊ฐ€์žฅ HOTํ•œ ์ค‘๊ณ ๊ฑฐ๋ž˜ ๋ฌผํ’ˆ์„ +
+ ํŒ ๋งˆ์ผ“์—์„œ ํ™•์ธํ•ด ๋ณด์„ธ์š” +

+
+
+
+ +
+
+
+

Search

+

+ ๊ตฌ๋งค๋ฅผ ์›ํ•˜๋Š” +
+ ์ƒํ’ˆ์„ ๊ฒ€์ƒ‰ํ•˜์„ธ์š” +

+

+ ๊ตฌ๋งคํ•˜๊ณ  ์‹ถ์€ ๋ฌผํ’ˆ์€ ๊ฒ€์ƒ‰ํ•ด์„œ +
+ ์‰ฝ๊ฒŒ ์ฐพ์•„๋ณด์„ธ์š” +

+
+ ๊ฒ€์ƒ‰ +
+
+ +
+
+ ๋“ฑ๋ก +
+

register

+

+ ํŒ๋งค๋ฅผ ์›ํ•˜๋Š” +
+ ์ƒํ’ˆ์„ ๋“ฑ๋กํ•˜์„ธ์š” +

+

+ ์–ด๋–ค ๋ฌผ๊ฑด์ด๋“  ํŒ๋งคํ•˜๊ณ  ์‹ถ์€ ์ƒํ’ˆ์„ +
+ ์‰ฝ๊ฒŒ ๋“ฑ๋กํ•˜์„ธ์š” +

+
+
+
+ +
+
+

+ ๋ฏฟ์„ ์ˆ˜ ์žˆ๋Š” +
+ ํŒ๋‹ค๋งˆ์ผ“ ์ค‘๊ณ ๊ฑฐ๋ž˜ +

+
+
+
+
+ + + + diff --git a/items.html b/items.html new file mode 100644 index 0000000..b4b0eac --- /dev/null +++ b/items.html @@ -0,0 +1,19 @@ + + + + + ํŒ๋‹ค๋งˆ์ผ“-ITEMS + + + + + + + ํŒ๋‹ค๋งˆ์ผ“-ITEMS + + diff --git a/login.html b/login.html new file mode 100644 index 0000000..c2d4a41 --- /dev/null +++ b/login.html @@ -0,0 +1,72 @@ + + + + + ํŒ๋‹ค๋งˆ์ผ“-LOGIN + + + + + + + +
+ + + + +
+
+
+ +
+ +
+
+ +
+ +
+
+ +
+ +
+

๊ฐ„ํŽธ ๋กœ๊ทธ์ธํ•˜๊ธฐ

+ +
+ +
+ ํŒ๋‹ค๋งˆ์ผ“์ด ์ฒ˜์Œ์ด์‹ ๊ฐ€์š”? + ํšŒ์›๊ฐ€์ž… +
+
+ + diff --git a/privacy.html b/privacy.html new file mode 100644 index 0000000..56425db --- /dev/null +++ b/privacy.html @@ -0,0 +1,19 @@ + + + + + ํŒ๋‹ค๋งˆ์ผ“-PRIVACY + + + + + + + ํŒ๋‹ค๋งˆ์ผ“-PRIVACY + + diff --git a/signup.html b/signup.html new file mode 100644 index 0000000..f8c3138 --- /dev/null +++ b/signup.html @@ -0,0 +1,93 @@ + + + + + ํŒ๋‹ค๋งˆ์ผ“-SIGNUP + + + + + + + +
+ + + + +
+
+
+ +
+ +
+
+ +
+ +
+
+ +
+ +
+
+ +
+ +
+
+ +
+ +
+

๊ฐ„ํŽธ ๋กœ๊ทธ์ธํ•˜๊ธฐ

+ +
+ +
+ ์ด๋ฏธ ํšŒ์›์ด์‹ ๊ฐ€์š”? + ๋กœ๊ทธ์ธ +
+
+ +