유어슈 슬랙 아카이브

멘션봇

홈 키워드 아카이브

채널

1-dev_web_frontend

handy_design_system_tf

1-dev_web_frontend

유어슈 껍데기 담당

Feca [Web FE] 2월 21일, 오후 5:41

25-1 리쿠르팅 2차 스레드
@Juun [Web FE Lead]@Jerome [Web FE Vice Lead]@EATSTEAK [Web FE]@nlog [Web FE]@MJ [Web FE]@EATSTEAK [Web FE]@Ssol [Web FE]

188개의 댓글

5월 11일, 오전 11:18 에 아카이브됨

Feca [Web FE] 4월 2일, 오전 10:06

@fe (@Feca [Web FE]@Hanna [Web FE]@Juun [Web FE Lead]@Ssol [Web FE]@EATSTEAK [Web FE]@Jerome [Web FE Vice Lead])

요즘 개발자라면 개인 블로그 하나 기본템으로 있던데
플랫폼 vs 직접 만들기

뭐가 베스트임?? (편집됨)

129개의 댓글

4월 17일, 오후 10:32 에 아카이브됨

Feca [Web FE] 3월 1일, 오후 11:43

멘션봇 멤버 관리 스펙 관련 스레드
cc. @Juun [Web FE Lead]

76개의 댓글

4월 17일, 오후 10:32 에 아카이브됨

Feca [Web FE] 3월 26일, 오후 11:55

husky로 깃모지 편하게 쓰기
아주 맛있습니다 ㅋㅋ

(zx 설치해주고)
• .husky/commit-msg.mts

import { fs } from 'zx'

const commitMessagePath = process.argv[2]

