Feat: #123 실시간 알림 api 연동

.eslintrc.json

@@ -4,7 +4,7 @@
     "es2021": true,
     "jest": true
   },
-  "extends": ["next/core-web-vitals", "airbnb", "airbnb-typescript"],
+  "extends": ["next/core-web-vitals"],
   "parser": "@typescript-eslint/parser",
   "parserOptions": {
     "ecmaFeatures": {
@@ -17,36 +17,8 @@
   "plugins": ["react", "@typescript-eslint"],
   "rules": {
     "react-hooks/exhaustive-deps": "off",
-    "react/jsx-props-no-spreading": "off",
-    "linebreak-style": 0,
-    "import/no-extraneous-dependencies": "off",
     "import/prefer-default-export": ["off", { "target": "single" }],
-    "object-curly-newline": "off",
-    "arrow-parens": "off",
-    "arrow-body-style": "off",
-    "@typescript-eslint/no-shadow": "off",
-    "operator-linebreak": "off",
-    "react/require-default-props": "off",
-    "implicit-arrow-linebreak": "off",
-    "@typescript-eslint/naming-convention": "off",
-    "consistent-return": "off",
-    "@typescript-eslint/indent": "off",
-    "jsx-a11y/control-has-associated-label": "off",
-    "react/jsx-wrap-multilines": "off",
-    "react/jsx-indent": "off",
-    "react/no-invalid-html-attribute": "off",
-    "eslint-plugin-import/no-cycle": "off",
-    "import/no-cycle":"off",
-    "no-param-reassign":"off",
-    "@typescript-eslint/no-unused-vars": "warn", //사용안한 변수는 경고처리
-    "react/jsx-curly-newline": "off", // jsx안에 }를 새로운 라인에 사용할 수 있다.
-    "@typescript-eslint/no-use-before-define": ["warn"], // 선언하기 전에 사용 한다면 경고
-    "jsx-a11y/label-has-associated-control": [
-      2,
-      {
-        "labelAttributes": ["htmlFor"]
-      }
-    ]
+    "react/display-name": "off"
   },
   "globals": {
     "React": "writable"

init-https.sh

@@ -0,0 +1,10 @@
+#!/bin/bash
+
+MKCERT_INSTALLED=$(which mkcert)
+
+if [ -z $MKCERT_INSTALLED ];then 
+    brew install mkcert
+fi
+
+mkcert -install
+mkcert localhost

package.json

@@ -3,6 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
+    "init-https": "sh init-https.sh",
     "dev": "next dev",
     "build": "next build",
     "build:dev": "env-cmd -f .env.development next build",

server.js

@@ -0,0 +1,40 @@
+const http = require('http');
+const { parse } = require('url');
+const next = require('next');
+
+const https = require('https');
+const fs = require('fs');
+
+const dev = process.env.NODE_ENV !== 'production';
+const app = next({ dev });
+const handle = app.getRequestHandler();
+
+const PORT = 3000;
+
+const httpsOptions = {
+  key: fs.readFileSync('./key.pem'),
+  cert: fs.readFileSync('./cert.pem'),
+};
+
+app.prepare().then(() => {
+  http
+    .createServer((req, res) => {
+      const parsedUrl = parse(req.url, true);
+      handle(req, res, parsedUrl);
+    })
+    .listen(PORT, err => {
+      if (err) throw err;
+      console.log(`> Ready on http://localhost:${PORT}`);
+    });
+
+  // https 서버 추가
+  https
+    .createServer(httpsOptions, (req, res) => {
+      const parsedUrl = parse(req.url, true);
+      handle(req, res, parsedUrl);
+    })
+    .listen(PORT + 1, err => {
+      if (err) throw err;
+      console.log(`> HTTPS: Ready on https://localhost:${PORT + 1}`);
+    });
+});

src/app/notification/api/getSubscribe.ts

@@ -0,0 +1,22 @@
+import { END_POINT } from '@/constants/api/end-point';
+import CustomError from '@/error/CustomError';
+import { axiosInstance } from '@/lib/axios/axios-instance';
+import { TResponse } from '@/types/common/response';
+import { SubscribeResponse } from '@/types/notification';
+
+export const getSubscribe = async () => {
+  const { main, getSubscribe } = END_POINT.notificationController;
+
+  try {
+    const response = await axiosInstance<TResponse<SubscribeResponse>>(
+      main + getSubscribe,
+    );
+
+    return response;
+  } catch (error: unknown) {
+    if (error instanceof CustomError) {
+      throw new Error(error.message);
+    }
+    throw new Error(String(error));
+  }
+};

src/app/sign-in/kakao/page.tsx

@@ -12,9 +12,10 @@ import { encrypt } from '@/utils/crypto';
 import { useRouter } from 'next/navigation';
 import { getEmail } from '@/utils/getEmail';
 import { useToast } from '@/app/_components/ui/use-toast';
+import { SIGN_UP_ERROR_MESSAGES } from '@/constants/sign-in';
 import { setTokensInCookies } from '@/utils/setTokensInCookies';
+import { getSubscribe } from '@/app/notification/api/getSubscribe';
 import { ERROR_CODE, STATUS_CODE } from '@/constants/api/statusCode';
-import { SIGN_UP_ERROR_MESSAGES } from '@/constants/sign-in';
 
 // 카카오 소셜 로그인 REDIRECT URI PAGE
 function Page() {
@@ -43,6 +44,7 @@ function Page() {
         case STATUS_CODE.ok:
           router.push(service);
           setId(response.data.id);
+          await getSubscribe();
           break;
 
         case invalidEmail:

src/constants/api/end-point.ts

@@ -161,14 +161,16 @@ export const END_POINT = {
 
   notificationController: {
     // DEFAULT
-    default: '/notification',
+    main: '/notification',
 
     getNotification: (page: number) => {
       const url = new URLSearchParams();
 
       url.append('page', String(page));
 
-      return `${END_POINT.notificationController.default}?${url.toString()}`;
+      return `${END_POINT.notificationController.main}?${url.toString()}`;
     },
+
+    getSubscribe: '/subscribe',
   },
 };

src/types/notification/index.ts

@@ -15,3 +15,9 @@ export interface NotificationProps {
 export interface NotificationData extends Pagination {
   content: NotificationProps[];
 }
+
+export interface SubscribeResponse {
+  id: string;
+  event: string;
+  data: string;
+}