상황 목표 삭제 시 낙관적 업데이트가 이루어지도록 설정한 상황이다.따라서 목표를 삭제하고 삭제가 성공적으로 이루어졌다면 왼쪽 네브바에서 목표가 깔끔하게 사라져야 하는데 ,낙관적 업데이트가 적용된 것처럼 바로 없어졌다가 다시 생겼다가 없어졌다. 해결많은 시도 끝에 원인은 mutateFunc가 onError를 거쳐 previousData를 보여주고 onSettled를 거쳐 삭제된 상황을 다시 보여주기 때문이었다.진짜 에러가 났다면 사실은 다시 생긴채로 유지가 되어야 하는데, onSettled를 통해 삭제가 적용된 것을 보면 삭제 자체는 잘 이루어진 것을 알 수 있다.-> 정답은, 삭제는 잘 이루어졌다. 그래서 204응답이 왔다. 그런데 이때 mutateFunc에서 return res.json()을 했기 때문..

이번에 코드잇 프론트엔드 단기심화 부트캠프 7기를 수료했다.2025.01.17?~2025.03.18까지 들었었고, 결론부터 말하자면 나에게는 매우 도움이 됐다. 단점과 장점을 살펴보자면.. 단점 1. 프로젝트 주제가 정해져있다.- 프로젝트 주제는 2개, 디자인, 백엔드 API까지 정해져있다.- 사실상 각 팀마다 주제를 변형하지 않으면 결국은 같은 서비스를 여러 팀이 만드는 꼴 .. -> 그렇게 되면 면접관은 같은 프로젝트를 여러번 보게될 수 있음- 백엔드 API가 정해져있기 때문에 기능을 새로 추가하려면 아예 처음부터 백엔드를 다시 만들어야 한다.-> 우리 팀같은 경우는 새로 추가하면서 기존 백엔드 API를 활용했다. (추가될 요소만 새로운 DB에 만들고 연동하는 방식을 사용했다.) 2. 프로젝트 내에 ..

export const THEME_COLORS = [ { id: 'blue', primary: 'bg-[#60A5FA]', secondary: 'bg-[#DBEAFE]' }, { id: 'green', primary: 'bg-[#34D399]', secondary: 'bg-[#D1FAE5]' }, { id: 'pink', primary: 'bg-[#F472B6]', secondary: 'bg-[#FCE7F3]' }, { id: 'purple', primary: 'bg-[#A78BFA]', secondary: 'bg-[#EDE9FE]' },] as const; 해당 파일을 constants에 만든 다음에 import { THEME_COLORS } from '@/constants/thems'; imp..

요구사항1. 웹앱의 메인 테마 컬러를 지정할 수 있어야 한다.2. 웹앱의 라이트모드, 다크모드, 시스템모드를 지원할 수 있어야 한다. 고민과 결정사실 보통의 경우 LocalStorage에 모드를 저장해서 사용하는 경우가 많은데,SSR의 경우 서버에서 렌더링될때는 LocalStorage에 접근하지 못하기 때문에, client에서 렌더링된 후에야 모드가 입혀지게 된다.-> 서버에서 렌더링될 때도 스타일이 입혀지길 바래서 다크모드와 테마 컬러을 Cookie에 저장하였다. tailwind에서는 dark:text-white 이런식으로 개발이 가능하다-> 그러나 프로젝트에서 텍스트나 배경 색 등은 모두 커스텀 컬러를 사용하고 있었고, 이미 기능 개발이 많이 진행되어있던 상황이어서다시 모든 스타일에 dark:스타일값..

현재 진행하는 프로젝트에서는 custom fontsize랑 custom color를 사용하고 있는데,twMerge에서 계속 색이 입혀지면 글자크기가 안입혀지는 문제가 나타났다. 이 문제는 chatgpt도 해결 못해주었다^^Stack Overflow가 아직 살아있음에 매우 감사하다.https://stackoverflow.com/questions/78185697/why-custom-tailwind-font-size-is-overwritten-by-text-colour-classㄴ 여기 답변에 의해 답을 얻었다. 이게 twMerge가 제대로 custom color, fontsize를 제대로 구분못하고 병합하는 문제 때문인데, twMerge는 뒤에 나오는 class를 더 우선순위를 둔다. tailwind에서 t..

멘토님이 tailiwind.config.ts에 정의한 사용자 스타일들 많아지면 presets폴더의 color.ts, fontSize.ts와 같이 빼라고 하셔서 빼서 import했는데tailwind에서 계속 인식을 못하는 오류가 떴다 ^^ 이유alias사용해서 import했기 때문에 .. claude 왈tailwind는 next애플리케이션이 완전히 빌드 되기 전에 빌드될 수 있어서,별칭을 제대로 해석 못할 수 있다. 해결 방법상대 경로 사용import fontSize from './src/presets/fontSize'; 원인이 alias때문인지도 모르고, 객체에 타입을 붙여보고 별 시도를 다 해봤다!! ㅎㅎ이번 문제에 있어서는 chatgpt   참고로 fontSize코드는 다음과 같다.const font..

https://softeer.ai/practice/7649 Softeer - 현대자동차그룹 SW인재확보플랫폼 softeer.ai 제한 사항3 ≤ N, M ≤ 5,000, N, M은 정수1 ≤ u, v ≤ N, u≠vc, S는 영문 대문자('A' ~ 'Z')로만 구성되어 있습니다.문제 풀면서 어려웠던 점연결 관계만 알려주었고, 그 안에서 누가 부모고 자식인지 직접 구현해야함 -> dfs로 해결순서는 유지하면서, 문자열에서 부분수열을 만들었을 때 가장 긴 길이를 구해야하는데, LCS알고리즘을 몰라서 구현하기 어려웠다.문제 풀이 방법1. node배열에 연결된 노드와 간선의 글자를 넣는다. ex) 1 2 A 이면 node[1].push([2, A]), node[2].push([1, A])2. next는 방문할 ..

문제나는 지금 웬만한 요청은 routeHandler 방식을 사용하고 있는데, 이번에 깨달은 게 있다.클라이언트에서 '/api/country' 로 fetch요청은 가능하지만,서버에서 '/api/country' 로 fetch요청은 불가능하다.일단, 내가 요청하는 주소가 현재 상대경로이다.클라이언트의 경우 브라우저는 현재 호스트를 기반으로 해서 api를 요청하는데,따라서 상대경로로 fetch요청을 하면, 알아서 현재 호스트를 앞에 붙여서 요청한다.결국, 'use client'를 붙인 컴포넌트에서 해당 fetch요청을 하면 문제가 없다.그러나, 서버의 경우는 현재 호스트정보가 없기 때문에 상대경로로 fetch요청을 하면 INVALID_URL 에러가 발생한다.클라이언트 컴포넌트와 서버 컴포넌트에서 같은 api요청..