2025.11 자산 앱 프로젝트 진행 현황
지난 11월은 자산 앱의 핵심 기능 개발에 집중한 한 달이었습니다. 이번 달 개발 범위는 특히 실시간 자산 시세 데이터 수집 및 화면 반영 안정화에 초점을 맞췄습니다. 국내·해외 주식부터 가상자산까지 실제 금융 시장의 변동 데이터를 끊김 없이 취합하고 화면에 제공하기 위해 전체 데이터 처리 흐름을 재설계하고 구현했습니다. 프로젝트 핵심 요약 구분 주요 진행 사항 실시간 주식/해외주식 … 더 읽기
개발 노트
FastAPI, Next.js, PostgreSQL을 활용하여 자산 관리 애플리케이션을 개발하면서 겪은 시행착오와 문제 해결 과정, 그리고 AI를 활용한 실전 학습과 성장의 기록을 공유하는 공간입니다.
반응형 레이아웃 만들기 — Next.js + Mantine 실전 예제
웹 서비스의 사용자는 데스크톱, 태블릿, 모바일 등 다양한 화면 크기에서 페이지를 사용합니다.따라서 하나의 화면이 다양한 디바이스에서 자연스럽게 동작하도록 만드는 반응형 설계는 필수입니다. 이번 글에서는 자산앱 프로젝트의 포트폴리오 상세 화면을 예시로,Mantine UI + Next.js 기반에서 반응형 레이아웃을 어떻게 구성했는지 실제 화면의 캡처와 코드를 중심으로 정리해봤습니다. 🔍 이번 글에서 다룰 내용 1. 반응형이 필요한 이유 포트폴리오 관리 … 더 읽기
실시간 주가 연동을 위한 Open API 활용(한국투자증권)
주식 투자 앱이나 자산관리 서비스를 개발하다 보면, 실시간 주가 데이터를 안전하게 제공하는 API가 필요합니다.저는 이번 프로젝트를 위해서 한국투자증권의 Open API를 사용 했습니다. 이를 활용하면 국내 상장 주식의 실시간 시세, 체결 정보, 거래 내역 등을 조회할 수 있습니다.이번 글에서는 API 사용을 위한 신청과 승인 과정 그리고 간단한 구현 예제를 가이드 합니다. 한국투자증권 Open API란? 한국투자증권 Open … 더 읽기
SSR, CSR의 개념과 차이점
이번 글에서는 2가지 렌더링 방식인 SSR(Server Side Rendering)과 CSR(Client Side Rendering)의 개념, 차이점, 동작 방식, 그리고 어떤 상황에서 어떤 방식을 선택해야되는지를 살펴 보겠습니다. 웹 애플리케이션을 개발할 때 SSR(Server Side Rendering) 과 CSR(Client Side Rendering) 은 반드시 이해해야 할 핵심 개념입니다. 특히 Next.js 같은 현대적인 프레임워크는 두 방식을 모두 지원하기 때문에, 각각의 동작 원리와 차이를 명확히 … 더 읽기
2025.10 자산 앱 프로젝트 진행 현황
10월 개발 기록 – 서비스 구조와 화면 설계 중심 리뷰 자산 관리 앱 프로젝트를 시작한 지 벌써 한 달이 지났습니다.이번 글에서는 지난 1개월 동안 진행된 데이터베이스 모델링, 백엔드, 프론트엔드 개발 현황을 정리하고, 앞으로의 개발 방향과 계획을 함께 공유하려고 합니다. 🧭 프로젝트 개요 개발 중인 자산 관리 애플리케이션은 개인 투자자가 보유한 주식, 가상자산, 부동산 등 다양한 … 더 읽기
Next.js의 동적 페이지 처리
Next.js는 파일 기반 라우팅(file-based routing) 시스템을 제공하는 React 프레임워크입니다. 특히 동적 페이지(dynamic routing) 기능은 실제 서비스에서 매우 자주 사용됩니다.이번 글에서는 포트폴리오 상세 페이지를 구현한 실제 예시 코드를 바탕으로 Next.js의 동적 페이지 처리 방식의 구조와 동작 원리를 자세히 설명하겠습니다. 📁 프로젝트 구조 이 프로젝트에서 핵심은 /pages/portfolio/[portfolioId].tsx 파일입니다.[portfolioId]는 Next.js의 동적 경로(Dynamic Route) 문법으로, URL의 파라미터를 페이지 컴포넌트에 … 더 읽기
Next.js + FastAPI 프로젝트에 Mantine UI 적용하는 방법
이번 글에서는 Next.js 기반 프론트엔드에 UI 컴포넌트 라이브러리인 Mantine UI를 적용하는 방법과 저의 프로젝트에 적용 과정에서 발생한 SSR(Server Side Rendering) 관련 오류 해결 방법까지 다루겠습니다. 🧩 개발환경 1. Mantine UI란? Mantine UI는 React 기반의 오픈소스 UI 컴포넌트 라이브러리입니다.TypeScript와 SSR을 지원하며, 다크 모드, 스타일 시스템, 접근성(ARIA) 기능이 내장되어 있습니다. 주요 특징 Next.js와 궁합이 좋고, 다양한 UI … 더 읽기
PostgreSQL에서 DateTime을 한국 시간(KST) 기준으로 다루는 방법
Next.js + FastAPI + PostgreSQL 환경에서 안전하게 한국 시간(KST)을 다루는 법 🔍 들어가며 애플리케이션을 개발하다보면 모든 데이터의 기준 시간을 어떻게 관리하는 게 좋을지 고민이 생깁니다.이번 글에서는 PostgreSQL의 2가지 데이터 타입에 대해서 알아보고, 한국에서만 운영되는 서비스의 경우와 글로벌 서비스를 고려한 DateTime을 다루는 방법을 다뤄보겠습니다. 🧩 기본 모델 구조 위 예시처럼 created_at, updated_at, deposit_date 등 datetime 필드가 … 더 읽기
개발 초기 더미 데이터(dummy data) 만드는 법
개발 초기에는 CRUD API를 검증하거나 UI 화면을 테스트하기 위해 더미 데이터(dummy data)가 필요합니다.특히 FastAPI + PostgreSQL + Docker 환경에서는 백엔드와 데이터베이스가 별도로 구동되기 때문에 테스트용 초기 데이터를 자동으로 세팅해주는 스크립트가 있으면 훨씬 효율적입니다.이번 글에서는 다양한 더미 데이터는 생성 방법과 각각의 장단점을 정리했습니다. 🧭 왜 테스트 데이터 초기화가 필요할까? 개발 초기에는 UI나 API 기능 검증을 위해 … 더 읽기
테이블을 꼭 FK(ForeignKey)로 연결하는게 좋을까?
“모든 테이블을 ForeignKey로 연결해야 할까?”저는 자산앱의 데이터베이스 모델링을 하면서 테이블이 늘어나고 관계가 복잡해질수록 이런 질문이 생기기 시작했습니다.특히 FastAPI와 PostgreSQL 환경에서 SQLModel/SQLAlchemy 같은 ORM을 쓰면, 설계 결정이 코드와 런타임 동작에 직접적인 영향을 미치기 때문에 고민이 더 자주 발생하죠.이번 글에서는 실제 예제 코드를 기반으로, FK를 사용하는 이유와 사용하지 않았을 때의 차이점, 그리고 어떤 상황에서 FK를 의도적으로 생략하는 … 더 읽기