[7주차] Team 이어드림 김영서 & 이주희 미션 제출합니다.

.github/ISSUE_TEMPLATE/feature.md

@@ -0,0 +1,18 @@
+---
+name: Feature
+about: new feature
+title: "Feature:"
+labels: feature
+assignees: ""
+---
+
+설명을 작성해주세요.
+
+## To Do
+
+- [ ] todo
+- [ ] todo
+
+## ETC
+
+기타사항을 작성해주세요.

.github/ISSUE_TEMPLATE/fix.md

@@ -0,0 +1,14 @@
+---
+name: Fix
+about: 트러블 슈팅
+title: 'Fix:'
+labels: ''
+assignees: ''
+
+---
+
+## Description
+설명을 작성해주세요.
+
+## ETC
+기타사항을 작성해주세요.

.github/ISSUE_TEMPLATE/hotfix.md

@@ -0,0 +1,15 @@
+---
+name: HotFix
+about: 치명적인 버그
+title: "Hotfix:"
+labels: ""
+assignees: ""
+---
+
+## Description
+
+설명을 작성해주세요!
+
+## ETC
+
+기타사항을 작성해주세요.

.github/ISSUE_TEMPLATE/refactoring.md

@@ -0,0 +1,20 @@
+---
+name: Refactoring
+about: 리팩토링
+title: 'Refactoring:'
+labels: refactor
+assignees: ''
+
+---
+
+## Description
+리팩토링 배경을 설명해주세요.
+
+## AS-IS
+기존에 구현되어있는 방식을 설명해주세요.
+
+## TO-BE
+어떻게 리팩토링 되어야하는 지 설명해주세요.
+
+## ETC
+기타사항을 작성해주세요.

.github/ISSUE_TEMPLATE/style.md

@@ -0,0 +1,20 @@
+---
+name: Style
+about: 디자인 요소 변경
+title: "Style:"
+labels: style
+assignees: ""
+---
+
+## Description
+
+설명을 작성해주세요!
+
+## To Do
+
+- [ ] todo
+- [ ] todo
+
+## ETC
+
+기타사항을 작성해주세요.

.github/pull_request_template.md

@@ -0,0 +1,21 @@
+## PR 제목
+
+### PR을 한 이유 🎯
+
+- (이곳에 PR을 작성한 이유를 간략하게 적어주세요.)
+
+### 이슈 번호 📎
+
+- (해결하고자 하는 이슈의 이름과 해시태그 번호를 적어주세요. 예: `이슈명 #123`)
+
+### 변경사항 🛠
+
+- (개발한 내용의 요약을 적어주세요. 예: "로그인 버그 수정", "새로운 기능 추가" 등)
+
+### 특이사항 📌
+
+- (이 PR에 대한 추가적인 정보나, 리뷰어가 주의깊게 봐야할 점 등을 적어주세요.)
+
+### 테스트 결과 📝
+
+- (테스트를 진행한 결과, 해당 결과에 따른 스크린샷 또는 기타 정보를 제공해주세요.)

.github/workflows/eslint.yml

@@ -0,0 +1,32 @@
+name: ESLint Check
+
+# Pull Request가 실행될 때만 실행
+on:
+  pull_request:
+    branches:
+      - main
+      - develop
+
+jobs:
+  lint:
+    name: Run ESLint
+    runs-on: ubuntu-latest
+
+    steps:
+      # 1. 코드 체크아웃 -> 코드를 가져오기 위해 필요
+      - name: Checkout code
+        uses: actions/checkout@v3
+
+      # 2. Node.js 설정 -> js파일 린트를 위해 필요
+      - name: Set up Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18
+
+      # 3. 의존성 설치 -> ESlint 실행 필요
+      - name: Install dependencies
+        run: npm install
+
+      # 4. ESLint 실행 -> 린트 실행!
+      - name: Run ESLint
+        run: npm run lint

.gitignore

@@ -0,0 +1,43 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/versions
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+
+# env files (can opt-in for committing if needed)
+.env*
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+
+.vercel

.husky/commit-msg

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npx --no-install commitlint --edit 

.husky/pre-commit

