코딩

console.log(combinedData); 찍으니 이제 date별로 data가 나오게 되었다. 하지만 각자 속성이 다른 계좌 데이터와 현금 데이터... 리턴문으로 렌더링할때 조금 신경을 써줘야 했다 export default function MonthConsumptionDetail({ combinedData, }: { combinedData: CombinedData[]; }) { const detailBoxRef = useRef(null); useEffect(() => { if (detailBoxRef.current) { const itemCount = combinedData?.reduce( (height, group) => height + group.data.length, 0 ) || 0; con..

export default function MonthConsumptionContainer({ years, month, setYears, setMonth, monthSumData, groupedData, cashGroupedData, }: { years: number; month: number; setYears: Dispatch; setMonth: Dispatch; monthSumData: MonthSumData | Record; groupedData: GroupedData[]; cashGroupedData: CashGroupedData[]; }) { //6월 데이터와 7월 데이터를 나눠서, 6월 박스의 높이만 커지게 하지 않게 합니다 const monthData = groupedData.filter( (..

기존 useEffect(() => { const setBoxHeight = () => { if (detailBoxRef.current) { const itemHeight = 4.5; const itemCount = groupedData.reduce((count, group) => count + group.data.length, 0); const calculatedHeight = itemHeight * itemCount + 3 * itemCount; detailBoxRef.current.style.height = `${calculatedHeight}vh`; } }; setBoxHeight(); }, [groupedData, detailBoxRef]); 수정후 useEffect(() => { if (deta..

import { useCallback } from "react"; // ... Your imports and other code ... export default function DayPage() { // ... Your state declarations ... // Function to fetch data using useCallback const handleFetchData = useCallback(() => { dayRender(userId, month, date) .then((response) => { // 데이터 처리 로직 //console.log(response.data.data); setDayConsumptionData(response.data.data.paymentResponses); //..

서버에서 데이터는 들어왔는데, 렌더링이 안되는 경우가 있다 useEffect(() => { const handleFetchData = () => { dayRender(userId, month, date) .then((response) => { // 데이터 처리 로직 console.log(response.data); console.log(response.data.data) setDayConsumptionData(response.data.data.paymentResponses); setDaySumData(response.data.data.daySummary); }) .catch((error) => { // 에러 처리 로직 console.log(error); }); }; handleFetchData(); },..

서버와 데이터를 연결하다 보면, 가장 먼저 마주하는 에러는 cors 에러이다. CORS는 보안 상의 이유로 인해 브라우저에서 실행 중인 웹 애플리케이션이 다른 출처(도메인, 프로토콜, 포트)의 리소스에 접근하는 것을 제한하는 정책이다. 따라서, 요청을 보내는 클라이언트에서 CORS 에러를 피하려면 올바른 CORS 헤더를 포함하는 요청을 보내야 합니다. 이를 위해 요청 헤더에 필요한 정보를 추가하여 CORS 정책을 준수해야 합니다. 예를 들어, Access-Control-Allow-Origin 헤더를 설정하여 허용된 출처를 명시할 수 있습니다. 하지만, Access-Control-Allow-Origin 헤더를 설정하였음에도 불구하고 안되는 경우가 있다. 위의 코드에서는 "ngrok-skip-browser-..

초기세팅을 하기 위해서, setting 브랜치를 dev(팀원들이랑 같이 쓰는 브랜치)로 merge 하는 pr을 날리려고 했는데, 문제가 생겼다. There isn't anything to compare. dev and setting are entirely different commit histories. 비교할 것이 없다. dev와 setting 은 완전히 다른 커밋내역을 가지고 있다 원인을 찾지 못하다가, 각 브랜치가 서로 다른 폴더구조를 가지고 있어서 비교자체를 못하는 것 같다는 팀원의 말에 각 브랜치의 폴더구조를 살펴보았다 아예 상위폴더 구조 부터 달라서 pr이 불가능했던 것이다. 아마 깃 클론을 받을때 원격 main 브랜치(아무것도 없던)에서 가져와서 setting의 폴더구조가 dev와 다르게 나..

git push origin 본인이름/작업내용을 입력하면? 지금 위치해있는 로컬브랜치의 내용을 복사해서, 원격에서 ‘본인이름/작업내용’ 라는 이름으로 새로운 브랜치가 생긴다 즉, 로컬에서 만든 브랜치를 원격 브랜치로 옮기는 것이다! 올바른 가이드라인은 작업한 내용을 식별 가능한 방식으로 로컬 브랜치를 명명하고, 해당 로컬 브랜치를 원격저장소로 푸시하는 것입니다. 로컬저장소의 현재 브랜치를 원격저장소에 푸시하기 위해서는 다음과 같은 단계를 따를 수 있습니다: 1. 새로운 로컬 브랜치를 생성하고 현재 로컬 브랜치의 내용을 해당 로컬브랜치로 이동시킵니다. git branch 본인이름/작업내용 git checkout 본인이름/작업내용 이 명령어는 본인이름/작업내용이라는 이름의 새로운 브랜치를 생성하고, 해당 브..