Claude Code MCP 완벽 가이드 - 4가지 필수 서버 설치 및 활용법

Claude Code를 더욱 강력하게 만들어주는 MCP(Model Context Protocol) 서버 설치와 활용 방법을 정리했습니다.목차MCP란 무엇인가?MCP 설치 전 준비사항4가지 필수 MCP 서버Sequential Thinking - 체계적 사고 분석Context7 - 최신 라이브러리 문서Magic (21st.dev) - UI 컴포넌트 생성Playwright - 브라우저 자동화설치 방법실전 활용 팁MCP란 무엇인가?MCP(Model Context Protocol)는 Claude Code의 기능을 확장할 수 있는 플러그인 시스템입니다.기본 Claude Code에 다양한 외부 도구와 서비스를 연결하여, 더욱 강력한 개발 환경을 구축할 수 있습니다.왜 MCP를 사용해야 할까?확장성: Claude Co..

• format_list_bulleted AI
• · 2025. 10. 9.
• textsms

프리랜서 3개월 회고 - 대규모 프로젝트에 투입되다

안녕하세요! 오랜만에 블로그에 글을 쓰네요 😊 새로운 시작지난 3개월간 정말 많은 일들이 있었습니다. 프리랜서로 회사에 취업하게 되었고, 바로 대규모 프로젝트에 투입되었어요!프로젝트 투입프로젝트 이름은... 여기선 비밀이에요 ^^하지만 정말 규모가 큰 프로젝트라는 건 말씀드릴 수 있어요. 처음에는 긴장도 많이 되었지만, 새로운 환경에서 많은 것을 배울 수 있다는 생각에 설레기도 했습니다.기술 스택: React & TypeScript프로젝트에서 사용하는 주요 기술은 React와 TypeScript입니다.솔직히 말하면... 너무 어려워요 😅매일매일 새로운 것을 배우고 있지만, 배워도 배워도 끝이 없는 것 같아요. TypeScript의 타입 시스템부터 React의 다양한 패턴들, 그리고 프로젝트에서 사용하..

• format_list_bulleted 나의 일상
• · 2025. 10. 9.
• textsms

개발자들을 위한 기술 뉴스 큐레이션 웹앱, TechScope 만들기

📰 개발자들을 위한 기술 뉴스 큐레이션 웹앱, TechScope 만들기기술 트렌드는 너무 빠르게 바뀌고, 다양한 블로그나 뉴스가 흩어져 있어서 한눈에 보기 어렵습니다."개발자들이 한 곳에서 최신 기술 뉴스를 확인할 수 있으면 어떨까?"라는 생각으로 시작한 프로젝트가 바로 TechScope입니다.🧠 기획 의도기술 뉴스도 넷플릭스처럼 "카테고리별로 쉽게", "무한으로 탐색 가능하게" 보고 싶었다!다양한 기술 블로그/뉴스 API를 통합하여프론트엔드, 백엔드, AI 등 분야별 뉴스 제공태그 기반 필터링 + 키워드 검색으로 최신 트렌드를 한눈에🛠 사용 기술 스택범주기술 스택프레임워크Next.js 15 (pages 디렉토리 기반)스타일링Tailwind CSS데이터 페칭React Query (@tanstack/..

• format_list_bulleted 개인 작업
• · 2025. 6. 9.
• textsms

SQLD 개발자 자격증 준비하기

SQLD 자격증📌 SQLD 자격증 도전기 ✨**취업 준비를 하면서 ‘자기 개발은 멈추면 안 된다’**는 생각이 들어, 새로운 자격증에 도전해보기로 마음먹었습니다.현재 저는 웹디자인기능사 자격증만 보유하고 있지만, 프론트엔드 개발자로 성장하기 위해선 데이터를 이해하고 활용하는 기본적인 지식도 꼭 필요하겠다는 생각이 들었어요. 그래서 SQLD 자격증을 준비하게 되었습니다! 📌 왜 SQLD 자격증인가?국가공인 자격증이라는 점실무에서 데이터베이스를 활용할 일이 많다는 점SQL이라는 언어를 배우며 데이터 처리 능력을 기를 수 있다는 점이런 이유로 SQLD 자격증 취득을 결심했어요. 📌 시험 일정 및 준비 계획저는 제 58회차 시험을 목표로 하고 있습니다.아직 시간이 조금 남았지만, 지금부터 차근차근 준비하..

• format_list_bulleted 나의 일상
• · 2025. 6. 7.
• textsms

#05 React Vs Next 학습 개발하기

https://reactvsnext.vercel.app/ React vs Next.js | 프레임워크 비교 및 학습React vs Next.js 두 프레임워크의 차이점을 이해하고, 각각의 장단점을 학습한 후 퀴즈로 지식을 테스트해보세요.reactvsnext.vercel.app현재까지 원하는 바를 구현을 완료 했기에 vercel로 배포까지 끝맞추고 소개를 해보겠습니다! 현재 어느정도 구현이 되었나? React와 Next의 비교는 거의 끝이라고 생각합니다. 비교라고 하지만제 개인적인 생각과 검색을 해서 나오는 정보들..학습 데이터는 주기적으로 계속 올려야 할거 같습니다.공식 문서에서 보면 알 수 있듯이 학습의 데이터양은 정말 많습니다.. 제가 원하는 바를 이루려면 학습 데이터는주기적으로 업데이트 될 예정..

• format_list_bulleted 개인 작업
• · 2025. 5. 17.
• textsms

면접을 보고 다니며 면접 준비를 했던 1달...

안녕하세요 :)블로그 활동을 꾸준하게 하고 있다가 1달간 면접을 계속 보게되어 바쁜 하루를 보내왔습니다! 그러다보니... 자연스럽게 블로그 활동이 줄어들더라구요..같이 병행을 했으면 좋았지만 면접 준비로도 힘든 상황에 같이 하기에는 너무 어려웠습니다!1달동안 면접을 보면서 느낀점을 알려드릴게요.. 면접을 봤던 회사의 이름을 말씀을 드릴 순 없지만..좋아 보였던 회사도 있었고 이런곳이..? 회사가..? 라는 느낌을 주는 곳도 있었습니다. 합격한 회사도 있었고.. (불합격 한 회사가 더 많음...) 결과로는 아직도 취준생..면접을 보면서 제일 어려웠던 코테, 그리고 기술면접 코딩테스트 같은경우는 정말 제가 경험도 없었을 뿐 더러 코드를 정말 사랑해야 풀 수 있다고 느꼈습니다.. (너무 어려워요 ㅠㅠ) 기술면..

• format_list_bulleted 나의 일상
• · 2025. 5. 7.
• textsms