Update README.md

README.md

@@ -70,8 +70,11 @@
 <br><br>  
 
 ## 🚀 디자인 <a name = "design"></a>
-Write about what you could not develop during the course of the Hackathon; and about what your project can achieve 
-in the future.
+디자인은 피그마로 작업했으며, 라이트 모드와 다크 모드가 있습니다. <br>
+메인 컬러는 노란색으로 정했으며, 꿀매란 단어에서 연상된 꿀을 대표 이미지로 구성했습니다.
+<p align="center">
+<img width="1279" alt="image" src="https://github.com/prgrms-fe-devcourse/FEDC4_Price-PCC_DONGYOUNG/assets/83554018/cdf9d53d-b76f-411b-9548-aa384fe908c1">
+</p>
 
 <br><br>  
 
@@ -81,40 +84,56 @@ and testing purposes. See [deployment](#deployment) for notes on how to deploy t
 
 ### 설치
 
-A step by step series of examples that tell you how to get a development env running.
-
-Say what the step will be
+First, run the development server:
 
-```
-Give the example
+```bash
+npm run dev
+# or
+yarn dev
+# or
+pnpm dev
 ```
 
-And repeat
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
 
-```
-until finished
-```
+You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
 
-### 배포 환경
+This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
 
-What things you need to install the software and how to install them.
+#### Learn More
 
-```
-Give examples
-```
+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) - 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!
+
+<br>
+
+### 배포 환경
+
+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/deployment) for more details.
 <br><br>  
 
 ## ⛏️ 기술 스택 <a name = "tech_stack"></a>
-- [MongoDB](https://www.mongodb.com/) - Database
-- [Express](https://expressjs.com/) - Server Framework
-- [VueJs](https://vuejs.org/) - Web Framework
-- [NodeJs](https://nodejs.org/en/) - Server Environment
+<div style={display: 'flex'}>
+  <img src="https://img.shields.io/badge/next.js-000000?style=for-the-badge&logo=next.js&logoColor=white">
+  <img src="https://img.shields.io/badge/react-61DAFB?style=for-the-badge&logo=react&logoColor=white">
+  <img src="https://img.shields.io/badge/typescript-3178C6?style=for-the-badge&logo=typescript&logoColor=white">
+  <img src="https://img.shields.io/badge/axios-5A29E4?style=for-the-badge&logo=axios&logoColor=white">
+  <img src="https://img.shields.io/badge/reactquery-FF4154?style=for-the-badge&logo=reactquery&logoColor=white">
+  <img src="https://img.shields.io/badge/sass-CC6699?style=for-the-badge&logo=sass&logoColor=white">
+  <img src="https://img.shields.io/badge/storybook-FF4785?style=for-the-badge&logo=storybook&logoColor=white">
+  <img src="https://img.shields.io/badge/figma-F24E1E?style=for-the-badge&logo=figma&logoColor=white">
+</div>
 
-<br><br>  
 
-## 🎉 기타 <a name = "acknowledgments"></a>
-- Hat tip to anyone whose code was used
-- Inspiration
-- References
+<br><br>  
 
+## 🎉 기타(참고자료) <a name = "acknowledgments"></a>
+- [Next.js](https://nextjs.org/blog/next-13)
+- [React](https://ko.legacy.reactjs.org/)
+- [Tanstack Query](https://github.com/TanStack/query)