kiwee.dev

여러 IT기술 블로그의 최신 게시물을 모아볼 수 있는 웹앱입니다.

배포: https://kiwee.dev/

🌟 주요 기능 및 페이지

로그인

• Google, GitHub 계정으로 OAuth인증을 통해 로그인이 가능합니다.
• NextAuth를 이용해 OAuth 인증을 하고 JWT을 발급 받아 서버와 통신합니다.

읽은 글, 좋아요, 북마크

• 게시물 클릭 시 읽은 글로 등록 됩니다.
• 읽은 게시물은 프로필 페이지의 읽은 글 항목에서 확인할 수 있습니다.
• 좋아요 및 북마크를 할 수 있습니다.
• 좋아요 게시물은 프로필 페이지, 북마크 게시물은 북마크 페이지에서 확인할 수 있습니다.

테마(다크모드)

• 설정탭에서 다크모드를 설정할 수 있습니다.

새로운 탭 열기

• 설정탭에서 새로운 탭 열기를 설정할 수 있습니다.
• 새로운 탭 열기 설정 시 게시물이 새로운 탭으로 열립니다.

메인 페이지

• 현재 구독 중인 IT기술 블로그의 최신 게시물을 보여줍니다.
• 무한 스크롤을 사용해 페이징 처리를 했습니다.

프로필 페이지

• 방문한 게시물 목록과 좋아요한 게시물을 보여줍니다.
• 메인 페이지와 같이 무한 스크롤이 구현되어 있습니다.

북마크 페이지

• 북마크한 게시물을 보여줍니다.
• 메인 페이지와 같이 무한 스크롤이 구현되어 있습니다.

blogs 페이지

• 현재 kiwee.dev가 구독 중인 IT기술 블로그의 목록을 보여줍니다.
• 블로그 클릭 시 해당 블로그로 이동합니다.

📑 협업

Meeting	Pull Requests
매주 1~2회 화상회의 통해 비대면 프로젝트 진행	PR 템플릿과 2명 이상의 approve가 있어야 merge 가능

🛠 아키텍처

🛠 기술 스택

• Common: Typescript
• Client: React.js, Next.js, Redux, Styled-components, SWR
• Server: Node.js, Express, MongoDB Atlas
• Deployment: Google Cloud

💻 팀원

• 👨‍💻김은택
• 👨‍💻천정호
• 👨‍💻백상흔
• 👨‍💻이장민

⚙️ Dependencies

Client

"dependencies": {
  "axios": "^0.21.1",
  "dayjs": "^1.10.4",
  "next": "^10.2.2",
  "next-auth": "^3.21.1",
  "react": "^17.0.2",
  "react-content-loader": "^6.0.3",
  "react-dom": "^17.0.2",
  "styled-components": "^5.2.3",
  "styled-reset": "^4.3.4",
  "swr": "^0.5.5"
},
"devDependencies": {
  "@babel/core": "^7.13.16",
  "@types/next-auth": "^3.15.0",
  "@types/node": "^14.14.41",
  "@types/react": "^17.0.3",
  "@types/styled-components": "^5.1.9",
  "@typescript-eslint/eslint-plugin": "^4.22.0",
  "@typescript-eslint/parser": "^4.22.0",
  "babel-loader": "^8.2.2",
  "babel-plugin-inline-react-svg": "^2.0.1",
  "babel-plugin-styled-components": "^1.12.0",
  "eslint": "^7.24.0",
  "eslint-config-prettier": "^8.2.0",
  "eslint-plugin-react": "^7.23.2",
  "mongodb": "^3.6.6",
  "ts-loader": "^9.1.1",
  "ts-node": "^9.1.1",
  "typescript": "^4.2.4"
}

Server

"dependencies": {
  "@types/cors": "^2.8.10",
  "axios": "^0.21.1",
  "cors": "^2.8.5",
  "dotenv": "^8.2.0",
  "express": "^4.17.1",
  "mongoose": "^5.12.5",
  "mongoose-paginate-v2": "^1.3.17",
  "swagger-jsdoc": "6.0.0",
  "swagger-ui-express": "^4.1.6",
  "uuid": "^8.3.2"
}
"devDependencies": {
  "@types/express": "^4.17.11",
  "@types/mongoose": "^5.10.5",
  "@types/mongoose-paginate-v2": "^1.3.9",
  "@types/node": "^14.14.41",
  "@types/swagger-jsdoc": "^6.0.0",
  "@types/swagger-ui-express": "^4.1.2",
  "@types/uuid": "^8.3.0",
  "nodemon": "^2.0.7",
  "ts-node": "^9.1.1",
  "typescript": "^4.2.4"
}