'cursor ai' 30건

01 카카오 API 키를 받아야 카카오맵 MCP를 활용할 수 있습니다. 카카오디벨로퍼스 홈페이지에 접속해서 카카오 계정으로 [로그인]합니다. 그런 다음 [앱 -> + 앱 생성]을 누릅니다. 카카오 API 키는 앱을 생성해야 받을 수 있습니다. 카카오디벨로퍼스 홈페이지 : https://developers.kakao.com/ Kakao Developers카카오 API를 활용하여 다양한 어플리케이션을 개발해 보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다.developers.kakao.com 02 필수값을 입력하고 [저장]을 눌러 앱을 생성합니다. 03 앱이 생성되면 [앱 -> 일반]에 있는 앱 키를 찾습니다. 그러면 4가지 키가 보이는데 그 중에서 REST API키를..

01 우선 커서에게 아무런 설명 없이 테트리스 게임을 만들어보라고 하겠습니다. 커서를 실행해서 오른쪽 위의 [+] 버튼을 눌러 새 채팅을 열고 다음과 같이 부탁합니다.테트리스 게임을 만들어봐. 게임을 만들 때는 어떤 게임인지, 규칙은 무엇인지, 어떤 환경에서 실행할지 하나하나 코드로 구현해야 합니다. 이렇게 복잡한 프로그램을 만들 때는 커서에게 지시할 질문 내용도 점점 복잡해집니다. 이럴 때 Sequential Thinking MCP를 활용하면 좋습니다. 02 Sequential Thinking을 사용하여 커서에게 다시 질문해보겠습니다.Sequential Thinking MCP를 통해 테트리스 게임을 만들 단계를 알아서 설정하고 가장 간단한 방법으로 테트리스 게임을 만들어봐. 그러면 커서가 Sequent..

01 가장 먼저 Naver Search의 API를 신청합니다. 네이버 개발자 센터에 접속하여 로그인합니다. 로그인할 때는 네이버 계정으로 로그인하면 됩니다. 로그인 후에 [Application -> 애플리케이션 등록]으로 이동합니다. 네이버 개발자 센터: https://developers.naver.com/main/ 02 다음 화면을 참고해서 설정값을 입력하거나 선택하고 [등록하기]를 눌러 등록을 마칩니다. 이때 웹 서비스 URL에는 https://localhost가 아닌 http://localhost라고 입력해야 합니다. s를 제외한 http로 입력합니다. 03 그럼 애플리케이션 등록 후 검색 API를 스미더리에 등록할 때 ClientID와 ClientSecret이 나타납니다. 두 값을 복사합니다. 그..

실습을 위해 먼저 피그마 데스크톱 앱을 설치합니다.Figma 데스크톱 앱 설치: https://www.figma.com/ko-kr/downloads/ Figma 다운로드 | 데스크톱 및 모바일용 웹 디자인 앱macOS 또는 Windows용 데스크톱에 Figma 웹 디자인 앱을 설치하세요. 그리고 글꼴 설치 프로그램과 디바이스 미리보기 앱도 다운로드하세요.www.figma.com 01 피그마 데스크톱 앱 설치가 완료되었다면 프로그램을 실행한 다음 왼쪽 위의 홈 아이콘을 눌러 메인 화면으로 이동합니다. 그런 다음 오른쪽 위의 [Design]을 눌러 빈 디자인 파일을 만듭니다. 02 빈 디자인 파일에서 페이지 빈 공간에 마우스 오른쪽 클릭을 하고 [Plugins -> Manage plugins...]를 누릅니..

01 먼저 개발에 필요한 커뮤니티 하나 준비합니다. 02 이 상태에서 커서에세 Sequential Thinking을 이용하여 커뮤니티 게시판 설계를 부탁합니다. 이때 커서가 참고할 수 있도록 레딧의 화면을 캠처하여 이미지 파일로 프롬프트를 포함시켜 줍니다. 이미지 파일을 채팅방에 Ctrl + C하여 Ctrl + V 하면 대화 세션에 추가될 것입니다. 그리고 커서에게 만들고자 하는 커뮤니티 게시판의 사용 기술과 기능을 구체적으로 나열해줍니다.sequential thinking으로 이런 디자인의 커뮤니티 게시판을 하나 개발하려는데 같이 고민해줘. 고민 단계는 5단계까지만 해. 기술은 next.js, tailwindcss와 supabase를 이용하려고 해. 이때 supabase는 supabase MCP로 모두..

01 개발을 시작하지 전에는 먼저 계획을 세웁니다. Sequential Thinking을 활성화하여 생각하게 만들어보겠습니다. 새 폴더를 열고 준비합니다. 만약 Sequential Thinking이 제대로 동작하지 않으면 다시 요청하거나 커서 설정을 확인해보는 것도 좋습니다.정적 페이지 빌드가 되는 프로그램을 만들어서 깃허브 페이지에 블로그를 호스팅하려고 해. 내가 원하는 필수 기능은 다음과 같아.1. 정적 페이지로 빌드를 할 수 있어야 해. 빌드한 결과물을 깃허브 페이지에 호스팅할 거야.2. 마크다운으로 글을 작성할 수 있어야 하고, 마크다운으로 작성한 파일을 멋지게 렌더링해야 해.3. 메뉴는 Home, About, Blog가 있고, 파일은 월별로 관리할 수 있어야 해.4. 마크다운 파일에 태그와 카테..