@@ -0,0 +1 @@
+npm run lint

.prettierrc

@@ -0,0 +1,3 @@
+{
+  "plugins": ["prettier-plugin-tailwindcss"]
+}

README.md

@@ -1,15 +1,20 @@
 # next-vote-21th
 
-## **서론**
-
-안녕하세요! 프론트엔드 운영진 송유선입니다. 🍀  
-벌써 마지막 과제에 도달했네요. 이번 스터디는 특별히 **백엔드 팀원들과 함께하는 협업 과제**로 준비했습니다.
-
-현대 웹 개발에서는 REST API가 데이터 통신의 핵심으로 자리 잡으면서, 프론트엔드와 백엔드 간의 협업이 더욱 중요해졌습니다. 백엔드는 API를 통해 데이터를 제공하고, 프론트엔드는 이를 기반으로 사용자 경험을 책임집니다. 따라서 API를 잘 활용하고 백엔드 개발자와 원활히 소통하는 능력은 필수적인 스킬입니다.
-
-이번 과제는 앞으로 팀 프로젝트에서 **실제로 백엔드와 협업하기 전 연습을 해보는 기회**입니다. Next.js를 활용해 **투표 기능**을 가진 애플리케이션을 제작하면서 백엔드와의 소통, 역할 분담, 데이터 흐름을 다루는 경험을 쌓아 보세요. 이 경험은 추후 팀 프로젝트에서 더욱 원활한 협력을 가능하게 할 것입니다.
-
-여러분의 멋진 결과물을 기대하며 마지막 과제를 응원합니다. 화이팅! 🔥
+## CEOS 21기 이어드림 투표 페이지 - 🗳️투표드림
+
+## 배포
+
+1. 프론트엔드
+   1. 김영서(@kkys00)
+      1. [피그마 디자인](https://www.figma.com/design/35IM3f0mGvcA6u3BGixE2O/CEOS-DreaDream-VoteDream?node-id=0-1&t=25welsMh8qPxUilY-1)
+      2. 홈, 로그인, 회원가입 페이지 퍼블리싱
+      3. 로그인, 회원가입 api 연결
+   2. 이주희(@BeanMouse)
+      1. 파트장 투표, 데모데이 투표, 투표 결과 페이지 퍼블리싱
+      2. 투표 api 연결
+2. 백엔드
+   1. 한혜수
+   2. 오지현
 
 ---
 
@@ -26,39 +31,48 @@
 
 ### **기한**
 
-- **2025년 5월 24일 토요일**까지 1차 필수 구현 사항이 적용된 중간 결과물을 제출해주세요. 
+- **2025년 5월 24일 토요일**까지 1차 필수 구현 사항이 적용된 중간 결과물을 제출해주세요.
 
 ---
 
 ### **1차 필수 구현 사항**
 
-1. **프로젝트 세팅**
+1. ✅ **프로젝트 세팅**
+
    - Next.js의 특성을 고려하여 효과적인 폴더 구조를 고민해 봅니다.
    - API 통신, 스타일링, 전역 상태 관리 및 기타 라이브러리 등을 팀원과 상의하여 세팅합니다.
 
-2. **퍼블리싱**
+2. ✅ **퍼블리싱**
+
    - 프로젝트에 필요한 모든 화면을 퍼블리싱합니다.
    - 다양한 디바이스에서 최적의 사용자 경험을 제공하기 위해 반응형 디자인을 적용합니다.
 
-3. **로그인 기능** 
-   - 사용자는 아이디와 비밀번호를 입력하여 로그인할 수 있습니다.
+3. **로그인 기능**
+   - ✅ 사용자는 아이디와 비밀번호를 입력하여 로그인할 수 있습니다.
    - 로그인 시 JWT를 통해 인증을 처리합니다.
-   - 아이디 또는 비밀번호가 틀렸을 경우, 에러 메시지를 표시합니다.
-   - 로그아웃 기능을 구현합니다.
+     - ✅ 쿠키 저장까지
+   - ✅ 아이디 또는 비밀번호가 틀렸을 경우, 에러 메시지를 표시합니다.
+   - ✅ 로그아웃 기능을 구현합니다.
    - **백에서 서버 배포가 안 되었을 경우**에는 다음 주로 넘겨도 괜찮습니다.
+     - ✅ 로그인 POST, 회원가입 POST까지 서버 배포됨.
+     - `https` 프로토콜 아직 불가능.
+     - 유저 정보에 대한 GET api 아직 없음
 
 ### **2차 필수 구현 사항**
-  
+
 1. **투표 기능**
+
    - 로그인한 사용자는 투표에 참여할 수 있습니다.
    - 각 후보에 대한 투표 수를 실시간으로 확인할 수 있습니다.
    - 사용자는 한 번만 투표할 수 있으며, 중복 투표를 방지합니다.
 
 2. **후보 목록 조회**
+
    - 모든 사용자는 후보자의 목록과 상세 정보를 확인할 수 있습니다.
    - 후보자의 이름, 사진, 소개 등을 표시합니다.
 
 3. **투표 결과 조회**
+
    - 투표 종료 후, 모든 사용자는 최종 투표 결과를 확인할 수 있습니다.
    - 각 후보자의 득표 수와 득표율을 시각적으로 표현합니다.
 
@@ -71,23 +85,23 @@
 ### **디자인 참고**
 
 다음의 리소스를 참고해 UI/UX를 개선해보세요:
+
 - [디자인 레퍼런스1](https://www.figma.com/design/7xoPYTjMHcwPk2yl92Eynx/%ED%98%91%EB%8F%99%EA%B3%BC%EC%A0%9C-%EB%A0%88%ED%8D%BC%EB%9F%B0%EC%8A%A4?node-id=0-1&node-type=canvas)
 - [디자인 레퍼런스2](https://www.figma.com/design/XpKkyWcguIFY9QzWWJHOyL/%ED%98%91%EB%8F%99%EA%B3%BC%EC%A0%9C-%EB%A0%88%ED%8D%BC%EB%9F%B0%EC%8A%A4?node-id=0-1)
 - [디자인 레퍼런스3](https://www.figma.com/design/12WK4MEhjwNmt89HkRu8Gp/%EB%B0%94%EB%A6%AC%EB%B0%94%EB%A6%AC-%ED%88%AC%ED%91%9C)
 - [디자인 레퍼런스4](https://www.figma.com/design/qsTGeBRrKWiWE04eVOTFQ9/CEOS-CupfeeDeal-Vote?node-id=38-503&p=f&t=sM5p1Gw4hA5G5H5D-0)
 
 20기 과제
+
 - [CupfeeDeal](https://github.com/CEOS-Developers/next-vote-20th/pull/6)
 - [페달지니](https://github.com/CEOS-Developers/next-vote-20th/pull/2)
 - [케이크WAY](https://github.com/CEOS-Developers/next-vote-20th/pull/5)
-
 
 ### **선택 사항**
 
 - API 요청 방식은 자유롭게 선택 가능 (예: Fetch API, axios 등).
 - 최신 자바스크립트 스타일에 익숙해지기 위해 `Promise.then()` 대신 `async/await`를 사용해 보세요.
 
-
 ## **Key Question**
 
 - Zod 스키마가 무엇인지, 어떻게 활용할 수 있는지 알아봅시다.

commitlint.config.cjs

@@ -0,0 +1 @@
+module.exports = { extends: ["@commitlint/config-conventional"] };

eslint.config.mjs

@@ -0,0 +1,16 @@
+import { dirname } from "path";
+import { fileURLToPath } from "url";
+import { FlatCompat } from "@eslint/eslintrc";
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = dirname(__filename);
+
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+});
+
+const eslintConfig = [
+  ...compat.extends("next/core-web-vitals", "next/typescript"),
+];
+
+export default eslintConfig;

next.config.ts

@@ -0,0 +1,15 @@
+import type { NextConfig } from "next";
+import type { Configuration } from "webpack";
+
+const nextConfig: NextConfig = {
+  webpack(config: Configuration) {
+    config.module?.rules?.push({
+      test: /\.svg$/,
+      use: ["@svgr/webpack"],
+    });
+
+    return config;
+  },
+};
+
+export default nextConfig;