diff --git a/moving/.gitignore b/.gitignore similarity index 100% rename from moving/.gitignore rename to .gitignore diff --git a/moving/.prettierrc.json b/.prettierrc.json similarity index 100% rename from moving/.prettierrc.json rename to .prettierrc.json diff --git a/README.md b/README.md index a4a528c..70ffff9 100644 --- a/README.md +++ b/README.md @@ -1,83 +1,114 @@ -## ๐Ÿ’Œ MOVING 24.11.18 ~ 24.12.10 -![1](https://github.com/user-attachments/assets/0efc078d-9ac2-403e-9d17-f92372916268) -![6](https://github.com/user-attachments/assets/5b290893-8a0f-4b45-b669-efeca481794c) +

-์˜ํ™”๋ฅผ ๋ณด๋Š” ๋™์•ˆ ์ฆ๊ฑฐ์›€์ด ๊ฐ€๋“ํ•œ 'MOVING' +
-## ๐Ÿ™โ€โ™‚๏ธ ํŒ€์› ์†Œ๊ฐœ -|์ด๋ฆ„|์ƒ์„ธ ๋‚ด์šฉ| -|------|---| -|์žฅ์šฉํ•œ|๊ธฐํš, ๋ฉ”์ธ ํŽ˜์ด์ง€, ์žฅ๋ฅด๋ณ„ ์นดํ…Œ๊ณ ๋ฆฌ ํŽ˜์ด์ง€, ๊ฒ€์ƒ‰ ํŽ˜์ด์ง€ ๊ตฌํ˜„| -|์—ผ์ •ํ›ˆ|๊ธฐํš, ์ƒ์„ธ ๋ชจ๋‹ฌ ํŽ˜์ด์ง€, ๋™์˜์ƒ ์žฌ์ƒํŽ˜์ด์ง€| -|์ตœ์›ํ˜|๊ธฐํš, ์›น๋””์ž์ธ ๋ฐ ์™€์ด์–ดํ”„๋ ˆ์ž„, ๋žœ๋” ํŽ˜์ด์ง€| +![แ„†แ…ฎแ„‡แ…ตแ†ผแ„…แ…ฉแ„€แ…ฉ 2](https://github.com/user-attachments/assets/10da6499-5b47-4f89-8e50-dd46226fa759) -## ๐Ÿ“Œ ํ”„๋กœ์ ํŠธ ์†Œ๊ฐœ -์ตœ์‹  ์ŠคํŠธ๋ฆฌ๋ฐ ์„œ๋น„์Šค์˜ ํŠธ๋ Œ๋“œ๋ฅผ ๋ฐ˜์˜ํ•˜์—ฌ, ์‚ฌ์šฉ์ž์—๊ฒŒ ๋” ๋‚˜์€ ๊ฒฝํ—˜์„ ์ œ๊ณตํ•˜๊ธฐ ์œ„ํ•ด ์„ค๊ณ„๋œ TypeScript ๊ธฐ๋ฐ˜์˜ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์ž…๋‹ˆ๋‹ค. ์ด ํ”„๋กœ์ ํŠธ๋Š” ์‚ฌ์šฉ์ž ์ค‘์‹ฌ์˜ ์ง๊ด€์ ์ธ UI/UX ๋””์ž์ธ๊ณผ ์ตœ์‹  ๊ธฐ์ˆ ์„ ๊ฒฐํ•ฉํ•˜์—ฌ, ๋‹ค์–‘ํ•œ ์ฝ˜ํ…์ธ ๋ฅผ ๋ณด๋‹ค ์‰ฝ๊ฒŒ ํƒ์ƒ‰ํ•˜๊ณ  ์ฆ๊ธธ ์ˆ˜ ์žˆ๋„๋ก ํ•ฉ๋‹ˆ๋‹ค. +
+ +

+ +**์ตœ์‹  ์˜ํ™” ์˜ˆ๊ณ ํŽธ๊ณผ ๊ด€๋ จ ์ •๋ณด๋ฅผ ๋ณผ์ˆ˜ ์žˆ๋Š” OTTํ”Œ๋žซํผ**
+TMDB API๋ฅผ ์ด์šฉํ•œ OTT์„œ๋น„์Šค๋กœ ์นดํ…Œ๊ณ ๋ฆฌ๋ณ„ ์˜ํ™” ์ถ”์ฒœ๊ณผ ๊ฒ€์ƒ‰์ด ๊ฐ€๋Šฅํ•ฉ๋‹ˆ๋‹ค. +
+์˜ํ™”๋ณ„ ์—ฐ๊ด€๋œ ์ถ”์ฒœ ์˜ํ™”, ์ถœ์—ฐ์ง„, ์Šคํ† ๋ฆฌ ๋“ฑ ๊ฐ„๋‹จํ•œ ์˜ํ™” ์ •๋ณด๋ฅผ ์กฐํšŒ ํ•˜์‹ค์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. -## ๐Ÿ“ƒ ์ƒ์„ธ ๊ณ„ํš -[๋…ธ์…˜ ์ƒ์„ธ ๊ณ„ํš ๋งํฌ](https://www.notion.so/12e2e48b770d805cb0d3ddb022f87f83) +--- -## ๐Ÿ“„ ๋ฐฐํฌ ์‚ฌ์ดํŠธ -[๋ฐฐํฌ ์‚ฌ์ดํŠธ ๋งํฌ](https://ott-moving.vercel.app/) +>

