MCP Client 및 UI 구현하기

• UI에서 직접 연결은?

 

 

 

• Notion MCP Provider + API Route + Next.js 웹앱

 

 

 

• Next.js 핵심 문법

 

 

 

 

 

• CSR / SSR / SSG / ISR 비교

 

 

 

 

• lib/mcpClient.js

 

 

 

 

• app / api / search / route.js

 

 

 

 

• app/page.js
  • app/page.tsx 파일은 삭제하세요.

 

 

 

 

• 실습

 

 

 

• server stdio.js 를 실행하지 않고 쓸 수 있습니까?
  • 일반 Node.js 환경에서는 불가능합니다
  • 왜냐하면 lib/mcpClient.js 가 child_process.spawn ("node server stdio.js") 로
    이 파일을 실행해서 표준입출력으로 통신하기 때문입니다 .
  • 실행이 안 되면 MCP 요청을 처리할 프로세스가 아예 없습니다.
  • 웹 앱에서 Notion 검색만 하려는 경우
    • server stdio.js 필요 없음 .
    • Next.js API 에서 바로 Notion API 쓰면 됨
  • Cursor 에서 MCP 도구로 쓰고 싶다면
    • 반드시 mcp.json 파일에 설정해서 server stdio.js 를 실행해야 함
    • MCP Provider 는 별도 프로세스로 존재해야 함
  • 터미널에서 Provider 를 실행 (node server stdio.js) 한 후 Cursor AI Pane 에서 페이지를 찾는 요청을 할 경우는?
    • A) Cursor AI Pane 은 터미널에서 실행한 Provider 를 찾지 못할 수 있습니다

 

 

 

• REST API vs MCP (Model Context Protocol) 비교

 

 

 

 

 

• REST API vs MCP 선택 가이드라인