2조 과제 제출 (조은상, 주하림, 안태욱, 이용수)

.eslintrc.js

@@ -0,0 +1,13 @@
+module.exports = {
+  env: {
+    browser: true,
+    es2021: true,
+    node: true,
+  },
+  parserOptions: {
+    ecmaVersion: 2021,
+    sourceType: 'module',
+  },
+  plugins: ['react'],
+  rules: {},
+};

.gitignore

@@ -0,0 +1,23 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

.prettierrc

@@ -0,0 +1,5 @@
+{
+  "singleQuote": true,
+  "semi": true,
+  "tabWidth": 2
+}

README.md

@@ -1,230 +1,62 @@
-# KDT5-M6
-🤝 검색어 자동완성 사이트 및 소비패턴 기록 서비스 구현, 팀 프로젝트
+## Don-Dok (돈독)
 
-Calendar & List 등 내가 소비한 금액 및 품목들을 기입하고, 월단위로 얼마를 썼는지, 어떤 항목에 비중을 두었는지 등을 기록하는
+<p>검색어 자동 완성 사이트 및 소비 패턴 기록 서비스 구현 프로젝트입니다.</p>
 
-웹 서비스를 구현합니다.
+<br />
 
+## 프로젝트 소개
 
+> **패스트캠퍼스 프론트엔드 개발 부트캠프 5기**<br /> **개발 기간** : 2023. 07. 05 (수) ~ 2023. 07. 23 (일)<br /> **배포 주소** : ['Don-Dok' 소비 기록 앱](https://spiffy-eclair-5da7a8.netlify.app/)
 
-웹/모바일웹 구현 모두 무방하며, 다양한 차트를 활용할 수 있습니다.
+<br />
 
+## 개발자 소개
 
-react를 필수로 사용해야 합니다.
-과제 수행 및 리뷰 기간은 별도 공지를 참고하세요!
+|                                             **[조은상](https://github.com/ChoEun-Sang)**                                              |                                             **[주하림](https://github.com/wngkfla01)**                                             |                                             **[안태욱](https://github.com/dotory0829)**                                              |                                             **[이용수](https://github.com/dragon-it)**                                              |
+| :-----------------------------------------------------------------------------------------------------------------------------------: | :--------------------------------------------------------------------------------------------------------------------------------: | :----------------------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------------------------------------------------: |
+| <a href="https://github.com/ChoEun-Sang"><img src="https://avatars.githubusercontent.com/u/128155681?v=4" width=150px alt="조은상" /> | <a href="https://github.com/wngkfla01"><img src="https://avatars.githubusercontent.com/u/64509945?v=4" width=150px alt="주하림" /> | <a href="https://github.com/dotory0829"><img src="https://avatars.githubusercontent.com/u/118456013?v=4" width=150px alt="안태욱" /> | <a href="https://github.com/dragon-it"><img src="https://avatars.githubusercontent.com/u/118169266?v=4" width=150px alt="이용수" /> |
+|                                                        달력 - 캘린더<br>리스트                                                        |                                                     달력 - 소비 기록<br>검색창                                                     |                                                                 통계                                                                 |                                                    통계<br>검색창<br>디자인 구현                                                    |
 
+<br />
 
+## 기술 스택
 
-과제 수행 및 제출 방법
+### Development
 
-KDT기수번호_이름
+<p>
+<img src="https://img.shields.io/badge/HTML5-E34F26?style=flat&logo=html5&logoColor=white" />
+<img src="https://img.shields.io/badge/CSS-1572B6?style=flat&logo=css3&logoColor=white" />
+<img src="https://img.shields.io/badge/React-61DAFB?style=flat&logo=React&logoColor=white" />
+<img src="https://img.shields.io/badge/Styled Components-DB7093?style=flat&logo=styled components&logoColor=white" />
+<img src="https://img.shields.io/badge/Ant Design-0170FE?style=flat&logo=ant design&logoColor=white" />
+</p>
 
+### Config
 
+<p>
+<img src="https://img.shields.io/badge/npm-CB3837?style=flat&logo=npm&logoColor=white"/></a>
+</p>
 
-E.g, KDT0_BaeJinHo
+### Deployment
 
-현재 저장소를 로컬에 클론(Clone)합니다.
-자신의 본명으로 브랜치를 생성합니다.(구분 가능하도록 본명을 꼭 파스칼케이스로 표시하세요, git branch KDTX_BaeJinHo)
-자신의 본명 브랜치에서 과제를 수행합니다.
-과제 수행이 완료되면, 자신의 본명 브랜치를 원격 저장소에 푸시(Push)합니다.(main 브랜치에 푸시하지 않도록 꼭 주의하세요, git push origin KDTX_BaeJinHo)
-저장소에서 main 브랜치를 대상으로 Pull Request 생성하면, 과제 제출이 완료됩니다!(E.g, main <== KDTX_BaeJinHo)
-main 혹은 다른 사람의 브랜치로 절대 병합하지 않도록 주의하세요!
-Pull Request에서 보이는 설명을 다른 사람들이 이해하기 쉽도록 꼼꼼하게 작성하세요!
-Pull Request에서 과제 제출 후 절대 병합(Merge)하지 않도록 주의하세요!
-과제 수행 및 제출 과정에서 문제가 발생한 경우, 바로 담당 멘토나 강사에서 얘기하세요!
-
-
-[필수 구현] 
-지출 내역 입력 폼 (지출 금액, 지출항목, 지출 날짜)
-지출 내역 목록(일반 리스트형, 칼렌더 형 표기 가능) 
-지출 내역 수정 및 삭제 
-
-[선택 구현]
-지출 내역 칼렌더로 표기
-지출 내역 월별 내역, 주별 내역, 일별 내역 표기 
-차트를 이용해서 소비 내역 표기 하기
-모바일 형태로 구현할지, 웹 형태로 구현할지는 자유
-
-URL 예제 : http://52.78.195.183:3003/api/expenses
-API
-1. 소비 기록 작성 API
-
-description 추가 (선택)
-
-Request:
-```javascript
-POST /expenses
-Content-Type: application/json
-
-{
-  "amount": 100,
-  "userId": "user123",
-  "category": "food",
-  "description": "설명",
-  "date": "2023-07-04T10:30:00.000Z"
-}
-```
-Response:
-
-```javascript
-Status: 201 Created
-{
-  "message": "Expense created successfully"
-}
-```
-
-
-2. 소비 품목 목록 API
-Request:
-```javascript
-GET /categories?userId={userId}
-```
-Response: 
-
-Status: 200 OK
-```javascript
-["food", "clothing", "electronics"]
-```
-
-3. 검색어에 해당하는 소비 항목 및 금액 조회 API
-
-Request:
-```javascript
-GET /expenses/search?q={keyword}&userId={userId}
-```
-
-Response:
-```javascript
-Status: 200 OK
-[
-  {
-    "amount": 100,
-    "userId": "user123",
-    "category": "food",
-    "date": "2023-07-04T10:30:00.000Z"
-  },
-  {
-    "amount": 80,
-    "userId": "user456",
-    "category": "food",
-    "date": "2023-07-03T14:20:00.000Z"
-  }
-]
-```
-
-4. 일별, 주별, 월별 소비 조회 API
-Request:
-```javascript
-
-(category는 선택)
-GET /expenses/summary?period={period}&userId={userId}&category={category}
-period : daily, weekly, monthly
-```
-Response:
-
-```javascript
-Status: 200 OK
-[
-  {
-    "_id": "2023-07-04",
-    "totalAmount": 180
-  },
-  {
-    "_id": "2023-07-03",
-    "totalAmount": 80
-  }
-]
-```
-5. 소비 기록 수정 API
-Request:
-```javascript
-PUT /expenses/123
-
-Content-Type: application/json
-
-{
-  "amount": 150,
-  "userId": "user123",
-  "category": "food",
-  "date": "2023-07-04T10:30:00.000Z"
-}
-```
-Response:
-```javascript
-Status: 200 OK
-{
-  "message": "Expense updated successfully"
-}
-```
-
-6. 소비 기록 삭제 API
-Request:
-```javascript
-DELETE /expenses/123
-```
-Response:
-```javascript
-Status: 200 OK
-{
-  "message": "Expense deleted successfully"
-}
-```
-
-7. 소비 기록 달력 호출 API
-Request:
-```javascript
-(category는 선택)
-GET /expenses/calendar?year=2023&month=7&userId={userId}&category={category}
-```
-Response:
-```javascript
-Status: 200 OK
-{
-  "1": [
-    {
-      "amount": 100,
-      "userId": "user123",
-      "category": "food",
-      "date": "2023-07-01T10:30:00.000Z"
-    }
-  ],
-  "4": [
-    {
-      "amount": 80,
-      "userId": "user456",
-      "category": "food",
-      "date": "2023-07-04T14:20:00.000Z"
-    }
-  ]
-}
-
-```
-
-
-
-8. 카데고리에 해당하는 소비 항목 및 금액 조회 API(정확한 카데고리)
-
-Request:
-```javascript
-GET /expenses/category?q={keyword}&userId={userId}
-```
-
-Response:
-```javascript
-Status: 200 OK
-[
-  {
-    "amount": 100,
-    "userId": "user123",
-    "category": "food",
-    "date": "2023-07-04T10:30:00.000Z"
-  },
-  {
-    "amount": 80,
-    "userId": "user456",
-    "category": "food",
-    "date": "2023-07-03T14:20:00.000Z"
-  }
-]
-```
+<img src="https://img.shields.io/badge/Netlify-00C7B7?style=flat&logo=NETLIFY&logoColor=white"/></a>
 
+### Environment
+
+<p>
+<img src="https://img.shields.io/badge/Visual Studio Code-007ACC?style=flat&logo=Visual Studio Code&logoColor=white"/></a>
+<img src="https://img.shields.io/badge/Git-F05032?style=flat&logo=Git&logoColor=white"/></a>
+<img src="https://img.shields.io/badge/GitHub-181717?style=flat&logo=GitHub&logoColor=white"/></a>
+</p>
+
+### Cowork Tools
+
+<p>
+<img src="https://img.shields.io/badge/Slack-4A154B?style=flat&logo=Slack&logoColor=white" />
+<img src="https://img.shields.io/badge/Notion-000000?style=flat&logo=Notion&logoColor=white" />
+<img src="https://img.shields.io/badge/Zoom-2D8CFF?style=flat&logo=Zoom&logoColor=white" />
+</p>
+
+<br />
+
+## 주요 기능 및 시연

functions/proxy.js

@@ -0,0 +1,36 @@
+// functions/proxy.js
+const axios = require('axios');
+
+exports.handler = async function (event, context) {
+  try {
+    const apiURL = 'https://chickenlecture.xyz/api'; // 주어진 API 서버의 기본 URL
+    const path = event.path.replace('/.netlify/functions/proxy/', ''); // 요청 경로
+
+    // API 서버로 요청 보내기
+    const response = await axios({
+      method: event.httpMethod,
+      url: `${apiURL}/${path}`,
+      data: event.body,
+      headers: event.headers,
+    });
+
+    // API 서버의 응답 반환
+    return {
+      statusCode: response.status,
+      body: JSON.stringify(response.data),
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    };
+  } catch (error) {
+    return {
+      statusCode: error.response?.status || 500,
+      body: JSON.stringify(
+        error.response?.data || { message: 'Internal Server Error' },
+      ),
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    };
+  }
+};

netlify.toml

@@ -0,0 +1,4 @@
+[[headers]]
+  for = "/api/*"
+    [headers.values]
+    Access-Control-Allow-Origin = "https://lustrous-douhua-5caa11.netlify.app"