์‚ฌ์ด๋“œ ํ”„๋กœ์ ํŠธ
2024.11.18 โˆผ 2024.12.10

+ +
+

๋ฐฐํฌ ์‚ฌ์ดํŠธ

+https://moving-project-ott.vercel.app/๐Ÿ”— +
+ +
+
## ๐Ÿ“š ๊ธฐ์ˆ  ์Šคํƒ +
- - - - - - - - - + +![html5](https://img.shields.io/badge/html5-E34F26?style=for-the-badge&logo=html5&logoColor=black) +![css3](https://img.shields.io/badge/css3-1572B6?style=for-the-badge&logo=css3&logoColor=black) +![next](https://img.shields.io/badge/Next.js-ffffff?style=for-the-badge&logo=next.js&logoColor=black) +![ts](https://img.shields.io/badge/TypeScript-007ACC?style=for-the-badge&logo=typescript&logoColor=white) +![js](https://img.shields.io/badge/JavaScript-F7DF1E?style=for-the-badge&logo=javaScript&logoColor=black) +![framer](https://img.shields.io/badge/Framer-0055FF?style=for-the-badge&logo=framer&logoColor=white) +![zustand](https://img.shields.io/badge/zustand-20232A?style=for-the-badge&logo=zustand&logoColor=white) +![tanstackquery](https://img.shields.io/badge/tanstackquery-20232A?style=for-the-badge&logo=tanstackquery&logoColor=white) +![tailwindCss](https://img.shields.io/badge/Tailwind_CSS-38B2AC?style=for-the-badge&logo=tailwind-css&logoColor=white) +![figma](https://img.shields.io/badge/figma-F24E1E?style=for-the-badge&logo=figma&logoColor=black) +
-## ๐Ÿ“ ํ”„๋กœ์ ํŠธ ๊ตฌ์กฐ -``` -โ”œโ”€ ๐Ÿ“‚.github -โ”‚ โ””โ”€ ๐Ÿ“‚ISSUE_TEMPLATE -โ”‚ โ”œโ”€ Issue_Templage -โ”‚ โ””โ”€ pull_request_template.md -โ”œโ”€ .gitignore -โ”œโ”€ README.md -โ”œโ”€ next.config.mjs -โ”œโ”€ package-lock.json -โ”œโ”€ package.json -โ”œโ”€ postcss.config.mjs -โ”œโ”€ public -โ”‚ โ””โ”€ -โ”‚ โ””โ”€ ๐Ÿ“‚icons -โ”‚ โ””โ”€ ๐Ÿ“‚images -โ””โ”€ ๐Ÿ“‚src -โ”œโ”€ ๐Ÿ“‚apis -โ”œโ”€ ๐Ÿ“‚components -โ”œโ”€ ๐Ÿ“‚lib -โ””โ”€ ๐Ÿ“‚apis -โ””โ”€ ๐Ÿ“‚store -โ””โ”€ ๐Ÿ“‚fonts -โ””โ”€ ๐Ÿ“‚hook -โ””โ”€ ๐Ÿ“‚utils -โ”œโ”€ ๐Ÿ“‚pages -โ”œโ”€ ๐Ÿ“‚style -โ”œโ”€ ๐Ÿ“‚types -``` - -## ๐ŸŽž ๊ตฌํ˜„ GIF -![๋ฉ”์ธํŽ˜์ด์ง€1](https://github.com/user-attachments/assets/b041f198-86cd-470f-8e6a-312c9c768ef4) -![์žฅ๋ฅดํŽ˜์ด์ง€](https://github.com/user-attachments/assets/62fb12c6-977e-472f-959d-d4eeb4bde8a5) -![๊ฒ€์ƒ‰ํŽ˜์ด์ง€](https://github.com/user-attachments/assets/6c73c826-401e-4991-9c4c-607a26805485) - - - -## ๐Ÿ˜€ ์žฅ์šฉํ•œ -- ott ์‚ฌ์ดํŠธ์— ๊ด€์‹ฌ์ด ๋งŽ์ด ์žˆ์—ˆ๋Š”๋ฐ ์ง์ ‘ ๊ตฌํ˜„ํ•ด๋ณด๊ณ  ์–ด๋–ค ์‹์œผ๋กœ ํŽ˜์ด์ง€๊ฐ€ ๋™์ž‘ํ•˜๋Š”์ง€ ํ•™์Šตํ• ์ˆ˜ ์žˆ์–ด์„œ ์ข‹์•˜์Šต๋‹ˆ๋‹ค -- ๋ฉ”์ธ ํŽ˜์ด์ง€์™€ ์žฅ๋ฅด/๊ฒ€์ƒ‰ ํŽ˜์ด์ง€๋ฅผ ๋งŒ๋“ค๋ฉด์„œ ๋งŽ์€ ๋ฐ์ดํ„ฐ๋ฅผ ๋ถˆ๋Ÿฌ์˜ฌ๋•Œ ์„ฑ๋Šฅ์„ ์ƒ๊ฐํ•˜๋ฉฐ ๊ตฌํ˜„ํ•˜๋‹ค๋ณด๋‹ˆ image์ปดํฌ๋„ŒํŠธ์˜ ์—ฌ๋Ÿฌ ์˜ต์…˜๋“ค์ด๋‚˜ ๋ฐ์ดํ„ฐ๋ฅผ ๊ฐ€์ ธ์˜ค๋Š” ๋ฐฉ์‹์— ๋Œ€ํ•ด ๊นŠ๊ฒŒ ๊ณต๋ถ€ํ• ์ˆ˜ ์žˆ์–ด์„œ ์ข‹์•˜์Šต๋‹ˆ๋‹ค - -## ๐Ÿค” ์—ผ์ •ํ›ˆ -- ํ•œ๋ฒˆ์ฏค ๊ผญ ๋งŒ๋“ค์–ด ๋ณด๊ณ  ์‹ถ์—ˆ๋˜ ํ”„๋กœ์ ํŠธ๋ฅผ ์›ํ•˜๋Š” ๊ธฐ๋Šฅ๊ณผ ํ•จ๊ผ ์ง์ ‘ ๊ตฌํ˜„ํ•ด ๋ณผ ์ˆ˜ ์žˆ๊ฒŒ ๋˜์–ด์„œ ์ •๋ง ์ข‹์•˜์Šต๋‹ˆ๋‹ค. -- ๊ธฐ์กด์—๋Š” ํŽ˜์ด์ง€ ๋„ค์ด์…˜์ด๋‚˜ ์ •๋ ฌ ๊ธฐ๋Šฅ์ด ์™„์„ฑ๋˜์–ด ์žˆ๊ณ  params๋งŒ ์ˆ˜์ •ํ•˜๋ฉด ๋˜์—ˆ์ง€๋งŒ ์ด๋ฒˆ์—๋Š” ์ง์ ‘ ๊ตฌํ˜„ํ•ด ๋ณผ ์ˆ˜ ์žˆ๋Š” ๊ฒฝํ—˜์„ ํ•ด์„œ ์ข‹์•˜์Šต๋‹ˆ๋‹ค. - -## ๐Ÿ˜„ ์ตœ์›ํ˜ -- ํŒ€ํ”„๋กœ์ ํŠธ๋ฅผ ํ• ๋•Œ ๊ฒฝํ—˜ํ•˜์ง€ ๋ชปํ–ˆ๋˜ ๊ธฐํš๋‹จ๊ณ„์™€ ๋””์ž์ธ๊นŒ์ง€ ๋ฌด๋น™ ํ”„๋กœ์ ํŠธ๋ฅผ ํ•˜๊ฒŒ ๋˜๋ฉด์„œ ๊ฒฝํ—˜ํ•ด ๋ณผ ์ˆ˜ ์žˆ์–ด์„œ ์ข‹์•˜์Šต๋‹ˆ๋‹ค -- ํ•™์›์ธก์—์„œ ์ œ๊ณตํ•ด์ฃผ๋Š” API๊ฐ€ ์•„๋‹Œ ์ง์ ‘ ๋‹ค๋ฅธ ์‚ฌ์ดํŠธ์˜ API๋ฅผ ๊ฐ€์ ธ์™€ ์ž‘์—…ํ•˜๊ฒŒ ๋˜์–ด ๋ฐ์ดํ„ฐ์™€ API์— ๋Œ€ํ•ด์„œ ์ข€ ๋” ์ดํ•ดํ•  ์ˆ˜ ์žˆ์—ˆ์Šต๋‹ˆ๋‹ค. +

+ +## ๐Ÿ“Œ ํ”„๋กœ์ ํŠธ ์†Œ๊ฐœ + +image + +

+MOVING์—์„œ ์ถ”์ฒœํ•˜๋Š” ์˜ํ™” ๋ชฉ๋ก์„ ํ™•์ธํ• ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. +
+
+TMDB ์˜คํ”ˆ API๋ฅผ ํ†ตํ•ด ์˜ํ™”์˜ ๊ฐ์ข… ์ •๋ณด์™€ ์œ ํŠœ๋ธŒ key๋ฅผ ํ†ตํ•ด ์˜ˆ๊ณ ํŽธ์„ ๋ถˆ๋Ÿฌ์™€ ๋ฉ”์ธ ๋ฒ ๋„ˆ์—์„œ ํ™•์ธํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. +axios์™€ React Query๋ฅผ ํ†ตํ•œ ๋ฐ์ดํ„ฐ ํŒจ์นญ๊ณผ, pramer motion์„ ํ†ตํ•œ ์• ๋‹ˆ๋ฉ”์ด์…˜ ํšจ๊ณผ๋กœ ๋ถ€๋“œ๋Ÿฌ์šด ์‚ฌ์šฉ์„ฑ, next/Image์ปดํฌ๋„ŒํŠธ๋ฅผ ํ†ตํ•œ ์ด๋ฏธ์ง€ ์ตœ์ ํ™” ์ž‘์—…์„ ์ค‘์‹ฌ์œผ๋กœ ๊ตฌํ˜„ํ•˜์˜€์Šต๋‹ˆ๋‹ค. +

+ +

+ +## ๐Ÿ“Œ ํŠธ๋Ÿฌ๋ธ” ์ŠˆํŒ… + +[๋ฌธ์ œ] +
+ +- ์ด๋ฏธ์ง€ ์ฒ˜๋ฆฌ ๋ถ€๋ถ„์—์„œ ๋น„ํšจ์œจ์„ฑ๊ณผ ๊ณผ๋„ํ•œ ๋ฆฌ๋žœ๋”๋ง์œผ๋กœ ์ธํ•ด ํŽ˜์ด์ง€ ์„ฑ๋Šฅ ์ €ํ•˜ + +[์›์ธ] + +- ๋ฐ˜์‘ํ˜•์„ ์œ„ํ•ด image์†์„ฑ์— fill์„ ์ ์šฉ ํ•˜์˜€์ง€๋งŒ ์‚ฌ์ด์ฆˆ ์ง€์ •์ด + ๋˜์–ด์žˆ์ง€ ์•Š์•„์„œ ์ตœ์ ํ™”๋œ ์ด๋ฏธ์ง€ ์šฉ๋Ÿ‰์œผ๋กœ ๊ฐ€์ ธ์˜ค์ง€ ๋ชปํ•จ +- ๋น„๋™๊ธฐ์ ์œผ๋กœ ๋™์˜์ƒ๊ณผ ์ด๋ฏธ์ง€๋ฅผ ๊ฐ€์ ธ์˜ค๋ฉด์„œ ๋กœ๋”ฉ์ค‘ ํ•ด๋‹น ์˜์—ญ์ด + ์—†์–ด์ง€๋ฉฐ CLS๋ฌธ์ œ๊ฐ€ ๋ฐœ์ƒํ•จ +- ๋ชจ๋“  ์ด๋ฏธ์ง€๋ฅผ ํ•œ๋ฒˆ์— ๋ถˆ๋Ÿฌ์™€ ์„ฑ๋Šฅ ๋ถ€๋‹ด ์ฆ๊ฐ€ + +[ํ•ด๊ฒฐ] + +- fill ์†์„ฑ๊ณผ size์†์„ฑ์„ ์ถ”๊ฐ€ํ•˜์—ฌ ์ด๋ฏธ์ง€ ์šฉ๋Ÿ‰์„ ์ตœ์ ํ™”ํ•ด 1/10๋กœ + ์ด๋ฏธ์ง€ ์šฉ๋Ÿ‰ ๊ฐ์†Œ + + > ์ด๋ฏธ์ง€ ์›๋ณธ ์‚ฌ์ด์ฆˆ๋กœ ๋ฐ์ดํ„ฐ ๋กœ๋”ฉ + > ![alt text](image-1.png) + > size์†์„ฑ ์ ์šฉ ํ›„ + > ![alt text](image-2.png) + +- ๋กœ๋”ฉ์‹œ ์Šค์ผˆ๋ ˆํ†ค UI ์ ์šฉ์œผ๋กœ ๋Œ€๊ทœ๋ชจ ๋ ˆ์ด์•„์›ƒ ์ด๋™์„ ๋ฐฉ์ง€ํ•˜๊ณ  + CLS๋ฅผ ๊ฐœ์„ ํ•˜์—ฌ ๋” ๋ถ€๋“œ๋Ÿฌ์šด ์ธํ„ฐ๋ž™์…˜์„ ์ œ๊ณต. + ![alt text](image-4.png) +- lazyLoading์„ ์ ์šฉํ•ด ๋ฉ”๋ชจ๋ฆฌ ์‚ฌ์šฉ ์ตœ์ ํ™”์™€ ์ดˆ๊ธฐ ๋กœ๋”ฉ ์†๋„๋ฅผ + ๊ฐœ์„ (์Šคํฌ๋กค์‹œ ๋ฐ์ดํ„ฐ ์ถ”๊ฐ€๋กœ ๋ถˆ๋Ÿฌ์˜ด) + ![alt text](image-3.png) + +


+ +## ๐Ÿ“ˆ ์„ฑ๋Šฅ ๊ฐœ์„  + +> ๊ฐœ์„ ์ „
![alt text](image-5.png) + +> ๊ฐœ์„ ํ›„
![alt text](image-6.png) + +- LCP๊ฐ€ 65.2% ๊ฐœ์„  +- TBT๊ฐ€ 50% ๊ฐ์†Œ +- CLS๊ฐ€ 69.2% ๊ฐœ์„  +- Speed Index 20% ํ–ฅ์ƒ + +
+ +## ๐Ÿ™โ€โ™‚๏ธ ํŒ€์› ์†Œ๊ฐœ + +| ์ด๋ฆ„ | ์ƒ์„ธ ๋‚ด์šฉ | +| ------ | ----------------------------------------------------------- | +| ์žฅ์šฉํ•œ | ๊ธฐํš, ๋ฉ”์ธ ํŽ˜์ด์ง€, ์žฅ๋ฅด๋ณ„ ์นดํ…Œ๊ณ ๋ฆฌ ํŽ˜์ด์ง€, ๊ฒ€์ƒ‰ ํŽ˜์ด์ง€ ๊ตฌํ˜„ | +| ์—ผ์ •ํ›ˆ | ๊ธฐํš, ์ƒ์„ธ ๋ชจ๋‹ฌ ํŽ˜์ด์ง€, ๋™์˜์ƒ ์žฌ์ƒํŽ˜์ด์ง€ | +| ์ตœ์›ํ˜ | ๊ธฐํš, ์›น๋””์ž์ธ ๋ฐ ์™€์ด์–ดํ”„๋ ˆ์ž„, ๋žœ๋” ํŽ˜์ด์ง€ | diff --git a/image-1.png b/image-1.png new file mode 100644 index 0000000..b30950e Binary files /dev/null and b/image-1.png differ diff --git a/image-2.png b/image-2.png new file mode 100644 index 0000000..16f4202 Binary files /dev/null and b/image-2.png differ diff --git a/image-3.png b/image-3.png new file mode 100644 index 0000000..0f68625 Binary files /dev/null and b/image-3.png differ diff --git a/image-4.png b/image-4.png new file mode 100644 index 0000000..4bf98b3 Binary files /dev/null and b/image-4.png differ diff --git a/image-5.png b/image-5.png new file mode 100644 index 0000000..b1d603f Binary files /dev/null and b/image-5.png differ diff --git a/image-6.png b/image-6.png new file mode 100644 index 0000000..792c877 Binary files /dev/null and b/image-6.png differ diff --git a/image.png b/image.png new file mode 100644 index 0000000..f98b375 Binary files /dev/null and b/image.png differ diff --git a/moving/README.md b/moving/README.md deleted file mode 100644 index ef0e47e..0000000 --- a/moving/README.md +++ /dev/null @@ -1,40 +0,0 @@ -This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/pages/api-reference/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -# or -bun dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file. - -[API routes](https://nextjs.org/docs/pages/building-your-application/routing/api-routes) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`. - -The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/pages/building-your-application/routing/api-routes) instead of React pages. - -This project uses [`next/font`](https://nextjs.org/docs/pages/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn-pages-router) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/pages/building-your-application/deploying) for more details. diff --git a/moving/src/pages/index.tsx b/moving/src/pages/index.tsx deleted file mode 100644 index dda62e1..0000000 --- a/moving/src/pages/index.tsx +++ /dev/null @@ -1,271 +0,0 @@ -import Image from 'next/image'; -import Slide from '@/components/detail/components/Slider'; -import YoutubeIcon from '@/icons/youtubeIcon.svg'; -import XIcon from '@/icons/x(sns)Icon.svg'; -import LogoGray from '@/icons/LogoGray.svg'; -import TiktokIcon from '@/icons/tiktokIcon.svg'; -import InstarIcon from '@/icons/instagramIcon.svg'; -import Recent from '@/components/render/Recent'; -import { useRouter } from 'next/router'; - -export default function Home() { - const router = useRouter(); - - const handleButtonClick = () => { - router.push('/mainPage'); - }; - - return ( - <> -
-
-
- - ๋ฉ”์ธ ๋ฒ ๋„ˆ -
-

- - ์ธ๊ธฐ ์ƒ์˜์ž‘๋ถ€ํ„ฐ

๊ณง ๊ฐœ๋ด‰ํ•˜๋Š” ๋”ฐ๋ˆํ•œ ์‹ ์ž‘๋“ค๊นŒ์ง€!

-  ๋ฌด์ œํ•œ์œผ๋กœ ์ŠคํŠธ๋ฆฌ๋ฐ ํ•ด๋ณด์„ธ์š”. -
-

- -
-
-
-
-

- ๋งค๋‹ฌ ์ƒˆ๋กญ๊ฒŒ ์ถ”๊ฐ€๋˜๋Š” MOVING ์ฝ˜ํ…์ธ ๋ฅผ

์–ธ์ œ๋‚˜ย ๊ด‘๊ณ ย ์—†์ด. -

-

- ๋ชฐ์ž…๊ฐ ๋„˜์น˜๋Š” ๊ณต๊ฐ„ ์Œํ–ฅ์œผ๋กœ ๊ฐ์ƒํ•˜๋Š” 4Kย HDRย ์˜์ƒ

ํ•˜๋‚˜์˜ - ๋ฉค๋ฒ„์‹ญ์œผ๋กœ ์ตœ๋Œ€ย 5๋ช…๊ณผ ํ•จ๊ป˜. -

-

- ์Šค๋งˆํŠธ ๊ธฐ๊ธฐ, ์Šค๋งˆํŠธย TV, ๊ฒŒ์ž„ ์ฝ˜์†” ๋˜๋Š” ์Šคํ‹ฑ ๋“ฑ์„ ํ†ตํ•ด

- MOVINGย ์•ฑ์—์„œ ์ŠคํŠธ๋ฆฌ๋ฐ ๊ฐ€๋Šฅ. -

- -
-
- {[ - { - title: 'BASIC', - price: '5,500', - priceColor: 'text-gray-100', - borderColor: '#363636', - cardColor: '#202125', - quality: '์ข‹์Œ', - resolution: '1080p (ํ’€HD)', - devices: 'TV, ์ปดํ“จํ„ฐ, ์Šค๋งˆํŠธํฐ, ํƒœ๋ธ”๋ฆฟ', - deviceCount: '2', - ads: '์ ์€ ๊ด‘๊ณ ', - tags: [], - imageCount: 1, - }, - { - title: 'STANDARD', - price: '7,500', - priceColor: 'text-blue-400', - borderColor: '#363636', - cardColor: '#202125', - quality: '๋งค์šฐ ์ข‹์Œ', - resolution: '1080p (ํ’€HD)', - devices: 'TV, ์ปดํ“จํ„ฐ, ์Šค๋งˆํŠธํฐ, ํƒœ๋ธ”๋ฆฟ', - deviceCount: '2', - ads: '๊ด‘๊ณ  ์—†์Œ', - tags: [{ label: '๊ณ ํ™”์งˆ', color: '#d9d9d9' }], - imageCount: 2, - }, - { - title: 'PREMIUM', - price: '12,500', - priceColor: 'text-yellow-400', - cardColor: '#202125', - borderColor: '#2D73F3', - quality: '๋งค์šฐ ์ข‹์Œ', - resolution: '4K(UHD) + HDR', - devices: 'TV, ์ปดํ“จํ„ฐ, ์Šค๋งˆํŠธํฐ, ํƒœ๋ธ”๋ฆฟ', - deviceCount: '4', - ads: '๊ด‘๊ณ  ์—†์Œ', - tags: [ - { label: '๊ฐ€์žฅ ์ธ๊ธฐ์žˆ๋Š”', color: '#2D73F3' }, - { label: 'ํ”„๋ฆฌ๋ฏธ์—„', color: '#2D73F3' }, - ], - imageCount: 3, - }, - ].map((plan, index) => ( -
-
-

- {plan.title} -

- {plan.tags.map((tag, tagIndex) => ( - - {tag.label} - - ))} -

- {plan.price} - - ์› / ์›” - -

-
- -
- {Array.from({ length: plan.imageCount }).map( - (_, imageIndex) => ( - {`check - ) - )} -
-
    -
  • - - ํ™”์งˆ๊ณผ ์Œ์งˆ - {' '} - {plan.quality} -
  • -
  • - - ํ•ด์ƒ๋„ - {' '} - {plan.resolution} -
  • -
  • - - ๋””๋ฐ”์ด์Šค - {' '} - {plan.devices} -
  • -
  • - - ๊ธฐ๊ธฐ ์ˆ˜ - {' '} - {plan.deviceCount} -
  • -
  • - - ๊ด‘๊ณ  - {' '} - {plan.ads} -
  • -
-
- ))} -
-
-
-
-

- ์˜ํ™”๋ฅผ ๊ฐ€์žฅ ๋น ๋ฅด๊ฒŒ -

-

- ์˜ค์ง ๋ฌด๋น™์—์„œ๋งŒ -
๊ฐœ๋ด‰ ์˜ํ™”๋ฅผ ๊ฐ์ƒํ•ด ๋ณด์„ธ์š”. -

- - -
- - -
-
- ๋ฉ”์ธ ๋ฒ ๋„ˆ -
-
-

- ์ง€๊ธˆ ์‹œ์ž‘ํ•ด๋ณด์„ธ์š”. -

-
-
- -
-
-
-
- - - ); -} diff --git a/moving/next.config.ts b/next.config.ts similarity index 100% rename from moving/next.config.ts rename to next.config.ts diff --git a/moving/package-lock.json b/package-lock.json similarity index 100% rename from moving/package-lock.json rename to package-lock.json diff --git a/moving/package.json b/package.json similarity index 100% rename from moving/package.json rename to package.json diff --git a/moving/postcss.config.mjs b/postcss.config.mjs similarity index 100% rename from moving/postcss.config.mjs rename to postcss.config.mjs diff --git a/moving/public/icons/LogoGray.svg b/public/icons/LogoGray.svg similarity index 100% rename from moving/public/icons/LogoGray.svg rename to public/icons/LogoGray.svg diff --git a/moving/public/icons/dropdownIcon.svg b/public/icons/dropdownIcon.svg similarity index 100% rename from moving/public/icons/dropdownIcon.svg rename to public/icons/dropdownIcon.svg diff --git a/moving/public/icons/eyesIcon.svg b/public/icons/eyesIcon.svg similarity index 100% rename from moving/public/icons/eyesIcon.svg rename to public/icons/eyesIcon.svg diff --git a/moving/public/icons/favicon.ico b/public/icons/favicon.ico similarity index 100% rename from moving/public/icons/favicon.ico rename to public/icons/favicon.ico diff --git a/moving/public/icons/favoriteIcon.svg b/public/icons/favoriteIcon.svg similarity index 100% rename from moving/public/icons/favoriteIcon.svg rename to public/icons/favoriteIcon.svg diff --git a/moving/public/icons/instagramIcon.svg b/public/icons/instagramIcon.svg similarity index 100% rename from moving/public/icons/instagramIcon.svg rename to public/icons/instagramIcon.svg diff --git a/moving/public/icons/left-arrow-Icon.svg b/public/icons/left-arrow-Icon.svg similarity index 100% rename from moving/public/icons/left-arrow-Icon.svg rename to public/icons/left-arrow-Icon.svg diff --git a/moving/public/icons/left-arrow-white.svg b/public/icons/left-arrow-white.svg similarity index 100% rename from moving/public/icons/left-arrow-white.svg rename to public/icons/left-arrow-white.svg diff --git a/moving/public/icons/likeIcon.svg b/public/icons/likeIcon.svg similarity index 100% rename from moving/public/icons/likeIcon.svg rename to public/icons/likeIcon.svg diff --git a/moving/public/icons/right-arrow-Icon.svg b/public/icons/right-arrow-Icon.svg similarity index 100% rename from moving/public/icons/right-arrow-Icon.svg rename to public/icons/right-arrow-Icon.svg diff --git a/moving/public/icons/right-arrow-white.svg b/public/icons/right-arrow-white.svg similarity index 100% rename from moving/public/icons/right-arrow-white.svg rename to public/icons/right-arrow-white.svg diff --git a/moving/public/icons/searchIcon.svg b/public/icons/searchIcon.svg similarity index 100% rename from moving/public/icons/searchIcon.svg rename to public/icons/searchIcon.svg diff --git a/moving/public/icons/sortIcon.svg b/public/icons/sortIcon.svg similarity index 100% rename from moving/public/icons/sortIcon.svg rename to public/icons/sortIcon.svg diff --git a/moving/public/icons/starIcon.svg b/public/icons/starIcon.svg similarity index 100% rename from moving/public/icons/starIcon.svg rename to public/icons/starIcon.svg diff --git a/moving/public/icons/starOnIcon.svg b/public/icons/starOnIcon.svg similarity index 100% rename from moving/public/icons/starOnIcon.svg rename to public/icons/starOnIcon.svg diff --git a/moving/public/icons/starOutIcon.svg b/public/icons/starOutIcon.svg similarity index 100% rename from moving/public/icons/starOutIcon.svg rename to public/icons/starOutIcon.svg diff --git a/moving/public/icons/tiktokIcon.svg b/public/icons/tiktokIcon.svg similarity index 100% rename from moving/public/icons/tiktokIcon.svg rename to public/icons/tiktokIcon.svg diff --git a/moving/public/icons/x(sns)Icon.svg b/public/icons/x(sns)Icon.svg similarity index 100% rename from moving/public/icons/x(sns)Icon.svg rename to public/icons/x(sns)Icon.svg diff --git a/moving/public/icons/youtubeIcon.svg b/public/icons/youtubeIcon.svg similarity index 100% rename from moving/public/icons/youtubeIcon.svg rename to public/icons/youtubeIcon.svg diff --git a/moving/public/images/Logo.svg b/public/images/Logo.svg similarity index 100% rename from moving/public/images/Logo.svg rename to public/images/Logo.svg diff --git a/moving/public/images/LogoGray.svg b/public/images/LogoGray.svg similarity index 100% rename from moving/public/images/LogoGray.svg rename to public/images/LogoGray.svg diff --git a/moving/public/images/check.png b/public/images/check.png similarity index 100% rename from moving/public/images/check.png rename to public/images/check.png diff --git a/moving/public/images/defaultBackPoster.png b/public/images/defaultBackPoster.png similarity index 100% rename from moving/public/images/defaultBackPoster.png rename to public/images/defaultBackPoster.png diff --git a/moving/public/images/defaultImage.png b/public/images/defaultImage.png similarity index 100% rename from moving/public/images/defaultImage.png rename to public/images/defaultImage.png diff --git a/moving/public/images/defaultPoster.png b/public/images/defaultPoster.png similarity index 100% rename from moving/public/images/defaultPoster.png rename to public/images/defaultPoster.png diff --git a/public/images/defaultRowPoster.png b/public/images/defaultRowPoster.png new file mode 100644 index 0000000..27a7f86 Binary files /dev/null and b/public/images/defaultRowPoster.png differ diff --git a/moving/public/images/landerBanner.png b/public/images/landerBanner.png similarity index 100% rename from moving/public/images/landerBanner.png rename to public/images/landerBanner.png diff --git a/moving/public/images/mainBanner.png b/public/images/mainBanner.png similarity index 100% rename from moving/public/images/mainBanner.png rename to public/images/mainBanner.png diff --git a/moving/public/images/mainpage-length-image.png b/public/images/mainpage-length-image.png similarity index 100% rename from moving/public/images/mainpage-length-image.png rename to public/images/mainpage-length-image.png diff --git a/moving/public/images/mainpage-width-image.png b/public/images/mainpage-width-image.png similarity index 100% rename from moving/public/images/mainpage-width-image.png rename to public/images/mainpage-width-image.png diff --git a/moving/public/images/membership-mobile.png b/public/images/membership-mobile.png similarity index 100% rename from moving/public/images/membership-mobile.png rename to public/images/membership-mobile.png diff --git a/moving/public/images/membership-pc.png b/public/images/membership-pc.png similarity index 100% rename from moving/public/images/membership-pc.png rename to public/images/membership-pc.png diff --git a/moving/public/images/membershipBackgroundImage.png b/public/images/membershipBackgroundImage.png similarity index 100% rename from moving/public/images/membershipBackgroundImage.png rename to public/images/membershipBackgroundImage.png diff --git a/moving/public/images/modalTestImage.png b/public/images/modalTestImage.png similarity index 100% rename from moving/public/images/modalTestImage.png rename to public/images/modalTestImage.png diff --git a/moving/public/images/movie1.png b/public/images/movie1.png similarity index 100% rename from moving/public/images/movie1.png rename to public/images/movie1.png diff --git a/moving/public/images/movie2.png b/public/images/movie2.png similarity index 100% rename from moving/public/images/movie2.png rename to public/images/movie2.png diff --git a/moving/public/images/movie3.png b/public/images/movie3.png similarity index 100% rename from moving/public/images/movie3.png rename to public/images/movie3.png diff --git a/moving/public/images/moving-large.png b/public/images/moving-large.png similarity index 100% rename from moving/public/images/moving-large.png rename to public/images/moving-large.png diff --git a/moving/public/images/reviewBgLeft.png b/public/images/reviewBgLeft.png similarity index 100% rename from moving/public/images/reviewBgLeft.png rename to public/images/reviewBgLeft.png diff --git a/moving/public/images/reviewBgRight.png b/public/images/reviewBgRight.png similarity index 100% rename from moving/public/images/reviewBgRight.png rename to public/images/reviewBgRight.png diff --git a/moving/public/images/seriesTestImage.png b/public/images/seriesTestImage.png similarity index 100% rename from moving/public/images/seriesTestImage.png rename to public/images/seriesTestImage.png diff --git a/moving/public/images/testImage.png b/public/images/testImage.png similarity index 100% rename from moving/public/images/testImage.png rename to public/images/testImage.png diff --git a/moving/public/images/thumbnail.png b/public/images/thumbnail.png similarity index 100% rename from moving/public/images/thumbnail.png rename to public/images/thumbnail.png diff --git a/moving/src/api/genreAPI.tsx b/src/api/genreAPI.tsx similarity index 100% rename from moving/src/api/genreAPI.tsx rename to src/api/genreAPI.tsx diff --git a/moving/src/api/mainpageAPI.tsx b/src/api/mainpageAPI.tsx similarity index 100% rename from moving/src/api/mainpageAPI.tsx rename to src/api/mainpageAPI.tsx diff --git a/moving/src/api/mainpageBanner.tsx b/src/api/mainpageBanner.tsx similarity index 100% rename from moving/src/api/mainpageBanner.tsx rename to src/api/mainpageBanner.tsx diff --git a/moving/src/api/searchAPI.tsx b/src/api/searchAPI.tsx similarity index 100% rename from moving/src/api/searchAPI.tsx rename to src/api/searchAPI.tsx diff --git a/moving/src/auth/shuffleArray.ts b/src/auth/shuffleArray.ts similarity index 100% rename from moving/src/auth/shuffleArray.ts rename to src/auth/shuffleArray.ts diff --git a/moving/src/components/detail/DetailModal.tsx b/src/components/detail/DetailModal.tsx similarity index 100% rename from moving/src/components/detail/DetailModal.tsx rename to src/components/detail/DetailModal.tsx diff --git a/moving/src/components/detail/components/Slider.tsx b/src/components/detail/components/Slider.tsx similarity index 100% rename from moving/src/components/detail/components/Slider.tsx rename to src/components/detail/components/Slider.tsx diff --git a/moving/src/components/detail/components/tab/DetailsTab.tsx b/src/components/detail/components/tab/DetailsTab.tsx similarity index 100% rename from moving/src/components/detail/components/tab/DetailsTab.tsx rename to src/components/detail/components/tab/DetailsTab.tsx diff --git a/moving/src/components/detail/components/tab/RelatedWorksTab.tsx b/src/components/detail/components/tab/RelatedWorksTab.tsx similarity index 100% rename from moving/src/components/detail/components/tab/RelatedWorksTab.tsx rename to src/components/detail/components/tab/RelatedWorksTab.tsx diff --git a/moving/src/components/detail/components/tab/ReviewDropDown.tsx b/src/components/detail/components/tab/ReviewDropDown.tsx similarity index 100% rename from moving/src/components/detail/components/tab/ReviewDropDown.tsx rename to src/components/detail/components/tab/ReviewDropDown.tsx diff --git a/moving/src/components/detail/components/tab/SeriesTab.tsx b/src/components/detail/components/tab/SeriesTab.tsx similarity index 100% rename from moving/src/components/detail/components/tab/SeriesTab.tsx rename to src/components/detail/components/tab/SeriesTab.tsx diff --git a/moving/src/components/detail/components/tab/TrailerTab.tsx b/src/components/detail/components/tab/TrailerTab.tsx similarity index 100% rename from moving/src/components/detail/components/tab/TrailerTab.tsx rename to src/components/detail/components/tab/TrailerTab.tsx diff --git a/moving/src/components/detail/components/tab/UserReviewsTab.tsx b/src/components/detail/components/tab/UserReviewsTab.tsx similarity index 100% rename from moving/src/components/detail/components/tab/UserReviewsTab.tsx rename to src/components/detail/components/tab/UserReviewsTab.tsx diff --git a/moving/src/components/mainPage/ComingSoonMovies.tsx b/src/components/mainPage/ComingSoonMovies.tsx similarity index 100% rename from moving/src/components/mainPage/ComingSoonMovies.tsx rename to src/components/mainPage/ComingSoonMovies.tsx diff --git a/moving/src/components/mainPage/MainBanner.tsx b/src/components/mainPage/MainBanner.tsx similarity index 97% rename from moving/src/components/mainPage/MainBanner.tsx rename to src/components/mainPage/MainBanner.tsx index 1dd3daa..8a1ae67 100644 --- a/moving/src/components/mainPage/MainBanner.tsx +++ b/src/components/mainPage/MainBanner.tsx @@ -57,7 +57,9 @@ export default function MainBanner({ handleModalOpen }: MainBannerProps) { ); if (isLoading) { - return; + return ( +
+ ); } if (isError) { @@ -97,10 +99,9 @@ export default function MainBanner({ handleModalOpen }: MainBannerProps) {