Tool/ClaudeCode&Cursor&VSCode
-
Claude commands 및 hooks 활용 - 사양서 읽고 게시판 생성Tool/ClaudeCode&Cursor&VSCode 2025. 12. 11. 11:31
이번에는 Commands을 통해서 노션에서 사양서를 읽어와서 자동으로 프로그램을 만들어보는걸 테스트 해보려고한다. 작업 순서사양서 작성 (Notion)Figma 디자인 (Tailwind로 대체)BackEnd Test-Case 작성사양서를 기준으로 Api, 화면 만들기테스트 MCP 설치$ claude$ claude init# mcp 확인 후 없으면 설치$ claude mcp list# playwright$ claude mcp add playwright -- npx -y @playwright/mcp@latest# notion$ claude mcp add notion --env NOTION_TOKEN=ntn_xxx -- npx -y @notionhq/notion-mcp-server# superbase$ cla..
-
Claude Skill 활용 - 이력서 자동입력Tool/ClaudeCode&Cursor&VSCode 2025. 12. 9. 10:53
프로젝트 생성 및 claude 시작$ mkdir resume-ai$ cd resume-ai$ claude$ /init MCP 설치$ claude mcp add playwright -- npx -y @playwright/mcp@latest Claude 요청요청 정리1. Skill 생성 요청> claude code로 skill을 만들거야 이력서 사이트 url을 주면 데이터를 분석해서 다른 사이트에 이력서 정보를 입력해주는걸 하고싶어 예시로 원티드 이력서 url를 주면 잡코리아, 사람인등 이력서 수정 페이지에 접근해서 인풋값을을 모두 넣어주게 하고 싶거든 어떤식으로 진행하면 좋을까 claude code에서 skill 만드는것부터 차근차근 설명해주면서 진행해줘 2. 환경변수 관리> ..
-
Claude Code Subagent 란 무엇인가?Tool/ClaudeCode&Cursor&VSCode 2025. 12. 9. 10:51
Subagent란?Subagent = Claude Code가 특정 작업을 처리하기 위해 자동으로 생성하는 `작업 전용 보조 AI`즉, 메인 Claude가 모든 일을 직정 하지 않고, 필요할 때 `작업자(Worker)`를 따로 만들어 수행하게 하는 구조.SubAgent는 언제 사용됨?파일 읽기/수정폴더 검색Playwright로 웹페이지 분석Notion MCP로 데이터 업로드코드 실행 / 디버깅프로젝트 구조 분석왜 필요한가?메인 챗봇과 분리되어 효율적으로 작업외부 도구(MCP)와 직접 통신작업 중간에 브라우저 열고 DOM 수집하는 등 `행동` 수행 가능코드베이스를 더 깊게 탐색하고 분석하는 데 최적화Subagent 특징 한줄 요약자동 생성됨특정 작업 전용작업 끝나면 사라짐MCP와 직접 통신함메인 Claude..
-
Claude Skill로 Notion에 Test Scenario만들기Tool/ClaudeCode&Cursor&VSCode 2025. 12. 8. 11:34
작업순서# Claude SkillTest Scenario Generator (사용자가 테스트 시나리오 작성을 요청하면 동작하는 클로드 스킬)# Playwright MCP (E2E 테스트..)웹페이지 구조, 버튼, 폼 요소를 분석# Notion MCP노션 문서, 데이터베이스 생성 Notion API 추가Notion Agent 테스트# Database 생성E2E 테스트 시나리오를 관리할 Test Scenario Hub 데이터베이스를 만들어줘, 컬럼은 시나리로 ID, 기능구분, 우선순위, 상태, 작성일자, 링크, 메모 정도가 있으면 좋겠어.# 목업 데이터 생성한번 예시로 테스트 시나리오 문서를 목업 데이터로 데이터베이스에 추가해줘# 상태별 칸반보드 생성상태별 컬럼이 보이는 칸반 보드를 하나 만들어줘# 캘랜더..
-
Claude Code 사용방법Tool/ClaudeCode&Cursor&VSCode 2025. 12. 2. 15:39
시작$ claude신규 및 기존 프로젝트 시작프로젝트에 claude 설정을 초기화해준다.READE.md파일이 있으면 읽고 분석 후 CLAUDE.md파일을 생성해준다.이미 만들어진 프로젝트의 경우 애플리케이션 아키텍처를 분석하여 CLAUDE.md 파일을 생성해준다.$ cd ${PROJECT_ROOT}# CLAUDE.md 생성$ /init파일 참조prompt에서 @을 입력 후 파일명 및 경로를 입력한다.Shift + File Drag & Drop$ @souce/components/Header.tsx이미지 참조이미지 복사 후 prompt에 붙혀넣기 한다.Shift + Image Drag & Drop줄바꿈Shift + Enter로 새 줄이 생기지 않는다. 이 경우 `/termial-setup`하면 Shift ..
-
MariaDB MCP 사용설정Tool/ClaudeCode&Cursor&VSCode 2025. 11. 12. 10:05
MCP 설정MariaDB MCP 서버 클론$ git clone git@github.com:MariaDB/mcp.git 기존 MariaDB 서버 정보services: mariadb: image: mariadb:10.6.8 container_name: mariadb-10.6.8 restart: unless-stopped ports: - "3306:3306" environment: - MYSQL_ROOT_PASSWORD=test1234@ volumes: - ./config/conf.d:/etc/mysql/conf.d - ./dump:/dump - mariadb-data:/var/lib/mysqlvolumes: mariadb-dat..
-
Cursor에서 mermaid 사용 설정Tool/ClaudeCode&Cursor&VSCode 2025. 10. 13. 12:36
Mermaid 확장 설치Cursor에서 왼쪽 사이드바의 Extensions (퍼즐 모양) 아이콘 클릭검색창에 Mermaid 입력Markdown Preview Mermaid Support 확장을 설치Cursor IDEA 재시작 테스트 챠트 코드 입력```mermaidflowchart TD START["스케줄러 실행매일 새벽 5시 10분"] --> A["마이홈크롤러 실행"] A -->|공고 수집| B["마이홈 임시 테이블(MY_HOME_RENTAL_HOUSE)"] B --> CHECK{정정공고 여부} CHECK -->|정정공고| UPDATE["기존공고 업데이트(RENTAL_HOUSE)"] UPDATE --> E CHECK -->|신규공고| C["사용할 데이터 선별"] C..
-
Cursor에서 Framelink Figma MCP 사용Tool/ClaudeCode&Cursor&VSCode 2025. 9. 23. 17:59
1. Figma API key 생성하기1.1. Figma 로그인먼저, Figma 웹사이트(https://www.figma.com)에 로그인 1.2. Profile 접근페이지 오른쪽 상단에 있는 프로필 아이콘(아바타)을 클릭. 이 아이콘은 보통 사용자의 이니셜이나 설정한 프로필 사진으로 되어 있다.1.3. Settings 메뉴드롭다운 메뉴에서 'Settings' 또는 '설정'을 선택 1.4. API Key 생성'Settings' 페이지로 이동하면 탭 메뉴에서 'Security' 섹션을 찾을 수 있다.이 섹션에서 'Generate new token' 버튼을 클릭생성할 토큰의 용도를 설명하는 이름을 입력하고 'Create' 버튼을 클릭하여 API 토큰을 생성 2. Cursor에 Framelink MCP 추가 ..