본 문서는 CLI(씨엘아이, Command Line Interface) 환경에서 사용하는 AI 코딩 도구의 설치와 활용법을 다룬다. 운영체제 환경별 설치 명령어와 공식 문서, 프롬프트 작성 가이드, 확장 기능 연동 문서를 단계별로 안내한다. 터미널 환경에서 도구를 안정적으로 구성하고 작업 흐름에 적용하는 방법을 설명한다. 1. 공식문서 도구의 전체 명령어 목록과 구성 파일 설정 방법은 공식 문서에서 제공된다. 도구의 세부 옵션과 … 더 읽기
이 문서는 Ollama를 처음 설치하는 사람이 읽고 따라 하도록 썼다. 인공지능이나 명령어 창을 다뤄 본 적이 없어도 되고, 인터넷이 연결된 컴퓨터 한 대와 20GB 정도의 빈 저장 공간만 있으면 된다. 끝까지 따라 하면 내 컴퓨터에서 도는 AI 모델, 성격을 바꿔 만든 나만의 모델, 그리고 그 모델에 파이썬 코드로 말을 거는 스크립트가 남는다. Ollama 요금제는 3단계다. … 더 읽기
Tailwind 계열 디자인 토큰 킷(Figma)을 받아 스타일가이드와 tokens.css를 만드는 절차 문서다. 프로젝트가 바뀌어도 그대로 쓰고, { } 자리만 갈아 넣는다. 킷을 처음 열어 보는 사람도 이 순서대로 따라가면 세 가지가 남는다 — 선택표(남길 토큰 목록과 근거), tokens.css(Tailwind v4 @theme 블록), Figma Style Guide 페이지. 맨 뒤 8장에 실제 킷 하나를 이 절차로 진단한 결과를 붙였다. … 더 읽기
1. “스킬”이 무엇인가 스킬은 AI에게 미리 넣어 두는 작업 설명서다. 마크다운 파일 한 장이며, “이 상황에서는 이런 순서로, 이런 규칙을 지키며 일해라”를 적어 둔 것이다. 여기서 반드시 구분해야 하는 개념이 둘 있다. 구분 정체 비유 MCP 도구 실제로 Figma 파일을 읽고 쓰는 연결 통로 (use_figma, get_design_context 등) 손과 눈 스킬 그 도구를 언제·어떤 순서로 쓸지 … 더 읽기
이 문서는 여러 명이 한 팀이 되어 참고 사이트(KB손해보험)를 다시 만들어 보는 실습의 디자인 시스템 등록 단계를 다룬다. Figma Design 파일 안 에이전트로 변수·스타일·컴포넌트·베리언트를 등록하되, 이름과 값을 Tailwind CSS v4의 테마 변수 체계에 1:1로 맞추는 것이 목표다. 여기 적힌 값은 2026년 7월 기준 Tailwind CSS v4.3 공식 문서의 기본 테마 변수 목록에서 뽑았다. 끝까지 따라 … 더 읽기
먼저 디자인부터 품질 확인까지 이어지는 흐름을 살펴보고, 이어서 Claude Code에 보낼 입력문을 순서대로 실행합니다. 마지막에는 같은 구축 과정을 파일별 설명과 검사 기준까지 포함해 자세히 확인합니다. 첫 번째 부분인 “Figma 디자인부터 QA까지, 하네스 한 바퀴 세팅”에서는 하네스의 전체 흐름과 최소 구축 절차를 확인합니다. 웹사이트 리디자인 팀프로젝트에서 Figma 시안을 코드로 옮길 때, AI 코딩 도구가 팀 규칙을 … 더 읽기
Antigravity와 Stitch MCP로 랜딩 페이지 만들기 이 문서는 Google Stitch에서 랜딩 페이지 시안을 만들고, 그 시안을 Antigravity의 에이전트가 React + Tailwind CSS 코드로 바꿔 브라우저에서 확인하는 과정을 처음부터 끝까지 따라 하는 실습 예제다. Antigravity에 Stitch MCP 연동(설치와 인증)이 이미 끝난 상태에서 시작하며, 연동 설치 과정 자체는 다루지 않는다. 끝까지 따라 하면 시안과 같은 모습의 랜딩 … 더 읽기
이 문서는 Claude Code(이하 클로드 코드)를 써 봤지만 대화가 길어지면 답이 흐려지는 경험을 한 사람을 위한 자료다. 컨텍스트 개념을 잡은 뒤 CLAUDE.md로 규칙을 남기고, 오토메모리와 컨텍스트 관리 커맨드를 익힌 후, 마지막으로 나만의 스킬 하나를 만드는 것까지 이어진다. 끝까지 따라 하면 프로젝트 폴더에 CLAUDE.md·.claude/rules/·.claude/skills/가 만들어지고, 다음 세션부터 같은 설명을 반복하지 않아도 된다. 시작하기 전에 컴퓨터에 클로드 … 더 읽기
🔸 치트시트 🔸 스킬 스킬 https://www.skills.sh/ 스킬 https://claudeskills.info/ko/ 피그마 커뮤니티 스킬 figma.com/community/skills 스킬mp https://skillsmp.com/ promptchat https://prompts.chat/skills 한국어스킬1 https://claudeskills.info/ko/ 한국어스킬2 https://findskill.ai/ko/skills/ GSAP 스킬 https://github.com/greensock/gsap-skills 🔸 디자인 시스템 모음 디자인 시스템 제공 https://oh-my-design.kr/builder 디자인 시스템 제공 https://getdesign.md/ URL -> Design.md 로 추출 https://www.design-extractor.com/ 🔸 MCP 모음 디자인 워크플로우 MCP 서버 컬렉션 https://claude.ai/public/artifacts/02db1cbf-cfb6-4ea4-8562-8732c6a69866 MCP https://mcpservers.org/ko/ mcp 서버목록 공식 … 더 읽기
💡 GeminiCLI는 2026.06.18 이후 지원종료 아래 링크 참조 https://antigravity.google/docs/gcli-migration 1. 설치 https://antigravity.google/docs/cli-overview https://antigravity.google/docs/cli-install window(powershell) irm https://antigravity.google/cli/install.ps1 | iex 환경변수 등록 환경변수 클릭 안티그래비티 설치경로 : C:\Users\<Username>\AppData\Local\agy\bin 사용자 변수에 안티그래비티 실행파일의 경로를 처장한다. 터미널 종료 후 재실행 agy 입력 방향키로 테마선택 후 엔터 상하 방향키를 눌러 done 선택후 엔터 엔터 2. 인증 터미널에 아래 명령어 입력후 엔터 … 더 읽기
