MCP 도전기

바이브 코딩 바이브 코딩

지난 시간에 바이브 코딩이 무엇인지에 대해 알아보았고, 이제 실전으로 사용해볼 차례이다. 특히 MCP를 사용한 개발을 진행하여, 아침에 읽을 개발자 뉴스를 Notion에 한국어로 정리해주는 서비스를 만들어보려고 한다.

Notion MCP

https://developers.notion.com/docs/mcp

Notion MCP – Connect Notion to your favorite AI tools

Cursor와 같은 AI에서 생성한 결과를 Notion으로 옮기는 과정은 여태 사람이 맡아서 하고 있었지만, 이제 그 중간다리 역할을 MCP에게 떠넘길 수 있게 되었다. 방법은 간단하다. Github에 자세히 설명되어 있다.
 
https://github.com/makenotion/notion-mcp-server

GitHub - makenotion/notion-mcp-server: Official Notion MCP Server

우리는 Cursor를 사용해서 MCP를 작성할 예정이다. 깃허브에서 안내하는 것과 같이, .cursor/mcp.json 폴더와 파일을 생성하자.
https://www.notion.so/profile/integrations

The AI workspace that works for you. | Notion

다음으로는 해당 페이지에서 Notion MCP 연결을 위한 API 키를 받고, 어떤 페이지를 수정할 건지 권한을 추가하면 된다. 이걸로 세팅은 모두 끝이다. 이제 Cursor에게 특정 URL에 대한 내용을 정리해서 Notion의 특정 위치 하위에 페이지를 생성해 작성해달라고 했다.
 

## JavaScript Weekly #741 주요 뉴스

출처: https://javascriptweekly.com/issues/741

