[7주차] Team 포토그라운드 강다혜 & 이희원 미션 제출합니다.

.gitattributes

@@ -0,0 +1,9 @@
+text eol=lf
+*.js    eol=lf
+*.jsx   eol=lf
+*.ts    eol=lf
+*.tsx   eol=lf
+*.json  eol=lf
+*.html  eol=lf
+*.css   eol=lf
+*.scss  eol=lf

.gitignore

@@ -0,0 +1,41 @@
+# 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

README.md

@@ -7,7 +7,7 @@
 
 현대 웹 개발에서는 REST API가 데이터 통신의 핵심으로 자리 잡으면서, 프론트엔드와 백엔드 간의 협업이 더욱 중요해졌습니다. 백엔드는 API를 통해 데이터를 제공하고, 프론트엔드는 이를 기반으로 사용자 경험을 책임집니다. 따라서 API를 잘 활용하고 백엔드 개발자와 원활히 소통하는 능력은 필수적인 스킬입니다.
 
-이번 과제는 앞으로 팀 프로젝트에서 **실제로 백엔드와 협업하기 전 연습을 해보는 기회**입니다. Next.js를 활용해 **투표 기능**을 가진 애플리케이션을 제작하면서 백엔드와의 소통, 역할 분담, 데이터 흐름을 다루는 경험을 쌓아 보세요. 이 경험은 추후 팀 프로젝트에서 더욱 원활한 협력을 가능하게 할 것입니다.  
+이번 과제는 앞으로 팀 프로젝트에서 **실제로 백엔드와 협업하기 전 연습을 해보는 기회**입니다. Next.js를 활용해 **투표 기능**을 가진 애플리케이션을 제작하면서 백엔드와의 소통, 역할 분담, 데이터 흐름을 다루는 경험을 쌓아 보세요. 이 경험은 추후 팀 프로젝트에서 더욱 원활한 협력을 가능하게 할 것입니다.
 
 여러분의 멋진 결과물을 기대하며 마지막 과제를 응원합니다. 화이팅! 🔥
 
@@ -26,32 +26,37 @@
 
 ### **기한**
 
-- **2024년 1월 4일 토요일**까지 제출해주세요.(24.12.22 수정. 혼란드려서 죄송합니다) 
+- **2024년 1월 4일 토요일**까지 제출해주세요.(24.12.22 수정. 혼란드려서 죄송합니다)
 
 ---
 
 ### **필수 구현 사항**
 
 1. **로그인 기능**
+
    - 사용자는 아이디와 비밀번호를 입력하여 로그인할 수 있습니다.
    - 로그인 시 JWT를 통해 인증을 처리합니다.
    - 아이디 또는 비밀번호가 틀렸을 경우, 에러 메시지를 표시합니다.
    - 로그아웃 기능을 구현합니다.
 
 2. **투표 기능**
+
    - 로그인한 사용자는 투표에 참여할 수 있습니다.
    - 각 후보에 대한 투표 수를 실시간으로 확인할 수 있습니다.
    - 사용자는 한 번만 투표할 수 있으며, 중복 투표를 방지합니다.
 
 3. **후보 목록 조회**
+
    - 모든 사용자는 후보자의 목록과 상세 정보를 확인할 수 있습니다.
    - 후보자의 이름, 사진, 소개 등을 표시합니다.
 
 4. **투표 결과 조회**
+
    - 투표 종료 후, 모든 사용자는 최종 투표 결과를 확인할 수 있습니다.
    - 각 후보자의 득표 수와 득표율을 시각적으로 표현합니다.
 
 5. **반응형 디자인**
+
    - 다양한 디바이스에서 최적의 사용자 경험을 제공하기 위해 반응형 디자인을 적용합니다.
 
 6. **에러 처리**
@@ -63,15 +68,16 @@
 ### **디자인 참고**
 
 다음의 리소스를 참고해 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)
 
 19기 과제
+
 - [비트버디](https://github.com/CEOS-Developers/react-vote-19th/pull/4)
 - [TIG](https://github.com/CEOS-Developers/react-vote-19th/pull/6)
 - [펫플레이트](https://github.com/CEOS-Developers/react-vote-19th/pull/7)
-
 
 ### **선택 사항**
 
@@ -82,4 +88,4 @@
 
 ## **마무리**
 
-이번 과제는 단순히 기능 구현에 그치는 것이 아니라, **백엔드와의 협업 과정에 익숙해지고 실전 준비를
+이번 과제는 단순히 기능 구현에 그치는 것이 아니라, \*\*백엔드와의 협업 과정에 익숙해지고 실전 준비를

eslint.config.mjs

@@ -0,0 +1,21 @@
+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"),
+  {
+    rules: {
+      ...prettier.rules, // Prettier 규칙 추가
+    },
+  },
+];
+
+export default eslintConfig;

next.config.ts

@@ -0,0 +1,7 @@
+import type { NextConfig } from "next";
+
+const nextConfig: NextConfig = {
+  /* config options here */
+};
+
+export default nextConfig;