cha123hein 님의 블로그

1.  문제점- 마이페이지에서 회원정보변경에 제목은 변경이 되지만 프로필 이미지는 변경도 안되고 supabase에 업로드도 안되는 모습을 보였다.2. 해결방안- createClient 함수를 사용하여 Supabase 클라이언트를 중앙에서 생성하고 관리하도록 수정했습니다. 이를 통해 클라이언트 인스턴스가 일관되게 유지되도록 했으며, 이미지 업로드 후 새롭게 생성된 이미지 URL이 제대로 반영되도록 로직을 개선하였다. 3. 수정된 코드// 클라이언트 생성 부분const supabase = createClient();// 프로필 업데이트 함수const handleProfileUpdate = async () => { if (!user || !user.id) { console.error("Use..

1.  문제점- 디테일 페이지에서 새로고침을 했을 때 이미 좋아요를 한 경우임에도 숫자가 반영되지 않았고, 다시 좋아요를 눌렀을 때 -1로 표기되는 상황이 생겨버림.2. 해결방안좋아요를 추가하거나 취소한 직후 서버와의 동기화가 제대로 이루어지지 않아서 새로고침을 했을 때 좋아요 수가 정확하지 않을 수 있음을 알았다.-> 좋아요 추가 또는 취소 이후 서버에서 최신 상태를 다시 조회하여 클라이언트의 상태를 항상 서버와 일치하도록 한다.-> 좋아요 개수와 사용자가 좋아요를 눌렀는지 여부를 동기화하기 위해 fetchLikes() 함수를 호출하였다.const handleLike = async () => { const { data: { user } } = await supabase.auth...

1.  문제점- 마이페이지에서 좋아요 목록을 불러와야하는데 불러오지는 못하고 좋아요 목록이 없다는 글만 뜸.2. 해결방안- 확인해보니 User 테이블에서 사용자 ID가 습관적으로 post_id라 생각하고 코드를 짰었는데, supabase에서 확인해보니 board_id로 되어있었다. 데이터베이스와 코드 간의 불일치로 인해 사용자 정보를 제대로 가져올 수 없었다.3. 수정된 코드interface User { email: string; board_id: string; // 사용자 ID를 board_id로 변경 user_name: string; profile_url: string; }const { data: userProfile, error: profileError } = await su..

1.  문제점- next.js에서 미리 만들어둔 데이터를 불러오기위해 supabase와 연결하려 하였으나, 자료를 불러오지 못했다.2. 해결방안- console.log를 사용하여 data의 내용을 출력해본다.- Supabase에서 직접 쿼리 테스트를 해본다. => 계속 fetch에서 자료를 못불러온다는 오류가 떠서 이상해서 supabase에서 미리 입력해둔 자료를 확인해보니.. postId가 1부터 시작하는게 아닌 10부터 시작하고 있었다. 다시 맞는 postId를 입력해보니 제대로 자료를 불러왔다.3. 수정된 코드const fetchPost = async () => { const { data, error } = await supabase .from("Post") .sele..

프로젝트 명 : Code404소개한 줄 정리 : 개발자들을 위한 학습과 커뮤니티 플랫폼내용 : Code404는 개발자들이 실력을 향상시키고 문제를 해결할 수 있는 온라인 학습 커뮤니티 입니다. 튜토리얼과 학습 자료를 통해 새로운 기술을 배우고, 좋아요 기반의 랭킹 시스템으로 유용한 자료를 쉽게 찾을 수 있습니다. 또한, 관리자 기능을 통해 커뮤니티의 질서를 유지하고, 부적절한 콘텐츠와 사용자 관리를 원활하게 할 수 있습니다. 초보부터 전문가까지, 누구나 참여할 수 있는 열린 공간에서 성장의 기회를 발견하세요!기술 스택관련클라이언트 상태관리 도구, Zustand서버 상태관리 도구, TanStack Query주요 프레임워크, Next.js더욱 더 안전한 개발을 위한 Language, TypeScript효율적..

1.  문제점- 라이엇에서 api key를 가져오는데 api 호출에 실패하면서 계속 404 오류가 발생하였다.찾아보니 api 호출 실패하는 원인으로 아래와 같은 원인이 있다고 한다.잘못된 API URLCORS 정책에 의한 차단네트워크 문제API 서버의 응답 문제 (예: 서버 다운)잘못된 요청 형식2. 해결방안1) 우선 라이엇 api key를 24시간만 쓸 수 있기 때문에 새로 발급 받아보았으나, 해결되지않았다.2) API URL이 잘못되었는지 확인을 해보았는데, 알고보니 잘못된 경로로 api 호출을 하고 있었다.3. 수정된 코드export async function fetchItemList(): Promise { const apiUrl = 'https://ddragon.leagueoflegends...

★ 문제두 수를 입력받아 두 수의 최대공약수와 최소공배수를 반환하는 함수, solution을 완성해 보세요. 배열의 맨 앞에 최대공약수, 그다음 최소공배수를 넣어 반환하면 됩니다. 예를 들어 두 수 3, 12의 최대공약수는 3, 최소공배수는 12이므로 solution(3, 12)는 [3, 12]를 반환해야 합니다.(두 수는 1이상 1000000이하의 자연수입니다.)★ 문제 해결 과정처음에는 최소공배수와 최대공약수를 구할 수 있는 수학공식을 찾아서 적용하려고 했는데 아무리 해봐도 내가 아는 지식으로 쉽게 풀어낼 . 수 없을 것 같아 찾아보니 유클리스 호제법이라는 것이 있었다. 유클리드 호제법(Euclidean algorithm)은 두 수의 최대공약수를 구할 수 있는데.이 방법은 두 수를 나누는 과정을 반복..

★ 문제행렬의 덧셈은 행과 열의 크기가 같은 두 행렬의 같은 행, 같은 열의 값을 서로 더한 결과가 됩니다. 2개의 행렬 arr1과 arr2를 입력받아, 행렬 덧셈의 결과를 반환하는 함수, solution을 완성해주세요.(행렬 arr1, arr2의 행과 열의 길이는 500을 넘지 않습니다.) ★ 문제 해결 과정이중 for문을 사용하여 풀었는데 첫번째 for문은 i를 빈배열로 초기화하여 답을 answer에 각 행의 결과를 추가할 수 있도록하고,2번째 for 문에서 arr1과 arr2의 더한 값을 추가하였다.★ 제출한 문제 답안function solution(arr1, arr2) { var answer = []; for (let i = 0; i

보호되어 있는 글입니다.

★ 문제새로 생긴 놀이기구는 인기가 매우 많아 줄이 끊이질 않습니다. 이 놀이기구의 원래 이용료는 price원 인데, 놀이기구를 N 번 째 이용한다면 원래 이용료의 N배를 받기로 하였습니다. 즉, 처음 이용료가 100이었다면 2번째에는 200, 3번째에는 300으로 요금이 인상됩니다.놀이기구를 count번 타게 되면 현재 자신이 가지고 있는 금액에서 얼마가 모자라는지를 return 하도록 solution 함수를 완성하세요.단, 금액이 부족하지 않으면 0을 return 하세요.(놀이기구의 이용료 price : 1 ≤ price ≤ 2,500, price는 자연수처음 가지고 있던 금액 money : 1 ≤ money ≤ 1,000,000,000, money는 자연수놀이기구의 이용 횟수 count : 1 ≤ ..