- Exploring JavaScript (ES2025 Edition) 출시: Dr. Axel Rauschmayer가 최신 모던 자바스크립트 언어 기능을 다루는 새 책을 출간했습니다. 이 책은 온라인에서 무료로 읽을 수 있으며, 학습을 돕기 위한 플래시카드도 함께 제공됩니다. [(링크)](https://javascriptweekly.com/link/170732/web)
- Biome v2 공개: TypeScript 컴파일러(tsc) 없이도 타입 인식 린팅 규칙을 제공하는 최초의 JavaScript 및 TypeScript 린터입니다. 플러그인 및 모노레포 지원이 개선되었습니다. [(링크)](https://javascriptweekly.com/link/170735/web)
- Bun v1.2.16 업데이트: 고성능 자바스크립트 런타임 Bun의 새 버전이 출시되었습니다. `Bun.serve`를 통해 파일 라우팅을 지원하고 다수의 버그 수정 및 Node 호환성 개선이 포함되었습니다. [(링크)](https://javascriptweekly.com/link/170740/web)
- React Native 0.80 출시: React 19.1을 지원하며, 새로운 TypeScript 타입 세트(opt-in)와 iOS 빌드 속도 향상을 위한 사전 빌드된 의존성 실험 기능이 추가되었습니다. 레거시 아키텍처는 이제 공식적으로 동결되었습니다. [(링크)](https://javascriptweekly.com/link/170761/web)
- <syntax-highlight> 커스텀 엘리먼트: CSS Custom Highlight API를 사용하여 구문 강조를 제공하는 새로운 커스텀 엘리먼트입니다. 기존처럼 모든 토큰을 `<span>`으로 감쌀 필요가 없어집니다. [(링크)](https://javascriptweekly.com/link/170757/web)

 
진짜 간단하게 핵심만 요약해서 정리해주었다. 연결은 잘 된 것 같다. 이렇게 쭉쭉 문서 작성을 시켜보려 하던 중, 이게 왠걸, Cursor가 다운되었다.... SNS를 확인해보니 나 뿐만 아니라 모두가 커서 다운을 외치고 있었다. (타이밍 무엇)
 
이래서는 써먹지를 못한다. Cursor의 치명적인 문제는 인터넷이 연결되어있지 않으면 아무것도 할 수가 없다는 것이다. (VSCode화...) 어쩔 수 없다. Cursor가 살아날 때 까지 아무것도 할 수 없으니 다시 VS Code로 넘어가야만 한다.
 

VS Code + MCP + Copilot

https://code.visualstudio.com/mcp

https://code.visualstudio.com/mcp

이번에 VSCode도 정식으로 MCP를 지원하게 되면서 다음과 같은 MCP들을 settings에서 연결해 사용할 수 있게 되었다. 때문에 Cursor에서 사용했던 API 키를 그대로 VScode에 붙인 뒤, Copilot을 agent로 교체하면 Cursor와 유사하게 동작한다.
 

## React의 현재와 미래에 대한 논의

최근 개발자 커뮤니티에서는 React의 복잡성 증가와 대안 프레임워크의 부상에 대한 논의가 활발합니다. 한 개발자 블로그 글에서는 2025년을 기점으로 React 사용을 중단하기로 한 이유를 공유하며 많은 공감을 얻었습니다. 이와 관련된 주요 논점은 다음과 같습니다.[\n(참고 URL: Why I Decided to Stop Working with React.js in 2025](https://dev.to/holasoymalva/why-i-decided-to-stop-working-with-reactjs-in-2025-4d1l))

- 생태계 피로감(Ecosystem Fatigue): React는 UI 라이브러리이므로 라우팅, 상태 관리, 데이터 페칭 등을 위해 React Router, Redux/Zustand, React Query 등 수많은 라이브러리를 개발자가 직접 선택하고 조합해야 합니다. 이 과정에서 발생하는 버전 충돌, 설정의 복잡성, 학습 곡선에 대한 피로감이 커지고 있다는 지적입니다.
- 복잡성 증가: 클래스 컴포넌트 시절의 단순함과 달리, Hooks의 등장과 useEffect의 의존성 관리, 서버 컴포넌트(RSC)와 같은 새로운 패러다임이 추가되면서 React 자체가 무거워지고 복잡해졌다는 비판이 있습니다.
- 과열된 시장: React 개발자 수요는 여전히 높지만, 공급 또한 크게 늘어 시장이 포화 상태에 이르렀습니다. 이로 인해 다른 개발자와의 기술적 차별성을 확보하기가 점점 더 어려워지고 있습니다.
- 더 나은 대안의 부상: Svelte, SolidJS, Qwik과 같이 더 적은 보일러플레이트, 뛰어난 성능, 직관적인 개발 경험을 제공하는 프레임워크들이 주목받고 있습니다. 이들은 React의 단점을 보완하며 새로운 가능성을 제시하고 있습니다.
- 커뮤니티의 파편화: 다양한 라이브러리 조합과 각기 다른 '베스트 프랙티스'가 공존하면서, React 커뮤니티는 예전과 같은 통일된 방향성을 찾기 어려워졌습니다. 이는 신규 개발자들에게 혼란을 줄 수 있는 요인으로 작용합니다.

---

## 최신 소식을 접할 수 있는 주요 React/JS 뉴스레터

빠르게 변화하는 React 생태계의 최신 동향을 놓치지 않기 위해 뉴스레터를 구독하는 것은 매우 유용한 방법입니다. 다음은 개발자들 사이에서 가장 많이 추천되는 뉴스레터 목록입니다.[\n(참고 URL: Top 5 React Newsletters to Follow in 2024](https://svar.dev/blog/posts/react-newsletters/))

- This Week in React: React 및 React Native 관련 가장 포괄적이고 상세한 소식을 다루는 뉴스레터입니다. 블로그 포스트, 튜토리얼, 신규 라이브러리, 팟캐스트 등 방대한 정보를 제공하여 숙련된 개발자에게 적합합니다.
- React Digest: 매주 5개의 엄선된 아티클을 짧은 요약과 함께 제공합니다. 정보 과부하 없이 핵심적인 내용만 빠르게 파악하고 싶은 개발자에게 유용합니다.
- React Status: React와 React Native의 주요 뉴스와 업데이트를 다룹니다. 특히 'Code, Tools & Libraries' 섹션을 통해 실용적인 라이브러리, 훅, GitHub 프로젝트를 발굴하는 재미가 있습니다.
- Bytes: JavaScript, React, Node.js 등 프론트엔드 전반을 다루지만 React에 높은 비중을 둡니다. 재미있고 가벼운 톤으로 기술적 주제를 다루며, 'Spot the Bug'라는 코딩 퀴즈 코너가 특징입니다.
- Next.js Weekly: Vercel에서 직접 발행하는 뉴스레터로, Next.js 생태계의 새로운 기능, 모범 사례, 관련 도구에 대한 가장 정확하고 빠른 정보를 얻을 수 있습니다.

 
코파일럿에게 이번주 React와 Javascript관련 이슈를 정리해달라 요청한 결과가 다음과 같다. Next.js에서 이번에 15버전 관련으로 Vercel에 의존적으로 변화하는 문제가 발생하는가 싶더니 React 자체의 문제도 점점 드러나는 모양이다. (특히 생태계 피로감...)
 
조금 더 자세히 설명하고 Template도 지정할 수 있을지 알아봐야겠다.
 
VSCode에 붙이고 난 뒤, Cursor가 다시 정상적으로 돌아왔다. 14일 뒤 프로 버전 지원이 종료되면 어디까지 가능할지에 따라 계속 Cursor를 사용할지, VSCode를 사용할지로 나뉘게 될 것 같다.