전체 글 527

Getter & Setter

class User { // 생성자 필드 constructor(firstName, lastName, age) { this.firstName = firstName; this.lastName = lastName; this.age = age; // get을 정의하는 순간 this.age는 메모리의 값이 아닌 get을 호출합니다. // get을 정의하는 순간 this.age는 메모리의 값이 아닌 get을 호출합니다. } // getter get age() { return this._age; }//값을 리턴 // setter set age(value) { // 값을 설정할 수 있습니다. // 값을 받으면 그 값을 value로 설정 // if (value < 0) { // throw Error(`-1은 안됩니다....

[Error Handling] 카카오 로그인 시 owner를 판단 못하는 에러

어떤 에러인가요? 에러 메시지 $ 터미널의 에러 코드를 여기 넣어주세요. 에러 핸들링 방법 조건문을 변경해주었더니 해결되었다. // 코드가 들어가도 좋아요! 에러 핸들링을 위해 참고한 레퍼런스 링크 Memory-It 의 Error Handling 예시입니다. 링크 [Error Handling] State Lifting으로 데이터를 전달하려고했는데 Warning 메세지 발생 · Issue #205 · codestates/ 어떤 에러인가요? State Lifting으로 형제 컴포넌트로 데이터를 전달하려고 했는데 콘솔에 Warning 메세지가 떴습니다. 에러 메시지 Cannot update a component (`App`) while rendering a different component (`DiaryTy..

오류모음 2022.03.10

[Error Handling] window is not defined nextjs

어떤 에러인가요? 에러 메시지 $ window is not defined nextjs 에러 핸들링 방법 Next.js는 universal 하다. 즉, server-side에서 먼저 실행 되고, 그 후에 client-side에서 실행된다. window는 client-side에만 존재한다. 고로 React Component내에서 window를 사용하고 싶다면 componentDidMount내에 코드를 작성해야한다. if (typeof window !== 'undefined') { require('the-lib'); } 에러 핸들링을 위해 참고한 레퍼런스 링크 Memory-It 의 Error Handling 예시입니다. 링크 Next.js "window,document is not defined" 해결하는 법..

오류모음 2022.03.10

[Error Handling] next.js에서 클릭시 애니메이션을 생성 방법

어떤 에러인가요? 기존의 자바스크립트 같은 경우 classList를 사용하여 클릭시 클래스를 변경해주면서 애니메이션을 더해주고 빼주는 방법을 사용하였다. 하지만 next.js에서는 module.css를 사용하여 이게 통하지 않는다. $ 터미널의 에러 코드를 여기 넣어주세요. 에러 핸들링 방법 useState를 사용하여 className의 상태를 조절 해주자 import styles from '../../styles/Hi.module.css' import {useEffect, useState} from 'react'; const Hi = ({children, extraClass, navigateAway}) => { const [className, setClassName] = useState(styles.h..

오류모음 2022.03.10

[Error Handling] ReactHook을 사용하지 않고 상태 변경 함수를 사용할 시 에러

어떤 에러인가요? useEffect나 useMemo, useCallback을 사용하지 않고 상태 변경 함수를 사용할 시 콜 스택 에러가 발생한다. Error: Too many re-renders. React limits the number of renders to prevent an infinite loop. 에러 핸들링 방법 React Hook을 사용하여 콜 스택 에러가 나지 않게 하자 useEffect(() => { setHour(String(clock.getMinutes())); setMinute(String(clock.getHours())); if (clock.getMinutes() < 10) { setMinute('0' + minute); } else if (clock.getHours() < 1..

오류모음 2022.03.10

[Error Handling] 가운데 정렬이 되지 않는 오류

position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); 부모 요소에 relative를 주고 자식 요소에 absolute를 주어서 핸들링을 해주었는데 가운데 정렬이 되지 않았다. 에러 핸들링 방법 핸들링 방법에 대해서 간단하게 기록해보세요. /* position: absolute; margin: 0 auto; left: 0; right: 0; bottom: 0; */ 에러 핸들링을 위해 참고한 레퍼런스 링크 링크

오류모음 2022.03.10

[Error Handling] 덧글 작성시 새로 고침이 되는 버그

파이널 프로젝트 떄문에 한 동안 블로깅 하지 못하였지만 파이널 프로젝트에서 있었던 오류를 적어보려고 한다. github: https://github.com/tmdqls2257/BanThing GitHub - tmdqls2257/BanThing: 배달비를 Banthing하는 구인 플랫폼입니다. 배달비를 Banthing하는 구인 플랫폼입니다. Contribute to tmdqls2257/BanThing development by creating an account on GitHub. github.com 기존에는 덧글 작성시 새로고침이 되지 않았습니다만 어째서인지 새로고침이 된다. 코드를 변경한게 있나해서 ctrl+z를 해주었더니 지워주지 말아할 것을 지워버렸다. const onSubmit = async (e..

오류모음 2022.03.10