나노의 Devlog

이번 포스팅에선 Capacitor로 빌드한 앱에서 여러 아이콘이 순차적으로 표시되는 커스텀 스플래시 스크린을 구현하는 방법을 정리해 보았다..왜 Custom splash screen이 필요했나?Capacitor의 기본 splash screen은 단일 정적 이미지만 지원한다.🔗링크나는 여러 아이콘을 순차적으로 보여주는 애니메이션을 구현하고 싶어 React 컴포넌트로 직접 구현하였다! 1. 필요한 패키지 설치 먼저 스플래시 스크린 관련 패키지를 설치하자.나는 pnpm을 사용하고 있었으므로 pnpm으로 설치했다.pnpm add @capacitor/splash-screenpnpm add -D @capacitor/assets2. Capacitor 설정 capacitor.config.ts 파일에 스플래시 스크린 ..

이번 포스팅에서는 Capacitor로 빌드한 Android 앱에서 WebSocket 통신 중 발생한 X-Frame-Options 에러에 대해 다루었다.해결하는 과정에서 공부한 내용에 대해 아래에 정리해보았다.문제 상황 웹에서는 정상적으로 작동하던 매칭 완료 -> WebSocket 메시지 수신 -> 통화 시작 페이지 이동 로직이 Android 앱에서 다음과 같은 에러로 실패했다.🔥 이 문제는 Capacitor의 WebView 환경과 Spring Security의 기본 보안 설정이 충돌하면서 발생! 🔥WebSocket 라이브러리인 SockJS가 fallback 메커니즘으로 iframe을 사용하려 했지만, 서버가 보안상의 이유로 이를 차단했기 때문이다.이 글에서는 X-Frame-Options가 무엇인지, ..

오랜만에 티스토리 글입니다! 저는 깃블로그에 계속 쓰고있는게 편해서.. 개인적으로 재밋던 경험이라 이번엔 티스토리에도 공유해보려 합니다😊“친구하자”를 웹으로 MVP 완성을 하니, 이걸 앱으로 빌드해서 사용자들이 더 쉽게 사용할 수 있으면 좋겠다고 생각했다.원래는.. 개발자의 입장으로 링크로 이동하는 방식이 쉬울꺼라고 생각했는데, 막상 사용자에게 링크를 보내주니까 어려움을 토로하거나 방식에 의문을 가지는 사람들이 많았다..링크는 일단 어디 저장해놓고 찾아서 연결해야하고..핸드폰에서 링크를 통해 이동하는 방식이 익숙하지 않은 사람들이 더 많았다.. (일회용 링크정도만 다들 사용하는 것 같았다.)네이티브 앱으로 개발하는건 일단 시간이 많이 드니까 최대한 빠른 방법을 찾아보다가 Capacitor 플러그인을 찾..

5월 14일로 2차 프로젝트가 끝났다!!열심히 열심히 2주동안 프로젝트하고 하나가 딱 끝나니까 맥이 풀려버렸다. 그럴줄 알고 끝나고 다음날에 AI 컨퍼런스에 참석하기로 계획해 두었다.😊 오랜만에 북적북적 사람들 많은 곳에 가서 컨퍼런스 들으면 기분 전환도 되고~ 이쪽 분야에서 내로라하는 분들의 세미나를 들으면 좋은 정보도 많이 얻고 인사이트도 얻을 수 있을 것 같아 설렘을 안고 다녀왔다. 사실 약간 늦게 참석 후기를 작성하지만.. 그래도 기록을 위해 완성해서 남겨본다.AI TECH 2025 이번에 다녀온 AI Tech 2025는 정말 "실무자 관점"이라는 말이 딱 들어맞는 행사였다. 회사 관계자를 위한 자리였고, 나는 운 좋게 참석할 수 있게 되어 가게 된 것이기 때문에 회사 운영진이나 실무자의 입..

백엔드 API 만들면서 나만 헷갈렸던 DTO 설계 기준 정리!API를 만들다 보면 "DTO를 하나로 처리해도 되지 않을까?", "아니면 따로 만들어야 하나?"하는 고민이 자주 생긴다.나 역시 프로젝트를 하면서 이 부분이 헷갈려서 직접 여러 케이스를 경험하고 기준을 정리하게 되었다.그 내용을 공유해보려고 한다.📌 DTO, 꼭 나눠야 할까?결론부터 말하면,도메인이 같더라도 API 응답의 목적이 다르면 DTO는 나눠야 했다.처음에는 PeerReviewResponse 하나로 여러 API 응답을 처리했는데,API마다 필요한 데이터가 다르고,클라이언트에서는 쓸모없는 필드까지 받아야 해서 혼란이 생겼다.✅ 실무 예시: 응답 목적별로 나뉜 DTODTO 클래스 응답 목적 사용되는 APIPeerReviewDetailRe..

이번 프로젝트에서 Git을 통해 협업을 제대로 해보면서, 공부하면서 원활한 협업을 하기위해 노력하고 있다.하나의 기능 개발에 대해 Git issue를 올려 이를 git branch와 연동, 기능 개발 완료 후 PR을 하는 방식으로 작업 중이다. 이 경우, 내가 하나의 기능 개발을 완료하고, PR이 merge되지 않은 상태에서 다음 기능을 개발하려고 할 때 문제가 발생했다. 상황 요약 :1. 기능 A -> feature/a 브랜치에서 구현했고, PR은 올렸지만 아직 merge되지 않음2. 기능 B -> feature/b 브랜치에서 구현하고 싶은데, 기능 A가 선행되어야함그런데 feature/b를 main에서 따면 기능 A가 없어서 개발이 안됨.. ✅ 해결 방법 : feature/a 브랜치 기준으로 feat..