if (commitMessagePath) {
  const commitMessage = fs.readFileSync(commitMessagePath, 'utf-8').trim()
  // <https://gitmoji.dev/>
  const newCommitMessage = commitMessage
    // 🐛 Fix a bug.
    .replace(/^b /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/1f41b@2x.png|:bug:: ')
    // 🎨 Improve Structure / format of the codes.
    .replace(/^a /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/1f3a8@2x.png|:art:: ')
    // 🔥 Remove code or files.
    .replace(/^f /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/1f525@2x.png|:fire:: ')
    // ✨ Introduce new features.
    .replace(/^s /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/2728@2x.png|:sparkles:: ')
    // 💄 Update UI and style files.
    .replace(/^l /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/1f484@2x.png|:lipstick:: ')
    // ♻️ Refactor code.
    .replace(/^r /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/267b-fe0f@2x.png|:recycle:: ')
    // 💩 Write bad code that needs to be improved.
    .replace(/^pp /, ':poop: ')
    // 📦 Update compiled files or packages.
    .replace(/^p /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/1f4e6@2x.png|:package:: ')
    // 🔧 Write configuration file.
    .replace(/^w /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/1f527@2x.png|:wrench:: ')
    // 🚚 Move file or directory.
    .replace(/^t /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/1f69a@2x.png|:truck:: ')

  fs.writeFileSync(commitMessagePath, newCommitMessage)
}

import { fs } from 'zx'

const commitMessagePath = process.argv[2]

if (commitMessagePath) {
  const commitMessage = fs.readFileSync(commitMessagePath, 'utf-8').trim()
  // <https://gitmoji.dev/>
  const newCommitMessage = commitMessage
    // 🐛 Fix a bug.
    .replace(/^b /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/1f41b@2x.png|:bug:: ')
    // 🎨 Improve Structure / format of the codes.
    .replace(/^a /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/1f3a8@2x.png|:art:: ')
    // 🔥 Remove code or files.
    .replace(/^f /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/1f525@2x.png|:fire:: ')
    // ✨ Introduce new features.
    .replace(/^s /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/2728@2x.png|:sparkles:: ')
    // 💄 Update UI and style files.
    .replace(/^l /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/1f484@2x.png|:lipstick:: ')
    // ♻️ Refactor code.
    .replace(/^r /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/267b-fe0f@2x.png|:recycle:: ')
    // 💩 Write bad code that needs to be improved.
    .replace(/^pp /, ':poop: ')
    // 📦 Update compiled files or packages.
    .replace(/^p /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/1f4e6@2x.png|:package:: ')
    // 🔧 Write configuration file.
    .replace(/^w /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/1f527@2x.png|:wrench:: ')
    // 🚚 Move file or directory.
    .replace(/^t /, ':https://a.slack-edge.com/production-standard-emoji-assets/14.0/apple-large/1f69a@2x.png|:truck:: ')

  fs.writeFileSync(commitMessagePath, newCommitMessage)
}

깃모지 풀로 작성안해도 굉장히 편하게 쓸 수 있습니다 (편집됨)

스크린샷 2025-03-26 23.55.19.png

23개의 댓글

4월 17일, 오후 10:32 에 아카이브됨

Feca [Web FE] 3월 31일, 오전 11:33

진짜 레전드....
cloudflare pages가 next15 (엣지 런타임) 지원 안하네요...

클플 페이지에서 nextjs dynamic route 쓰려면 해당 페이지들은 엣지 런타임으로 돌려야되는데
지원을 안함 ㅋㅋㅋㅋㅋㅋㅋ

호환성 때문에 14로 내려야되나
진짜 어지럽네요...

https://github.com/cloudflare/next-on-pages/issues/952

122개의 댓글

4월 17일, 오후 10:32 에 아카이브됨

Feca [Web FE] 2월 28일, 오후 9:24

멘션봇 스펙 관련 스레드 cc. @EATSTEAK [Web FE] (편집됨)

132개의 댓글

4월 17일, 오후 10:32 에 아카이브됨

EATSTEAK [Web FE] 4월 6일, 오후 6:03

https://www.chromium.org/developers/design-documents/
메모용

48개의 댓글

4월 17일, 오후 10:32 에 아카이브됨

EATSTEAK [Web FE] 4월 6일, 오후 2:51

다들 Component Composition 어떻게 하시나요.

예) 같은 디자인, 내부 요소를 가진 컴포넌트이지만 사용처에 따라 시멘틱 의미가 달라지거나 다른 태그를 사용해야 할 때

import { ComplexButton } from "complex-button";
import { Link } from "react-router";

export function ButtonAsLink() {
  return (<>
    {/* radix style */}
    <ComplexButton asChild>
      <Link to="/link">
        Hello
      </Link>
    </ComplexButton>
    {/* `as` Style */}
    <ComplexButton as={Link} />
  </>);
}

@radix-ui/react-slot 이 참 좋아서 애용하고 있긴 한데, asChild를 쓸 경우 children까지 신경써야 하는 경우가 있어서 as prop같은 스타일도 같이 사용할까 생각 중이에요(<= 근데 라이브러리 뭐 쓸지 못찾아서 고민).

여기에 더해서 ComplexButtonGroup 같은 컴포넌트를 만든다고 할 때, query parameter를 조작할 일이 있으면(singular ButtonGroup의 selection 상태를 query parameter로 컨트롤) 당연히 Link 컴포넌트를 사용해서 시멘틱 맥락을 노출하는 것이 좋은데, 이걸 깔끔하게 할 방법이 떠오르지 않더라고요 (일반 ButtonGroup이면 onClick과 이벤트 핸들링으로 전파가 가능한데, query params를 사용하면 Item의 각 value마다 query params를 가진 url을 렌더해줘야 하니까 동작이 크게 달라짐).

이걸 일반화 하려면 어떤 식으로 사용하는 게 좋을까요?

제가 생각하는 to-be 는 아래랑 비슷한데, 이걸 구현하는 좋은 방법이나 아이디어 있으면 의견 부탁드려요.

import { ComplexButton } from "complex-button";
import { Link } from "react-router";

export function ButtonAsLink() {
  return (<>
    {/* radix style */}
    <ComplexButton asChild>
      <Link to="/link">
        Hello
      </Link>
    </ComplexButton>
    {/* `as` Style */}
    <ComplexButton as={Link} />
  </>);
}

TL;DR
1. asChild 처럼 시멘틱 태그 변경할 때 어떤 방식이 좋을까
2. 화면에 보이는 요소(스타일, 내부 태그들)은 동일한데 인터렉션 동작만 크게 다르다면 이걸 어떻게 일반화 해야 할까(예: Button <-> Link) (편집됨)

50개의 댓글

4월 17일, 오후 10:32 에 아카이브됨

Juun [Web FE Lead] 3월 26일, 오후 8:43

pnpm v10과 ESLint Flat Compat 을 같이 사용할 때 VSCode ESLint 플러그인 서버가 제대로 동작하지 않는 버그가 있네요.

pnpm v10에서 ESLint, Prettier 플러그인들을 node_modules 하위로 호이스팅 시키지 않는 변경이 있었는데 VSCode ESLint 플러그인 서버가 호이스팅 되지 않는 ESLint 플러그인을 찾지 못해서 발생하는 문제인 것 같습니다. (ESLint CLI 환경에서는 문제 없음) (관련 이슈)

해결 방법: 프로젝트 루트 디렉토리에 .npmrc 파일을 만들고 아래 내용 추가

public-hoist-pattern[]=*eslint*
public-hoist-pattern[]=*prettier*

(편집됨)

60개의 댓글

4월 17일, 오후 10:32 에 아카이브됨

MJ [Web FE] 3월 27일, 오후 8:41

https://opencollective.com/styled-components/updates/thank-you

스컴 사망

opencollective.com

Thank you - styled-components

First and foremost, thank you to everyone who has contributed to styled-components over the years. Open Source is hard work, and many of the larger feature and/or refactoring drives probably would never have shipped without your support! As...

41개의 댓글

4월 17일, 오후 10:32 에 아카이브됨

Feca [Web FE] 3월 27일, 오전 8:29

next turbopack 빨리 플러그인 지원해줬으면 좋겠네요...
https://github.com/tatethurston/nextjs-routes
이런거 쓰고싶단말이야 엉엉

7개의 댓글

4월 17일, 오후 10:32 에 아카이브됨

스레드

4월 17일, 오후 10:32 에 아카이브됨

Feca [Web FE] 3월 31일, 오전 11:33

진짜 레전드....
cloudflare pages가 next15 (엣지 런타임) 지원 안하네요...

클플 페이지에서 nextjs dynamic route 쓰려면 해당 페이지들은 엣지 런타임으로 돌려야되는데
지원을 안함 ㅋㅋㅋㅋㅋㅋㅋ

호환성 때문에 14로 내려야되나
진짜 어지럽네요...

https://github.com/cloudflare/next-on-pages/issues/952

122개의 댓글

Feca [Web FE] 3월 31일, 오전 11:33

선택지
1. vercel로 짐꾸려서 도망간다
2. next14 쓴다

11:34

wrangler부터 시작된 악연인데 얘네 맘에 너무 안드네 ㅜㅜ

11:38

@Juun [Web FE Lead]
저희 프엔팀 할일에 레거시 플젝들 nextjs 마이그레이션 있었던거 같은데
클플 쓰기 애매하겠는데요?

Jerome [Web FE Vice Lead] 3월 31일, 오전 11:52

버셀 지원의 가능성이 올라가겠군요

Feca [Web FE] 3월 31일, 오전 11:52

20불 누가 낼거야

Jerome [Web FE Vice Lead] 3월 31일, 오전 11:55

지원 받아야죠

11:55

외부에서? ㅋㅋㅋ

Feca [Web FE] 3월 31일, 오전 11:57

ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ

11:58

쏠신이 있기 때문에 일단 무료로 돌리겠습니다
https://5ffthewall.tistory.com/135

공부하자

Next.js 프로젝트를 Vercel로 배포 자동화 + Route 53으로 도메인 변경

1. Vercel 배포를 선택한 이유동아리 내에서 팀 organization을 사용하고 있다. 원래는 AWS S3 버킷을 생성하고 배포하는 방식으로 진행하려 했다. 하지만 이번 프로젝트는 Next.js를 사용하고 있으며, 특히 API Route 기능을 활용하고 있다. 이러한 특성상 단순한 정적 빌드가 어렵다고 판단했다.Next.js의 SSR(Server Side Rendering) 및 API Route를 포함한 프로젝트는 기본적으로 서버 환경이 필요하다. AWS에서 이를 운영하려면 Lambda나 EC2 같은 추가적인 설정이 필요하지만, 이는 유지보수 비용과 복잡도를 증가시킨다. 하는 방법이 없진 않지만!! 빠른 배포가 우선이었기에 빠르고 간편한 Vercel 배포를 선택했다. Vercel은 Next.js의..

EATSTEAK [Web FE] 3월 31일, 오후 12:07

이거 엣지 런타임이 Vercel 내부에서만 사용하려고 일부러 막아둬서 그래요

12:07

결국 락인전략임

12:07

저는 궁극적으로는 Vercel 생태계에서 벗어나야 한다고 생각...

12:09

https://news.hada.io/topic?id=19999

GeekNews

Next.js를 선택하기 전에 꼭 알아야 할 것들 | GeekNews

Next.js 의 개방성과 거버넌스 문제에 대해 다루는 글: 어댑터의 부재, 공식 서버리스 지원 부족, Vercel 전용 코드 경로, 그리고 보안 사고에 대한 Vercel의 대응 자세등기술 스택 선택은 프로젝트의 개발 속도, 품질, 팀 구성 등에 장기적인 영향을 주는 중요한 결정임오픈소스 소프트웨어는 사용자에게 코드 확장 및 수정의 자유를 주며, 벤더 종속

12:18

저번 CVE도 그렇고 앞으로 Next.js가 얼마나 도미넌스를 유지할지에 대한 의구심이 있음

Juun [Web FE Lead] 3월 31일, 오후 12:24

https://opennext.js.org/cloudflare 어댑터를 사용하면 Cloudflare Workers에 Node.js 런타임으로 배포할 수 있는 것 같네요

opennext.js.org

Index - OpenNext

Open-source Next.js adapters

EATSTEAK [Web FE] 3월 31일, 오후 12:24

네 근데 그게 15를 지원 안하는게 문제...

12:26

머 암튼 제가 Next.js를 별로 안좋아 하는 이유는 기능상 문제는 아닌 만큼 가격 문제만 없다면 Vercel 사용하는 것도 나쁘진 않아 보여요. 나중에 논의해보면 좋을듯요.

12:29

아마 Next.js 쓰면서 Vercel 안쓰면 이런 문제 계속 있을거고, 둘 다 선택하거나 둘 다 버리거나 선택을 해야 할 거에요.

Feca [Web FE] 3월 31일, 오후 12:32

프레임워크 하나로 호스팅 플랫폼까지 독점해버리는 부분에서 너무 놀라는 중

12:32

절이 싫으면 중이 떠나야죠 뭐...

12:33

근데 Remix가 Next.js의 대체제가 되지 않는 이상 Next + Vercel 체제는 유지될거 같다는 생각 (편집됨)

EATSTEAK [Web FE] 3월 31일, 오후 12:34

그래서 저는 TanStack Start 응원합니다

Feca [Web FE] 3월 31일, 오후 12:35

뭐여 개쩌는데?

12:35

이런거도 있었네 ㅋㅋㅋㅋㅋㅋㅋ

12:36

아직 RSC 지원 안되는게 아쉽구만

EATSTEAK [Web FE] 3월 31일, 오후 12:41

나중에 한번 써보면서 비교해볼 예정

Jerome [Web FE Vice Lead] 3월 31일, 오후 12:41

react router도 프레임워크화 되지 않았나유

EATSTEAK [Web FE] 3월 31일, 오후 12:42

솔직히 저는 작은 사이트에는 react-router에 vite로 최적화 달아두기만 해도 충분하다고 생각해요. 다만 next 쓰면 그런걸 알아서 다 해주는게 좋다 정도?

12:43

Vercel 락인은 사실 지금은 좀 꺼림칙하기만 하지 당장 어떤 영향이 있는 건 아니라서(나중에 Vercel 가격 정책이 바뀌면 지옥도가 펼처지긴 함)

Juun [Web FE Lead] 3월 31일, 오후 12:48

https://x.com/leerob/status/1780705942734331983
Vercel 엣지 런타임 포기한거 아니였나요?
그러면 엣지 런타임만 지원하는 next-on-pages 보다 노드 런타임 지원하는 OpenNext 사용하는게 좋을 것 같은데

X (formerly Twitter)

Lee Robinson (@leerob) on X

So, @vercel reverted all edge rendering back to Node.js :grimacing: Wanted to correct the record here as it's something I've advocated for in the past, and share what I've learned since then. Also, the "edge" naming has been a bit confusing, so let's clear that up here as well. What is

EATSTEAK [Web FE] 3월 31일, 오후 12:51

OpenNext는 15 지원하네요 ㄷㄷ 근데 라우터가 바뀌나 (편집됨)

12:53

https://opennext.js.org/cloudflare/get-started#existing-nextjs-apps

opennext.js.org

Get Started - OpenNext

Open-source Next.js adapters

Feca [Web FE] 3월 31일, 오후 12:53

으잉?

12:53

고러네 지원하네

12:53

@Juun [Web FE Lead]

EATSTEAK [Web FE] 3월 31일, 오후 12:54

난독이슈였던걸로

Feca [Web FE] 3월 31일, 오후 12:54

ㄹㅇㅋㅋ

12:54

결국 wrangler를 또 끌고오는구나

EATSTEAK [Web FE] 3월 31일, 오후 12:55

Wrangler 어느 부분이 별로인가요 제대로 안써봐서 궁금

Feca [Web FE] 3월 31일, 오후 12:58

1. wrangler 자체가 지원하는 노드 런타임 바운더리가 굉장히 좁음
2. 설정 파일 지저분함 + 환경 변수를 이 설정 파일에 집어넣어야 하는데 이게 개인적으로는 마음에 안듬 (.env 아님)
3. (이건 프엔쪽은 아님) wrangler 관련 타입을 npx로 생성할 수 있는데 이게 기존 node 런타임 타입들과 상충하는 부분들이 많았음 >> 조금 설정 만지면 해결할 수는 있음

12:59

wrangler 자체를 프엔쪽에서는 안써봐서 프엔 영역에서는 잘 모르겠는데

----

써본 이후
생각보다 프엔 영역에서는 wrangler에서 요구하는게 많지는 않아보임.
opennext가 다 알아서 컨트롤해줌 (배포, next 환경 설정 등등)

---- (편집됨)

12:59

workers 서버 구성할때 경험이 너무 안좋았음

12:59

근데 배포는 너무 편했긴함

13:02

일단 써봐야겠다

Feca [Web FE] 3월 31일, 오후 1:21

아 이거 pages 배포가 아니라 worker에 next를 띄우는거네

13:22

상상도 못했던 방법이라 놀라운데

Feca [Web FE] 4월 1일, 오전 12:50

의심) opennext에서도 next.js dynamic 렌더링 > 서버 사이드 페칭을 지원안하는듯...??;;
===> 근데 이게 클플의 문제인지 어댑터의 문제인지는 모르겠음 (편집됨)

Feca [Web FE] 4월 1일, 오전 1:28

결국 vercel로 이관...

01:33

1. 배포 빌드 시점에서 pre-rendering 시점에 발생할 수 있는 문제를 캐치해주지 못함
a. ex) 클라이언트 의존성 모듈도 그냥 pre-rendering 돌려버림, 근데 vercel은 해줌
2. next.js 이미지 최적화에 추가적인 cloudflare 리소스(cf images)를 요구함
3. (가장 큰 문제) dynamic route에서 서버사이드 페칭 문제... 페칭하는 순간 실제 존재하는 url 이어도 404 not found 떠버림 --> 실제 페칭 위치는 서버니 500 에러 발생

3 => worker간 통신은 바인딩으로 해결 가능 (편집됨)

01:34

배포는 클플이 너무 편해서 좀 써보려고 했는데, next 호환이랑 너무 안되는게 많네요

01:34

@MJ [Web FE]
토스도 next 쓰는거로 아는데 사내 자체 배포 플랫폼이 있음? 아님 vercel 씀? 이거도 팀바팀인가?

EATSTEAK [Web FE] 4월 1일, 오전 8:29

그정도로 지원이 부실한가요? 그럼 거의 못쓸 수준 같은데

08:30

트러블슈팅 한번 해보려면 어떤 예시가 필요하려나

Feca [Web FE] 4월 1일, 오전 8:44

최소 재현 레포 ~~만들어볼까요?~~
만들어드릴게욥 시간 나실때 봐보셈 (편집됨)

Feca [Web FE] 4월 1일, 오전 9:11

문득 재현하다가 든 킹리적갓심 (편집됨)

09:11

cf worker 내부에서 다른 cf worker를 호출 불가능한가...?

09:24

@EATSTEAK [Web FE]
https://github.com/fecapark/cf-worker-next-ssr-issue

09:25

배포된곳 https://nextjs-cf-ssr-issue.yourssu-com4234.workers.dev

nextjs-cf-ssr-issue.yourssu-com4234.workers.dev

Create Next App

Generated by create next app

09:35

원래는 인터널 서버 에러라 클라이언트에서 표시 안되는데
인터널 서버 에러 내용을 폴백해서 클라이언트에서 보여주도록 해뒀어요

09:36

cf worker 내부에서 다른 cf worker를 호출 불가능한가...?

이거 약간 덧대자면
jsonplaceholder에서 테스트 데이터 페칭해본건 잘됐는데,
이상하게 cf woker 엔드포인트 넣어서 페칭하면 안되더라고요 (실제로는 잘됨, https://archiving-bot-worker.yourssu-com4234.workers.dev/api/channel/C08FLSZUC05)

===

https://community.cloudflare.com/t/calling-for-worker-from-another-worker/534616 ?!
ㅋㅋ 아 생각해보니까 당연한건가 (편집됨)

EATSTEAK [Web FE] 4월 1일, 오전 9:43

결국 지금 이슈가 프론트 요청 왔을 때 worker에서 다른 worker api endpoint로 요청을 보내야하는데

09:43

404가 뜬다는거죠?

Feca [Web FE] 4월 1일, 오전 9:43

네

EATSTEAK [Web FE] 4월 1일, 오전 9:45

코드 넣어서 디버깅은 안해봤지만 문제될 수 있는 지점 예상:
1. 이미 SSG되버렸다(OpenNext에서 DynamicData 씹고 static으로 뽑음) -> 이건 요청에 정상적인 worker 주소가 들어가있는걸로 봐서는 아닌듯함
2. worker에 outbound 네트워크 요청이 막혀있다

09:45

google.com 같은 common한 엔드포인트로 한번 테스트해보면 좋을듯요

09:45

한번 배포 셋업 해봐야지

Feca [Web FE] 4월 1일, 오전 9:46

worker에 outbound 네트워크 요청이 막혀있다

암만봐도 이게 맞는거 같음

09:46

이럴때 쓰라고 바인딩이 있는건감

EATSTEAK [Web FE] 4월 1일, 오전 9:49

https://developers.cloudflare.com/cloudflare-for-platforms/workers-for-platforms/configuration/outbound-workers/

Cloudflare Docs

Outbound Workers · Cloudflare for Platforms docs

Outbound Workers sit between your customer's Workers and the public Internet. They give you visibility into all outgoing fetch() requests from user Workers.

Feca [Web FE] 4월 1일, 오전 9:49

google.com 같은 common한 엔드포인트로 한번 테스트해보면 좋을듯요

잘되네요

스크린샷 2025-04-01 09.49.20.png

EATSTEAK [Web FE] 4월 1일, 오전 9:49

그렇다네요

Feca [Web FE] 4월 1일, 오전 9:49

하

EATSTEAK [Web FE] 4월 1일, 오전 9:49

:hmm:

09:50

근데 별개로 Next 안에서 다른 route로 api 콜을 하는게 좋은 프랙티스인지는