수만 건의 데이터를 버벅임 없이 보여줄 수 있을까요?
됩니다.
Dashboard
TanStack Table과 Virtual Scroll을 결합해 수만 건의 데이터도 끊김 없이 그립니다. 필터 상태는 Nuqs로 모두 URL에 담아, 새로고침하거나 링크를 공유해도 같은 화면이 열립니다.
- Next.js
- TanStack Table
- Nuqs
- Node.js
- Redis
이게 될까요?
됩니다.
프론트엔드 개발자 임인혜입니다. “이게 될까요?”라는 질문을 받으면 되는 방법부터 찾습니다. 아래 네 가지 질문에 어떻게 답했는지 보여드릴게요.
받았던 질문들
질문마다 직접 만들어서 답했습니다. 데모와 코드를 바로 열어볼 수 있어요.
티켓이 열리는 순간 몰려드는 사람들을 순서대로 받을 수 있을까요?
됩니다.
Queue reservation system
대규모 트래픽이 몰리는 예매 상황을 가정한 가상 대기열입니다. Redis 자료구조로 선착순 대기열을 만들고, 결제 시점의 동시성 문제(Race Condition)는 Lua Script로 해결했습니다.
- Next.js
- Node.js
- Redis
- Lua Script
여러 사람이 한 문서를 동시에 고칠 수 있을까요?
됩니다.
Real-time Collaboration Editor
여러 사용자가 같은 문서를 동시에 편집하는 실시간 협업 에디터입니다. Tiptap과 Hocuspocus로 변경 내용을 맞추고, 문서는 Supabase(PostgreSQL)에 바이너리로 저장합니다.
- Next.js
- Tiptap
- Hocuspocus
- Node.js
- Supabase
스타일과 예산만 말하면 인테리어를 제안해 줄 수 있을까요?
됩니다.
Interior AI Agent
AI 기반 인테리어 디자인 도우미입니다. 사용자가 입력한 스타일과 예산에 맞춰 인테리어 디자인을 제안합니다.
- Python 3
- Streamlit
- LangGraph
답하는 데 쓴 도구
화면
- React, Next.js
- TypeScript
- Tailwind CSS
- TanStack Table, Nuqs
- Tiptap
서버와 실시간
- Node.js, Express
- Redis, Lua Script
- Hocuspocus
- Supabase (PostgreSQL)
AI
- Python
- LangGraph
- Streamlit
Enae에 Enable을 더해, Enaeble
막히면 파고들고, 새로우면 일단 써봅니다. 문제가 풀리는 순간의 짜릿함 때문에 오늘도 코드를 씁니다.