본문 바로가기

분류 전체보기402

2024-08-21 광클을 방지하기 위한 노력 상황하트를 누르면 팔로우가 되는 버튼을 만들었다. 보기엔 간단해보여도자신에게 팔로우 요청을 보내는 것인지,이미 팔로우가 되어 있진 않은지,팔로우를 하려는 건지, 언팔로우를 하려는 건지로그인이 되어 있는지,상대방이 탈퇴한 회원은 아닌지 등굉장히 많은 비용이 발생하는 버튼이다. 그런데 기능 구현을 하고 나니, 뿌듯한 마음에 네트워크 탭을 열고계속 눌렀다 떼었다를 반복했다. 그러면서 문득 든 생각."사용자도 멍 때리면서 계속 누르기 딱 좋게 생겼는데?" 나의 서버비를 아끼기 위해 광클을 막아야겠다고 결심한 순간이다.한계나의 구현 방식에는 한계가 있다.카드 하나의 버튼을 광클하지 못하게 하는 것이고, 저런 카드가 수백장 있다고 했을 때매크로가 카드 엘리먼트를 찾아서 계속 클릭하는 것은 이 로직으로 막지 못한다... Programing/TIL 2024. 8. 21.
2024-08-20 이벤트 전파(event bubbling) 문제 상황사용자의 프로필 카드를 만들었다.그리고 그 프로필 카드 우측 상단에 하트를 만들었고, 하트를 클릭하면 팔로우가 되도록 하였다.follow API route가 다른 곳에서도 재사용되고 있는데 optimistic하게 보여줄 수 없는 페이지도 있어서optimistic update는 아니고,  기대하는 상황은 하트를 누르면 사용자의 프로필로 넘어가는 것이 아니라 (프로필은 카드 자체를 누르면 넘어가게 링크되어 있다.)팔로우 기능만 작동하기를 바란다. 그런데 팔로우 기능만 작동하는 것이 아니라 팔로우 버튼이 눌림과 동시에 카드 자체도 눌려진다. 버튼 위에 버튼이 있는 형상이다. 즉 자식 요소의 클릭 이벤트가 부모 요소의 클릭 이벤트까지 전파가 되었다는 것을 의미하고,이를 이벤트 버블링이라 한다. 마치 거.. Programing/TIL 2024. 8. 20.
2024-08-19 [Next.js, Supabase] 여러 테이블을 참조하는 DELETE 메서드 작성하기 구현하고자 하는 기능 파티를 삭제하면 다른 테이블에 참조되어 외래 키로 연결된 테이블의 정보까지 모두 삭제하고자 함. 현재 상황 파티를 모집하고 있다. 파티 자체는 trips라는 테이블에서 관리하고 있다. 그리고 trips에 참가하는 인원이 생기면 contract라는 테이블에 차곡차곡 기록이 된다. 테이블 구성과 구현한 로직은 이렇다. 사용자가 파티를 개설하면 trips 테이블에서 trip_id가 자동으로 생성되며 여러 데이터가 쭉 컬럼에 입력되며 하나의 레코드를 만들어 낸다.그리고 contract라는 테이블에 contract_id가 자동으로 생성되며 trips_trip_id에 아까 만들어진 trips 테이블의 trip_id와 외래 키로 묶이고, 이는 자바스크립트로 입력된다.그리고 파티를 만든 사람은 리.. Programing/TIL 2024. 8. 19.
아이 Hobby/Guitar 2024. 8. 18.
2024-08-16 미인증 사용자에게는 블러 처리된 오버레이 모달 렌더링하기 스크린샷 구현의도복잡할 것 없는 간단한 기능이지만, 프로젝트를 기획하면서 팀에 conditional route를 제안했었다. 제안했던 이유는 크게 아래와 같다. 1) 보다 안전한 사용을 위한 회원가입을 유도 -> 회원 정보를 입력하기 위해선 가입이 필요2) 회원 정보를 입력한 사용자의 개인정보를 최소한으로 보호 우리 서비스는 마치 소개팅 앱처럼 사용자들이 입력한 정보를 토대로 안전한 매칭을 해주는 서비스이다.이에 따라 사용자가 직접 사용자의 정보를 보고 판단할 수 있도록 여러가지 소셜 기능을 기획했다. 버디즈 지수는 사용자의 사이트 이용 정도를 알고리즘에 의해 평가한다.사용자는 우리의 알고리즘을 신뢰할 수 있다고 판단하면 이 지수를 보고 자신과 매칭되는 사용자의 안전성을 평가할 수 있다. 팔로잉, 팔로워.. Programing/TIL 2024. 8. 16.

티스토리툴바