개발을 하다 보면 이미지나 영상, 혹은 특정 요소의 비율을 고정해야 하는 상황이 생각보다 자주 생긴다. 골치 아프게 따로 계산할 필요없이, aspect-ratio라는 속성이 생겨서 훨씬 간단하게 해결할 수 있다. 오늘은 이 속성에 대해서 정리해보려고 한다.aspect-

문제는 내가 개발한 React 프로젝트를 Vercel로 배포한 후, 여러 가지 기능을 테스트한 다음에 화면을 초기화하기 위해 새로고침을 했을 때 발생했다.분명히 새로고침 하기 전까지만 해도 잘 보이던 페이지에 404 에러 화면이 나오고 있는 것이다. URL이 잘못된 것

이번에 사이드 프로젝트인 Trace를 만들면서 백엔드를 간결하게 구현하기 위해 Supabase를 사용했는데, 일반적인 회원가입에 OAuth는 물론이고 DB와 WebSocket에 이미지 업로드까지...... 게다가 제한적이기는 하지만 무료로 사용할 수 있다는 점이 정말

이전에 진행하던 사이드 프로젝트를 마무리하기 위해 카카오톡 공유하기 기능을 개발해 보려고 한다. 가이드 문서가 잘 정리되어 있기 때문에 적혀 있는 대로 차근차근 하나씩 진행하면 금방 개발하고자 하는 기능을 구현할 수 있었다!카카오 디벨롭퍼스 링크카카오 디벨롭퍼스에 접속

2026년 새해를 맞이하여 열심히 살아야겠다는 다짐이 꽤 길게 이어지고 있다. 다른 사람과 내 기준은 당연히 다르기 때문에, 객관적으로 보면 그렇게 열심히는 아닐지도 모르겠지만 아무것도 하지 않을 때보다는 나름 보람(?)도 느껴지고 하면 할수록 더 의욕도 생기는 것 같

낙관적 업데이트라는 개념은 tanstack-query를 학습하기 전부터 익히 들어왔던 내용이다. 특히 전 회사에서 SNS 프로젝트 개발에 참여했을 때, 좋아요 기능을 작업하는 과정에서 직접 구현했던 기억이 난다. 그때는 아직 경력이 1년도 안 되었을 시점이었고 tans

처음 사이드 프로젝트를 진행했을 때는 어디서부터 손을 대야 할지 막막했는데 막상 뼈대를 잡고 나니 오늘 (2월 8일) 1차적으로 마무리가 됐다.아직 붙이고 싶은 기능도 많고, 오류도 많고 수정해야 할 부분도 많고... 디자인적으로도 손을 봐야 하겠지만 어느 정도 완성본

유저 A가 유저 B에게 DM을 보낸다하나의 대화방이 생성되고, 만약 이미 존재하는 대화방이 있다면 기존에 나누었던 대화 목록이 나타난다새 메시지는 실시간으로 전송되고 읽음 처리도 가능하다conversation_id와 user_id를 primary key로 사용내가 상대

푸시 알림이 아니라, 웹 페이지 내 단순 알림에 대한 구현 방법을 기록한다notifications 테이블을 생성하여 알림의 정보를 쌓는다프론트에서는 해당 테이블에 새로운 데이터가 추가되었는지 여부를 구독하여 알림 데이터를 업데이트한다프론트가 요청을 보낼 때 직접 not

강의를 들으며 코드를 따라친 것을 제외하면 내가 만드는 프로젝트에서 tanstack query를 사용해본 것이 처음이었다. 사실 아직 모르는 부분도 많고, 내가 글을 읽으면서 공부하기보다는 직접 부딪히며 배우는 스타일이라고 생각해서 강의를 통해 기초를 익힌 뒤 무작정

세상에는 참 많은 라이브러리가 있다. 종류도 다양한 만큼 사용 방법도 다양하고, 그것 때문에 사실 개발을 처음 시작했을 때는 막연하게 좀 두려운 존재라고 생각했었던 것 같다. 지금이야 GPT나 Claude 같은 존재를 알게 되었지만 4년 전의 나는 오로지 구글 서칭 한

열심히 블로그를 쓰겠다고 다짐한 지 며칠이나 지났다고, 작심삼일로 끝낼 뻔한 것을 겨우겨우 머릿속에 떠올려 다시 돌아왔다. 사실 블로그 글을 올리지 않는 동안 개발이 조금 진행돼서 오히려 써야 할 내용이 이래저래 쌓여 있는 상황이지만 차근차근 하나씩 해결해 보려고 한다

매번 새로운 프로젝트를 시작할 때마다 소소하게(?) 헷갈리고 어려움을 겪는 부분이 있는데 바로 기본적인 레이아웃 같다.분명 몇 번 해본 기억이 있는데도 왜 텅 비어 있는 IDE를 보면 내 머릿속도 같이 텅 비어버리는 걸까...? 오늘은 중요한 레이아웃 설정 방법을 잊지

오늘은 프로젝트를 생성하고 필요한 패키지를 설치한 뒤 shadcn/ui를 프로젝트에 추가하는 작업까지를 기록해 보려고 한다. 내가 만드는 SNS 서비스에는 아래와 같은 패키지가 필요하다.전역 상태 관리를 책임질 zustandzustand와 함께 사용하며, 데이터의 불변

사이드 프로젝트를 시작해야겠다고 다짐한 지 벌써 1년... 2년이 지난 시점. 인프런에서 흥미 있는 강의가 올라오면 일 년에 몇 개씩 챙겨보기만 하고 그 기술을 도무지 어디서부터 어떻게 활용해야 할지 감을 못 잡고 있었다. SNS로 사이드 프로젝트를 하고 싶다고 막연