01 커서에게 다음과 같이 요청합니다. 그러면 관련 내용을 인지하고 중요한 설정 정보를 환경변수라는 것으로 분리하겠다고 할 겁니다. 이렇게 환경변수로 분리하면 중요한 정보는 로컬에만 남고, 깃허브와 같은 온라인 저장소에는 업로드하지 않게 됩니다. 보안에 유출되지 않도록 수파베이스 접근 키 관련 내용을 분리해줘. 프로젝트 폴더에서 다음과 같이 파일이 분리된 것을 확인했다면 보안을 챙긴 카드 뒤집기 게임 프로젝트가 거의 완성된 것입니다. 02 이제 분리된 상태로 깃허브에 올려 이력을 덮으면 됩니다. 현재 폴더의 파일 목록을 보면 .gitignore라는 파일이 있습니다. 이 파일은 깃허브에 올리면 안 되는 파일을 기록해두는 곳입니다. 03 확인을 완료했다면 이제 깃허브에도 반영해야겠죠? 커서에게 반영된 내용..

01 먼저 빈 폴더를 커서로 연 다음, 간단한 계획을 새우며 시작해봅시다. 커서에게 Sequential Thinking Tools를 활용하여 개발 계획을 세워보라고 합니다. 가장 간단한 웹 기술로 카드 뒤집기 게임을 만들 거야. Sequential Thinking으로 잘 생각해서 개발 계획을 세워봐. 데이터베이스는 Supabase를 사용할 생각이야. 02 이후 작업은 커서의 안내를 따라 설계부터 프로토타입 작성까지 진행하면 됩니다. 여기서는 커서에게 구현까지 쭉 진행하라고 지시했습니다.그래 구현 까지 쭉 진행해 03 중간 프로토타입 구현이 끝나면 게임을 한 번 실행해보라고 합니다. 실제로 실행했을 때 이상이 없는지 확인합니다. 04 문제가 없다면 수파베이스의 데이터베이스 구조를 설계하고 연동까지 마무..

01 수파베이스 MCP를 사용하려면 먼저 수파베이스 홈페이지에서 회원가입 후 액세스 토큰을 발급받아야 합니다. 커서는 이 액세스 토큰을 이용해 웹에 있는 수파베이스에 접근하고, 데이터를 읽거나 쓰는 등 다양한 조작을 할 수 있습니다. 다음의 수파베이스 홈페이지에 들어가 회원가입 후 로그인을 한 다음 프로필 아이콘에서 [Account preferences]를 누릅니다.수파베이스 홈페이지: https://supabase.com/ Supabase | The Postgres Development Platform.Build production-grade applications with a Postgres database, Authentication, instant APIs, Realtime, Functions, ..

01 Context7은 Sequential Thinking과 마찬가지로 동일한 방식으로 설치하면 됩니다. 별 어려움이 없으니 설치가 완료된 후 커서 설정에서 MCP Tools의 해당 MCP에 초록불이 제대로 들어오는지 꼭 확인하기 바랍니다.스미더리 Context7 설치 링크: https://smithery.ai/servers/upstash/context7-mcp 02 프롬프트에 'use Context7' 또는 'Context7을 사용해서~'라는 내용을 넣으면 Context7을 사용할 수 있습니다. 이렇게 하면 LLM 특유의 기존에 학습한 데이터로만 답변하거나 코딩하는 것이 아니라, 최신 문서를 기반으로 코드를 작성하므로 오류가 크게 줄어듭니다. 그럼 커서에게 최신 문서만 참고해서 간단한 카드 뒤집기 게임..

MCP는 스미더리라는 사이트에서 설치할 수 있습니다. 스미더리를 잘 이용하면 유용한 MCP를 쉽게 찾을 수 있을 뿐만 아니라 설치도 쉽게 할 수 있습니다. 01 스미더리에 접속하면 다음 화면이 보입니다. 오른쪽 위에 있는 [Login]을 누르세요. 그러면 깃허브와 구글로 로그인하라는 안내창이 뜹니다. [Continue with Github]를 눌러 깃허브 계정을 이용하여 로그인을 진행하겠습니다. 만약 깃허브 계정이 없다면 회원가입 후 여기로 돌아오세요.스미더리 홈페이지: https://smithery.ai/ 02 깃허브로 로그인한 후에 가장 먼저 할일은 자신의 계정 아이콘을 누르고 [Profile & API Keys]에서 스미더리 API 키를 생성하는 것입니다. 여기서 사용할 API 키는 코드에 사용할 ..

01 만든 대시보드를 만들기 위해 아래 링크에서 가계부 실습을 위한 스프레드시트를 복사하겠습니다. [파일 -> 사본 만들기]를 누르고 어디에 저장할 것인지 폴더를 선택한 후 [사본 만들기]를 눌러 준비합니다. 가계부 실습 데이터https://docs.google.com/spreadsheets/d/1EdfzPKkZiy5JIRpf9p16qgxFpEH2_ZAfUlmBG4jfKZM/edit?gid=0#gid=0 가계부 실습용ABCDEFGHIJKLMNOPQRSTUVWXYZ날짜항목분류수입지출잔액결제방법메모2024.1.1월급수입350000003500000은행이체정규직 월급2024.1.2커피식비045003495500카드스타벅스 아메리카노2024.1.3대중교통교통비013703494130교통docs.google.com 파..