[feat/#35] 장바구니 cart_section1 구현

.eslintrc.cjs

@@ -2,57 +2,60 @@ module.exports = {
   root: true,
   env: { browser: true, es2020: true },
   extends: [
-    "eslint:recommended",
+    'eslint:recommended',
     //"plugin:@typescript-eslint/recommended",
-    "plugin:react-hooks/recommended",
-    "plugin:prettier/recommended",
+    'plugin:react-hooks/recommended',
+    'plugin:prettier/recommended',
   ],
-  ignorePatterns: ["dist", ".eslintrc.cjs"],
-  parser: "@typescript-eslint/parser",
-  plugins: ["react-refresh"],
+  ignorePatterns: ['dist', '.eslintrc.cjs'],
+  parser: '@typescript-eslint/parser',
+  plugins: ['react-refresh'],
   rules: {
-    "react-refresh/only-export-components": ["warn", { allowConstantExport: true }],
-    "prettier/prettier": [
-      "warn",
+    'react-refresh/only-export-components': [
+      'warn',
+      { allowConstantExport: true },
+    ],
+    'prettier/prettier': [
+      'warn',
       {
-        endOfLine: "auto",
+        endOfLine: 'auto',
       },
     ],
-    eqeqeq: "error", // 항상 일치 연산자(=== 및 !==) 사용을 강제
-    curly: "error", // 제어문에서 항상 중괄호 사용을 강제
-    quotes: ["error", "single"], // 문자열은 항상 홀 따옴표로 설정
-    "comma-style": ["error", "last"], // 쉼표 스타일을 (객체에서)마지막 요소 뒤에 사용하도록 설정
-    "no-unused-vars": "warn", // 사용되지 않는 변수에 대한 경고 표시
-    "no-console": "warn", // console 사용 시 경고 표시
-    "no-extra-semi": "error", // 추가적인 세미콜론 사용을 방지
-    "no-unused-expressions": "error", // 사용되지 않는 표현식에 대한 경고 표시
-    indent: ["error", 2], // 들여쓰기는 두 칸으로 설정
-    semi: ["warn", "always"], // 항상 세미콜론 사용을 적극 권장
-    "no-undef": "error", // 정의되지 않은 변수에 대한 경고 표시
-    "no-trailing-spaces": "warn", // 줄 끝에 공백 사용을 방지
-    "no-multiple-empty-lines": "warn", // 연속된 빈 줄 사용을 방지
-    "arrow-spacing": "warn", // 화살표 함수의 화살표 주변에 공백 사용을 강제
-    "no-const-assign": "error", // const 변수에 재할당을 방지
+    eqeqeq: 'error', // 항상 일치 연산자(=== 및 !==) 사용을 강제
+    curly: 'error', // 제어문에서 항상 중괄호 사용을 강제
+    quotes: ['error', 'single'], // 문자열은 항상 홀 따옴표로 설정
+    'comma-style': ['error', 'last'], // 쉼표 스타일을 (객체에서)마지막 요소 뒤에 사용하도록 설정
+    'no-unused-vars': 'warn', // 사용되지 않는 변수에 대한 경고 표시
+    'no-console': 'warn', // console 사용 시 경고 표시
+    'no-extra-semi': 'error', // 추가적인 세미콜론 사용을 방지
+    'no-unused-expressions': 'error', // 사용되지 않는 표현식에 대한 경고 표시
+    indent: ['error', 2], // 들여쓰기는 두 칸으로 설정
+    semi: ['warn', 'always'], // 항상 세미콜론 사용을 적극 권장
+    'no-undef': 'error', // 정의되지 않은 변수에 대한 경고 표시
+    'no-trailing-spaces': 'warn', // 줄 끝에 공백 사용을 방지
+    'no-multiple-empty-lines': 'warn', // 연속된 빈 줄 사용을 방지
+    'arrow-spacing': 'warn', // 화살표 함수의 화살표 주변에 공백 사용을 강제
+    'no-const-assign': 'error', // const 변수에 재할당을 방지
     //"no-extra-parens": "warn", // 불필요한 괄호 사용을 방지
-    "no-multi-spaces": "error", // 연속된 공백 사용을 방지
-    "prefer-const": "error", // 변수 재할당을 하지 않는 경우 const 사용을 권장
-    "no-else-return": "warn", // else 블록에서 return 사용을 방지
-    "no-floating-decimal": "error", // 소수점 앞에 있는 0 생략을 방지
-    "no-new-object": "error", // Object 생성자 사용을 방지
-    "no-shadow": "error", // 외부 범위에서 이미 선언된 변수와 동일한 이름의 변수를 선언하는 것을 방지
-    "no-param-reassign": "error", // 함수 매개변수의 재할당을 방지
-    "prefer-template": "warn", // 문자열 연결 대신 템플릿 리터럴 사용을 권장
-    radix: "error", // parseInt() 함수 사용 시 진수를 명시적으로 지정하도록 강제
-    "no-useless-constructor": "error", // 불필요한 생성자 사용을 방지
-    "no-alert": "warn", // alert() 함수 사용을 방지
-    "no-empty-pattern": "warn", // 빈 객체나 배열 분해 사용을 방지
-    "no-eval": "error", // eval() 함수 사용을 방지
-    "no-implicit-globals": "error", // 암묵적인 전역 변수 사용을 방지
-    "no-implied-eval": "error", // 암시적인 eval() 사용을 방지
-    "no-loop-func": "error", // 루프 내에서 함수 선언을 방지
-    "no-iterator": "error", // __iterator__ 속성 사용을 방지
-    "no-new-wrappers": "error", // 기본 객체 래퍼 클래스 사용을 방지
-    "no-restricted-globals": "error", // 특정한 전역 변수 사용을 방지
-    "no-return-assign": "warn", // 할당문을 리턴문에서 사용을 방지
+    'no-multi-spaces': 'error', // 연속된 공백 사용을 방지
+    'prefer-const': 'error', // 변수 재할당을 하지 않는 경우 const 사용을 권장
+    'no-else-return': 'warn', // else 블록에서 return 사용을 방지
+    'no-floating-decimal': 'error', // 소수점 앞에 있는 0 생략을 방지
+    'no-new-object': 'error', // Object 생성자 사용을 방지
+    'no-shadow': 'error', // 외부 범위에서 이미 선언된 변수와 동일한 이름의 변수를 선언하는 것을 방지
+    'no-param-reassign': 'error', // 함수 매개변수의 재할당을 방지
+    'prefer-template': 'warn', // 문자열 연결 대신 템플릿 리터럴 사용을 권장
+    radix: 'error', // parseInt() 함수 사용 시 진수를 명시적으로 지정하도록 강제
+    'no-useless-constructor': 'error', // 불필요한 생성자 사용을 방지
+    'no-alert': 'warn', // alert() 함수 사용을 방지
+    'no-empty-pattern': 'warn', // 빈 객체나 배열 분해 사용을 방지
+    'no-eval': 'error', // eval() 함수 사용을 방지
+    'no-implicit-globals': 'error', // 암묵적인 전역 변수 사용을 방지
+    'no-implied-eval': 'error', // 암시적인 eval() 사용을 방지
+    'no-loop-func': 'error', // 루프 내에서 함수 선언을 방지
+    'no-iterator': 'error', // __iterator__ 속성 사용을 방지
+    'no-new-wrappers': 'error', // 기본 객체 래퍼 클래스 사용을 방지
+    'no-restricted-globals': 'error', // 특정한 전역 변수 사용을 방지
+    'no-return-assign': 'warn', // 할당문을 리턴문에서 사용을 방지
   },
 };

.github/ISSUE_TEMPLATE/Issue-bug-template.yml

@@ -1,6 +1,6 @@
 name: 🐛 버그 수정
 description: 버그 수정사항 작성시 해당 이슈 템플릿을 사용하여 이슈를 생성해주세요.
-title: "[fix] "
+title: '[fix] '
 
 body:
   - type: markdown
@@ -18,7 +18,7 @@ body:
   - type: textarea
     attributes:
       label: 👍 정상 동작
-      description: 정상적인 동작에 대해 설명해주세요. 
+      description: 정상적인 동작에 대해 설명해주세요.
       placeholder: 설명을 작성해주세요.
     validations:
-      required: true
+      required: true

.github/ISSUE_TEMPLATE/Issue-feature-template.yml

@@ -1,6 +1,6 @@
 name: ✨ 기능 추가
 description: 기능 추가시 해당 이슈 템플릿을 사용하여 이슈를 생성해주세요.
-title: "[feat] "
+title: '[feat] '
 
 body:
   - type: markdown
@@ -19,12 +19,12 @@ body:
     attributes:
       label: ✅ 작업할 내용
       description: 할 일을 체크박스 형태로 작성해주세요.
-      placeholder: 최대한 세분화 하여 작성해주세요. 
+      placeholder: 최대한 세분화 하여 작성해주세요.
     validations:
       required: true
   - type: textarea
     id: view-preview
     attributes:
       label: 🎨 뷰 미리보기
       description: 작업하고자 하는 기능의 뷰를 참고할 수 있는 자료를 첨부해주세요.
-      placeholder: 참고 자료를 첨부해주세요. 
+      placeholder: 참고 자료를 첨부해주세요.

.github/labeler.yml

@@ -11,7 +11,6 @@ comments:
     라벨 지정 제대로 되었는지 체크 한 번씩 하기 🧞‍♂️ 작업도 화이팅 !!!!!!! 😍
   prs: |
     라벨 지정 제대로 되었는지, assignee 및 reviewer 지정했는지 체크 한 번씩 하기 🧞‍♂️ 고생했어요 다음 작업도 화이팅 !!!!!! 😍
-
 
 # Labels is an object where:
 # - keys are labels

.github/pull_request_template.md

@@ -1,26 +1,28 @@
 <!-- PR 제목은 '[핏,픽스등등/#이슈번호] 작업 내용' 과 같은 형태로 작성해주세요.  -->
 
 ### 📑 이슈 번호
+
 <!-- 이슈 번호를 작성해주세요 ex) #11 -->
 
 - close #
 
 <br>
 
 ### ✨️ 작업 내용
+
 <!-- 작업 내용을 간략히 설명해주세요 -->
 
 <br>
 
 ### 🌊 코멘트
+
 <!-- 리뷰어가 중점적으로 봐주었으면 하는 부분이나 궁금한 점을 자유롭게 남겨주세요! -->
 
 <br>
 
 ### 📸 구현 결과
-<!-- 구현한 기능이 모두 결과물에 포함되도록 자유롭게 첨부해주세요 (스크린샷, gif, 동영상, 배포링크 등) -->
-
 
+<!-- 구현한 기능이 모두 결과물에 포함되도록 자유롭게 첨부해주세요 (스크린샷, gif, 동영상, 배포링크 등) -->
 
 <!-- ⚠️⚠️⚠️⚠️⚠️⚠️ 잠깐 !!!! ⚠️⚠️⚠️⚠️⚠️ -->
 <!-- PR 제목 컨벤션에 맞게 잘 작성했는지, assignee 및 reviewer 지정했는지 다시 한 번 체크하기 !! -->

.github/workflows/autoLabel.yml

@@ -5,7 +5,7 @@ on:
     types: [opened]
   pull_request:
     types: [opened]
-    
+
 jobs:
   labeler:
     runs-on: ubuntu-latest

.github/workflows/buildTest.yml

@@ -30,4 +30,3 @@ jobs:
       - name: Run build
         run: |
           yarn build
-

.stylelintrc.json

@@ -1,89 +1,89 @@
-{  
-  "extends": ["stylelint-config-standard"],  
-  "plugins": ["stylelint-order"],  
-  "customSyntax": "postcss-styled-syntax",  
-  "rules": {  
-    "declaration-empty-line-before": [  
-      "always",  
-      {  
-        "ignore": [  
-          "first-nested",  
-          "after-comment",  
-          "after-declaration",  
-          "inside-single-line-block"  
-        ]  
-      }  
-    ],  
-    "order/order": ["custom-properties", "declarations"],  
-    
-    "order/properties-order": [  
-      {  
-        "groupName": "Layout",  
-        "noEmptyLineBetween": true,  
-        "properties": [  
-          "display",  
-          "visibility",  
-          "overflow",  
-          "float",  
-          "clear",  
-          "position",  
-          "top",  
-          "right",  
-          "bottom",  
-          "left",  
-          "z-index"  
-        ]  
-      },  
-      {  
-        "groupName": "Box",  
-        "emptyLineBefore": "always",  
-        "noEmptyLineBetween": true,  
-        "properties": [  
-          "width",  
-          "height",  
-          "margin",  
-          "margin-top",  
-          "margin-right",  
-          "margin-bottom",  
-          "margin-left",  
-          "padding",  
-          "padding-top",  
-          "padding-right",  
-          "padding-bottom",  
-          "padding-left",  
-          "border"  
-        ]  
-      },  
-      {  
-        "groupName": "Background",  
-        "emptyLineBefore": "always",  
-        "noEmptyLineBetween": true,  
-        "properties": ["background-color"]  
-      },  
-      {  
-        "groupName": "Font",  
-        "emptyLineBefore": "always",  
-        "noEmptyLineBetween": true,  
-        "properties": [  
-          "color",  
-          "font-style",  
-          "font-weight",  
-          "font-size",  
-          "line-height",  
-          "letter-spacing",  
-          "text-align",  
-          "text-indent",  
-          "vertical-align",  
-          "white-space"  
-        ]  
-      },  
-      {  
-        "groupName": "Animation",  
-        "emptyLineBefore": "always",  
-        "noEmptyLineBetween": true,  
-        "properties": ["animation"]  
-      }  
-    ],  
-    "no-empty-source": null  
-  }  
-}
+{
+  "extends": ["stylelint-config-standard"],
+  "plugins": ["stylelint-order"],
+  "customSyntax": "postcss-styled-syntax",
+  "rules": {
+    "declaration-empty-line-before": [
+      "always",
+      {
+        "ignore": [
+          "first-nested",
+          "after-comment",
+          "after-declaration",
+          "inside-single-line-block"
+        ]
+      }
+    ],
+    "order/order": ["custom-properties", "declarations"],
+
+    "order/properties-order": [
+      {
+        "groupName": "Layout",
+        "noEmptyLineBetween": true,
+        "properties": [
+          "display",
+          "visibility",
+          "overflow",
+          "float",
+          "clear",
+          "position",
+          "top",
+          "right",
+          "bottom",
+          "left",
+          "z-index"
+        ]
+      },
+      {
+        "groupName": "Box",
+        "emptyLineBefore": "always",
+        "noEmptyLineBetween": true,
+        "properties": [
+          "width",
+          "height",
+          "margin",
+          "margin-top",
+          "margin-right",
+          "margin-bottom",
+          "margin-left",
+          "padding",
+          "padding-top",
+          "padding-right",
+          "padding-bottom",
+          "padding-left",
+          "border"
+        ]
+      },
+      {
+        "groupName": "Background",
+        "emptyLineBefore": "always",
+        "noEmptyLineBetween": true,
+        "properties": ["background-color"]
+      },
+      {
+        "groupName": "Font",
+        "emptyLineBefore": "always",
+        "noEmptyLineBetween": true,
+        "properties": [
+          "color",
+          "font-style",
+          "font-weight",
+          "font-size",
+          "line-height",
+          "letter-spacing",
+          "text-align",
+          "text-indent",
+          "vertical-align",
+          "white-space"
+        ]
+      },
+      {
+        "groupName": "Animation",
+        "emptyLineBefore": "always",
+        "noEmptyLineBetween": true,
+        "properties": ["animation"]
+      }
+    ],
+    "no-empty-source": null
+  }
+}