fix: tag로 글 불러오는 api를 v3로 변경 (#35)

* fix: tag로 글 불러오는 api를 v3로 변경

* refactor: 안쓰는 코드 삭제

Author: syi0808

.vscode/settings.json

@@ -2,6 +2,6 @@
   "editor.tabSize": 2,
   "editor.formatOnSave": true,
   "editor.codeActionsOnSave": {
-    "source.fixAll.eslint": true
+    "source.fixAll.eslint": "explicit"
   }
 }

api/index.js

@@ -1,16 +1,14 @@
-import createCard from "../src/cards/new-log.js";
-import createCardDark from "../src/cards/new-log-black.js";
-import fetchPost from "../src/fetchers/post-fetcher.js";
-import fetchReadPost from "../src/fetchers/readpost-fetcher.js";
+import createCard from '../src/cards/new-log.js';
+import createCardDark from '../src/cards/new-log-black.js';
+import fetchPost from '../src/fetchers/post-fetcher.js';
+import fetchReadPost from '../src/fetchers/readpost-fetcher.js';
 
 export default async (req, res) => {
   const { name, tag, color, slug } = req.query;
-  res.setHeader("Content-Type", "image/svg+xml");
+  res.setHeader('Content-Type', 'image/svg+xml');
   try {
-    const post = !slug
-      ? await fetchPost(name, tag)
-      : await fetchReadPost(name, slug);
-    return res.send(color === "dark" ? createCardDark(post) : createCard(post));
+    const post = !slug ? await fetchPost(name, tag) : await fetchReadPost(name, slug);
+    return res.send(color === 'dark' ? createCardDark(post) : createCard(post));
   } catch (e) {
     return res.send(e.message);
   }

index.js

@@ -0,0 +1,8 @@
+import express from 'express';
+import post from './api/index.js';
+
+const app = express();
+
+app.get('/', post);
+
+app.listen(3000);

package.json

@@ -5,6 +5,7 @@
   "main": "./api/index.js",
   "scripts": {
     "start": "node ./api/index.js",
+    "dev:local": "node ./index.js",
     "dev:vercel": "vercel dev --debug",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
@@ -16,5 +17,7 @@
     "graphql-request": "^6.1.0"
   },
   "type": "module",
-  "devDependencies": {} 
+  "devDependencies": {
+    "express": "^4.19.2"
+  }
 }

src/fetchers/post-fetcher.js

@@ -1,10 +1,11 @@
-import { request } from "../utils/index.js";
+import { request } from '../utils/index.js';
 
 const fetcher = (variables) => {
-  return request({
-    query: `
-            query Posts($cursor: ID, $username: String, $temp_only: Boolean, $tag: String, $limit: Int) {
-                posts(cursor: $cursor, username: $username, temp_only: $temp_only, tag: $tag, limit: $limit) {
+  return request(
+    {
+      query: `
+            query velogPosts($input: GetPostsInput!) {
+                posts(input: $input) {
                   id
                   title
                   short_description
@@ -24,13 +25,15 @@ const fetcher = (variables) => {
                 }
               }
             `,
-    variables,
-  });
+      variables,
+    },
+    3
+  );
 };
 
 async function fetchPost(name, tag) {
   try {
-    const { data } = await fetcher({ username: name, limit: 1, tag: tag });
+    const { data } = await fetcher({ input: { username: name, limit: 1, tag: tag } });
     return data.data.posts[0];
   } catch (e) {
     throw new Error(e);

src/utils/index.js

@@ -1,10 +1,10 @@
-import axios from "axios";
-import canvas from "@napi-rs/canvas";
+import axios from 'axios';
+import canvas from '@napi-rs/canvas';
 
-export function request(data) {
+export function request(data, version = 2) {
   return axios({
-    url: "https://v2.velog.io/graphql",
-    method: "post",
+    url: `https://v${version}.velog.io/graphql`,
+    method: 'post',
     data,
   });
 }
@@ -20,19 +20,19 @@ export function replaceAll(str, searchStr, replaceStr) {
 
 export function escapeHtml(text) {
   const map = {
-    "&": "&",
-    "<": "&lt;",
-    ">": "&gt;",
-    '"': "&quot;",
-    "'": "&#039;",
+    '&': '&amp;',
+    '<': '&lt;',
+    '>': '&gt;',
+    '"': '&quot;',
+    "'": '&#039;',
   };
   return text.replace(/[&<>"']/g, function (m) {
     return map[m];
   });
 }
 
 export function getTextWidth(text, font) {
-  const ctx = canvas.createCanvas(1, 1).getContext("2d");
+  const ctx = canvas.createCanvas(1, 1).getContext('2d');
   ctx.font = font;
   const textMetrics = ctx.measureText(text);