분류 전체보기348 08.22 바이브 코딩 도전기 우당탕탕 개발계에서 원하는 페이지를 구현하긴 했으니,이제 퍼블리싱을 실제로 해볼 차례다. AI에 물어보니, Vercel을 이용하자는데..단계는 다음과 같다. 1. Git에 올린다 2. Vercel을 통해 디플로이 한다 Vercel은 프론트엔드 프레임워크와 정적 사이트를 위한 클라우드 플랫폼이다. GitHub, GitLab, Bitbucket과 같은 버전 관리 시스템과의 완벽한 연동을 통해,코드 변경 사항을 푸시하는 것만으로 빌드, 배포, 호스팅을 자동 지원한다. 복잡한 서버 설정이나 인프라 관리의 부담 없이, 코드만 개발하면 된다. 아래는 Vercel에 대한 조사 내용이다. 1. 간편하고 자동화된 배포 (Zero-Config Deployment)Git 레포지토리를 Vercel에 연결하기만 하면, .. 2025. 8. 22. 08.21 바이브 코딩 도전기 디자인과 기능에 대한 욕심을 확 줄였다. 일단 퍼블리싱까지 해서, 전체 웹 개발 프로세스를 경험한다로 목표를 좁히기로 했다. 마음을 제대로 먹고 아예 덜어낼 거 덜어내고 나니까 오히려 보기가 좋아진 것 같기도.. 색깔 정도 넣고, 이미지 export 하는 기능 정도로만 좁혀서 만들었다. 여기까지 정리하는 건 저번주에 끝냈었다.근데, 밀린 일이 너무 많다보니, 진척을 못내고 있었다 개발 목적의 파일을 만들기 위해서, 빌드를 진행했다. npm run build 퍼블리싱으로 넘어가기 전에 Github를 정리하기로 했다. 2025. 8. 21. Github 정리 깃허브 사용법은 잘 모른채로, 사용했던 터라... 레포지토리가 아주 난장판이다. (알고리듬 공부할 때는, 하위에 폴더 만드는 법을 알게되어서 정리를 그나마 했는데...맨 처음 자료구조 할 때는 잘 모르던 때라... 아주 그냥 난장판이다) 나중에 날 잡아서 정리 한 번 해야겠다라고 마음을 먹고 있었다. 그리고 그 날이 왔다. 바이브 코딩 사이드 프로젝트를 진행하던 중 퍼블리싱 단계에 왔고,Git에 코드를 연동해야하는데,더러운 레포지토리를 보는 순간, 흠.. 이제는 칼을 빼들어야겠다 싶었다. 1단계: 사전 준비 (로컬 환경 설정) 일단 아래 링크에서 Git을 다운 받는다- Github에서 GUI를 통해 작업하는 것보다, CLI를 통해 작업하는게 차라리 낫다고 하는데, 애초에 GUI에서 어떻게 작업하는지조.. 2025. 8. 21. 08.15 바이브 코딩 도전기 V0의 tsx 파일을 그대로 사용하는 걸 목표로 잡고 진행해보았다.V0 tsx 파일은 테일윈드css 라이브러리를 사용하는 모양인데, npm이 자꾸 제대로 인스톨을 못하는 문제가 있었다. AI와 함께 몇 시간을 끙끙댄 결과 그대로 붙여넣는 이 방식은 포기하기로 했다.기껏 만들어준 tsx 파일이 아까웠으므로, 이걸 활용하는 쪽으로 선회를 틀었다.이렇게 한 이유는, 아래와 같았다. - AI 디자인 툴은 어찌되었든 디자인에 대한 레이어를 고민해서 만들었을 거라는 생각 - IDE 환경에서 그렇기 때문에 디자인 고도화를 시켜나갈 때, 충돌 혹은 예외 사항이 적을거라는 생각 하지만 막상 이것도 쉽지 않음을 알게 되엇다.v0가 제공하는 tsx파일은 꽤나 많은 라이브러리 사용을 요했기 때문이다.Ai 도움을 받아 필.. 2025. 8. 15. 08.14 바이브 코딩 도전기 어제 Node.js 설치만하고 접었는데오늘은 본격적인 개발환경 세팅까지 진행했다. PM을 몇 년째 하고는 있지만, 개발자 출신 PM이 아니고 또 필드전문가에 가까운 입장이다보니 계속 헷갈렸는데, 이 참에 기술스택에 대해서 좀 더 정확하게 이해하는 시간이 되어서 좋았다. Node.js : js를 실행하는 런타임 환경 npm : Node.js의 패키지 매니저 ; 리액트, 바벨 등의 패키지를 관리하는 역할을 한다리액트 : 사용자 인터페이스를 만들기 위한 js 라이브러리 타입스크립트 : 자바스크립트 상위개념 ; js 정적타입 기능이 추가됨 > 오류 조기 발견 / 코드 가독성과 유지보수성 / 따라서 대규모 프로젝트적합 Vite : WebPack을 대체하는 도구 .. 2025. 8. 15. 08.13 바이브 코딩 도전기 2 앞서 말한대로 전략을 수정했다.AI 디자인툴이 아무래도 만드라트 차트가 뭔지를 모르는 듯 했다. 그래서 만다라트 차트가 9x9의 매트릭스 형식임을 설명하고9x9를 그리는 걸 먼저 유도하기로 했다. 수정된 디자인 프롬프트 (Revised Prompt for Main Page)## 1. Primary Objective & Core User ExperiencePrompt Goal: Design ONLY the main landing page for "Mandala.io". The key feature is an interactive editor. Important: The AI should focus on creating a functional grid-based planning tool, NOT an ar.. 2025. 8. 13. 08.11 바이브 코딩 도전기 1 7월에 시몬님이라는 디자이너 분의 바이브코딩 이야기를 듣고, 정말 이번에는 도전해봐야겠다 마음을 먹었다.오픈카톡방에 참여하며,시몬님이 하는 라이브를 3번 참석하면서 이정도면 나도 정말 가능하겠네 싶었다. 시몬님의 경우 웹으로 테스트 후, 앱개발하여 수익화를 했다고 하여,이 성공모델을 벤치마킹하기로 했다,어떤 걸로 먼저 테스트를 할까 고민스럽긴했다. 사실 시몬님이 만다라트 차트를 웹으로 구현했다고 해서, 나는 만다라트 차트 하지 말아야지 라는 반감이 처음엔 있었다. 하지만, 좀 더 생각해보니 나는 5년째 수기로 만다라트 차트를 활용하면서나름의 노하우가 쌓여있는 상태고 기획자 포지션인 내가 만들면 정말 기능적으로 꽤 괜찮은 프로덕트를 만들 수 있을 거 같았다. 7월 5주차- 당시 나는 ChatGPT > .. 2025. 8. 11. PMP Audit에 걸리다 10% 정도만 Audit에 걸린다는 데, 그게 내가 됬다. PMI에서 이렇게 메일이 왔는데, 처음에는 자격 증명이 잘 접수됬나보다 싶었다. 그런데, 대개 5일이면 자격 증명이 끝난다는 인증심사 완료 메일이 오지 않는 게 이상해서일주일 기다려보고 또 다시 메일을 읽어보니... 그게 아니었던 것이다. 차라리, 무언가 부족해서 날 골랐다고 해주면 좋으련만'randomly'라는 단어가 좀 야속하다. 링크를 타고 myPMI 대시보드로 넘어가보자. 이렇게, In Audit 상태로 떠 있는 상태창을 볼 수 있다 ! 예전에는 서면 제출 목적으로 봉투가 왔다는데, 요새는 디지털로 서류를 제출하는 양식으로 바뀐 모양이다. Access Audit Package UI를 눌러 들어가보면 이렇게 요구하는 서류 제출 항목이.. 2025. 8. 11. PMP 공부 방법 1. 35PDU 강의 회사에서, 강의료 지원을 해주어서 UDMEY에서 웅진싱크빅 강의를 들었다. 강의는 전체적으로 중복되는 내용이 많아서 전부를 다 집중해서 듣기에는 비효율적이다 나의 경우는, 나중에 PMBOK가이드를 혼자 살펴보며 공부하는 건 효율이 나오지 않을 거 같아서 강의를 배속 정리해가며 들었으나,,,다음 번에는 이렇게도 안 들을 거 같다, (이유는 후술) 평소에, PM 방법론에 대해 관심이 항상 많았기 때문에, 알만한 내용들이 꽤 나왔다.한편으로, 정리해서 생각해본 적은 없었기 때문에 그런 측면에서는 과거/현재하고 있는 PM 업무를 상기하며 꽤나 도움이 되었다. 2. 35PDU 강의를 들어야 PMP 신청이 가능하다 PMP 시험 신청 전에, application을 PMI 홈페이지에서 작.. 2025. 7. 27. 이전 1 2 3 4 ··· 39 다음 반응형
