Projects
-
3D Room Planer : 웹 기반 3D 가구 배치 시뮬레이터 만들기Projects 2026. 4. 24. 22:12
뭘 만들었나?6m × 6m × 2.7m 크기의 3D 방에 가구를 배치할 수 있는 웹 애플리케이션.카탈로그에서 가구를 선택해 바닥에 배치드래그로 이동R 키로 90도 회전다른 가구와의 충돌 시각화 (빨강 하이라이트)탑뷰 / 원근 카메라 전환배치 내용 자동 저장 & 복원왜 이걸 만들었나?이 프로젝트는 의도적으로 짧은 스코프에 4가지 기술 시연을 담았다:WebGL 시각화 — Three.js로 실시간 렌더링3D 선형대수 — 광선-평면 교점, AABB 충돌 판정성능 최적화 — 50개 가구도 부드럽게 (도메인 설계 — 인테리어 도구의 아키텍처작은 프로젝트지만 "진짜 애플리케이션"으로 동작시키는 것이 목표였다.2. 기술 스택 선택 이유Vite + TypeScript 빠른 개발 루프, 타입 안전↓React + R..
-
Tiny Flow Board: 무한 캔버스 메모 보드Projects 2026. 3. 13. 13:21
링크, 메모, 이미지를 자유롭게 배치하는 Mini Canvas Board 브라우저 탭 30개를 열어두고 "나중에 봐야지" 라며 북마크에 던져놓거나, 혹은 탭으로 계속 열어두는 경우가 있다.Notion은 이렇게 사용하기에 너무 무겁고, 북마크는 리스트형이라 맥락이 사라지고, 탭을 열어두면 인터넷이 많이 잡아먹는다. "캔버스 위에 자유롭게 올려두기만 하면 되는 가벼운 도구"를 만들자라는 아이디어에서 시작되었다. 코어 기술 스택기술선택 이유Next.js 16 (App Router)RSC + Route Handler로 API까지 한 프로젝트에서 해결React Flow노드 기반 무한 캔버스의 사실상 표준Framer Motion선언적 애니메이션으로 UX 디테일 보강LocalStorage인증 없이 즉시 사용 가능한..
-
Reality Check: AI로 스타트업 아이디어 시장포화도 분석 웹Projects 2026. 3. 4. 13:58
사업을 구상하다보면 "내 아이디어는 이미 레드오션이 아닐까?", "이런 아이디어를 세상에 내놨을 때 괜찮으려나?" 하는 생각이 들 것이다.이런 불안을 단 몇 초만에 보여주는 웹 서비스를 만들었다 Reality Check 1. 왜 만들었나?스타트업 생태계에서 가장 흔한 실수라고 한다면 생태계 조사 하나 없이 이미 포화된 시장에 그냥 뛰어드는 것이다.경쟁자 분석, 시장 조사에만 보통 몇 일 ~ 몇 주가 걸리기도 한다.하지만 빠르게 진행하고 싶은 초기 창업자의 경우 이런 과정을 건너뛰기도 한다.그리고 아직 아이디어 검증을 필요로 하는 예비 창업자의 경우 자신의 아이디어를 검증 받고 싶어 할 것이다. Reality Check는 아이디어를 입력하면 AI가 실시간으로 시장을 검색하고, 유사 제품을 찾고, 포화도/..
-
Free Coders Books 개발기: 개발 무료 도서Projects 2026. 2. 18. 14:39
Github 35만 stars 프로젝트를 모던 웹앱으로 만들기에 도전했다.사실 이렇게 한 이유는 Github에 있는 것을 보려니 잘 보이지도 않고, 보기도 어려워서 UI/UX로 풀어보고 싶어서였다. Github에서 가장 많은 스타를 받은 레포지토리 중 하나인 free-programming-books 라는 것이 있다.35만개 이상의 stars를 보여한 이 프로젝트는 전 세계 개발자들이 기며하는 무료 프로그래밍 도서 목록이다.한 가지 아쉬운 점이 있다면 이 방대한 자료를 탐색하기가 어렵다는 것이다.Github의 긴 Markdown 파일을 스크롤 해야하고, 보기도 어렵다. 즉, UI/UX가 좋지 않다는 것이었다. 그래서 Free Coders Books를 만들었다.Github의 원본 데이터를 실시가능로 가져..
-
SketchTo: AI 스케치 변환 SaaS 툴Projects 2026. 2. 9. 21:55
손그림 스케치를 AI로 고품질 이미지로 변환하는 풀스택 SaaS 서비스인 SketchTo를 소개합니다.Sketch-to SketchTo는 사용자가 러프하게 손그림 스케치를 업로드하면 AI가 선택한 아트 스타일에 맞춰서 고품질 이미지로 변환해주는 서비스이다.Flat icon, Pixel Art, Anima 등 26가지 스타일을 지원하며, 프리미엄 모델 기반의 구독 결제 시스템을 갖추고 있다. Sketch-to Next.js 16 App Router를 사용한 풀스택 개발SketchTo는 Next.js 16 App Router와 Supabase를 기반으로 만들었다.프론트엔드와 백엔드를 하나의 프로젝트에서 관리할 수 있다라는 점이 1인 개발에서 가장 큰 장점으로 차지하고 있다. API Routes 구조app/..
-
플랫폼에 맞는 썸네일 만들기Projects 2026. 2. 1. 19:14
세 번째 프로젝트는 라는 제목으로 만든 썸핏(Thumb Fit)이라는 아이템이다.아이디어는 요즘 누구나 Youtube, Instagra, Shorts 등을 이용해서 자신의 것을 만들 수 있다는 것과 내가 예전에 유튜브를 잠깐 해봤을 때 어려웠던 점을 떠올리면서 제작하게 되었다. 썸네일을 만드는데 기본적인 것들을 추가해서 만들었다.메인 이미지가 들어가고, 추가적인 이미지와 이모지가 들어갈 수 있게 했다.그리고 각 이미지에는 텍스트가 들어갈 수 있다.이렇게 하면 비율에 맞춰서 내가 원하는 것을 넣을 수 있다.특히 영상을 제작하는 사람이라면 영상제작을 하다가 원하는 이미지를 캡쳐해서 올리고 텍스트를 작성해도 된다.이건 MVP로서 빠르게 나오게 하기 위해서 만들었지만 추후 계속해서 기능들을 업데이트를 하려고 ..
-
이미지 맞추기 퍼즐 만들기Projects 2026. 1. 29. 12:51
두 번째 프로젝트는 이미지 맞추기 게임이다.이건 사실 직장 동료가 필요하다고 해서 빠르게 만들어봤다.기획자체가 어려울 것이 없었다. 원하는 이미지를 넣는다 → 정답을 입력한다 → 그리드 사이즈를 설정한다 → 호스트가 어떤 기준을 가지고 그리드를 하나씩 제거한다 → 이미지에 대한 정답을 입력한다 그래서 md 파일에 정리해서 Claude Code에게 전달하고 구현하라고 했더니 금방 만든 케이스이다. 궁금하다면 한번 들어가서 봐도 좋을 것이다. 🌸 이미지 맞추기
-
이미지 변환 에디터 image converting editorProjects 2026. 1. 28. 22:49
2026년도 들어서 여러가지 목표를 세우게 됐다.그 중 하나가 "어떤 종류의 프로젝트던 만들어서 배포해보자" 라는 것이었다. 목표는 총 50개의 프로젝트를 2026년도에 진행하는 것이다.몇 개나 진행할 수 있을까?심지어 50개의 아이디어도 없다.그냥 해보는거다. 세상에 있는 제품도 내보고, 쓸데없어 보이는 것도 내보자.자꾸 완벽하게 하려니까 시작이 안되는 것 같다. 그래서 그 첫 번째 프로젝트가 프로젝트이다. 이미지 변환 에디터> 라고 이름 붙인 이 프로젝트를 만들었다.이미지를 올리면 몇 가지 변환이 가능하고, 확장자를 변환해서 다운로드도 가능하게 만들었다.추가적인 기능이 필요하다면 언제든지 붙일 수 있으니 우선은 가볍게 만들었다.나는 배포가 중요했기에 우선은 빠르게 배포하려고 한다. MVP..