profile
휴식을 좋아하는 개발자
post-thumbnail

ContextAPI에서 useState로 관리하는 값을 Provider로 내려주기

오늘은 간단하게 To fix this consider wrapping it in a useMemo hook 에러를 해결하는 방법을 알아보자.

6일 전
·
0개의 댓글
post-thumbnail

무한 스크롤 구현하는 방법과 고려할 사항

무한 스크롤 구현과 최적화를 위해 display none을 사용하면 브라우저의 렌더링 동작 방식에서 어떤 문제점이 있는지 알아보자.

2022년 6월 24일
·
2개의 댓글
post-thumbnail

React Query에서 버튼 클릭시에 데이터를 요청하는 방법 (feat. useQuery)

프로젝트를 설계하다가 특정 이벤트를 발생할 경우 데이터를 요청하는 구조가 필요했다. useQuery를 이용하여 무지성으로 구현하는 방법과 정석으로 구현하는 방법을 알아보자.

2022년 6월 23일
·
0개의 댓글
post-thumbnail

Jest + react-testing-library 환경에서 TODO 프로젝트 TDD로 설계하기

지원 자격에 테스트 보고 뒤로가기 부터 누른다면?? 지금이라도 기초를 쌓아보자!!

2022년 6월 16일
·
4개의 댓글
post-thumbnail

Next.js + TypeScript 환경에서 Jest와 react-testing-library 셋팅하기

Jest + React Testing Library를 Next.js에서 사용할 수 있도록 셋팅을 해보자.

2022년 6월 15일
·
0개의 댓글
post-thumbnail

테스트를 처음 공부하는 프론트엔드 개발자의 개념 다지기

"프론트엔드에서 테스트는 어렵다" 라는 말을 듣고 테스트 공부를 안한 개발자가 있다면 지금이라도 개념부터 익혀보자.

2022년 6월 7일
·
0개의 댓글
post-thumbnail

useEffect의 실행 시점과 로딩 처리

뒤로 갔다가 다시 입장할 경우 로딩창이 나타나지 않고 깜빡거림이 나타나는 문제점

2022년 6월 2일
·
0개의 댓글
post-thumbnail

React에서 마우스 드래그와 모바일 터치 다루기

프론트엔드 프로젝트를 설계하다 보면, 마우스로 드래그 하거나 모바일로 터치한 값이 필요한 경우가 있다. 캐러셀을 예시로 드래그 이벤트에 대해 알아보자.

2022년 5월 30일
·
0개의 댓글
post-thumbnail

객체지향 프로그래밍(OOP)과 TypeScript

프론트엔드 개발자가 Class기반 객체지향 프로그래밍에 쉽게 다가갈 수 있도록 TypeScript를 이용하여 설명하는 글이다.

2022년 5월 17일
·
0개의 댓글
post-thumbnail

객체를 키와 값을 이용하여 동적 생성할 경우 Type 선언

TypeScript 환경에서 객체(objcet)를 키(key)와 값(value)를 이용하여 동적으로 생성하는 방법을 알아보자.

2022년 5월 13일
·
0개의 댓글
post-thumbnail

Spring Boot로 데이터 리턴 후 Next.js에서 Get 요청해보기

프론트엔드 개발자의 백엔드 공부 도전..!

2022년 5월 12일
·
0개의 댓글
post-thumbnail

카테고리별로 복수 선택이 불가능한 React CheckBox

카테고리마다 체크박스가 2개씩 있다고 가정하자. 복수 선택이 불가능하도록 설계하고, 체크한 아이템들을 마지막에 form onSubmit 할 때 넘겨주도록 구현하자.

2022년 5월 11일
·
0개의 댓글
post-thumbnail

Next.js 환경에서 현재 페이지 Image, PDF로 저장

현재 보여지는 페이지를 Image로 출력해보고, PDF로도 출력해보자.

2022년 5월 9일
·
0개의 댓글
post-thumbnail

React 에서 D3 사용하기 (막대 차트, 반응형)

React 환경에서 D3를 사용해보고, 반응형으로 차트의 크기를 설정해보자.

2022년 5월 5일
·
0개의 댓글
post-thumbnail

useRef의 파라미터에서 타입

TypeScript 환경에서 useRef를 사용하고 있었다. 그리고 이 ref값을 함수나 훅스에 넘겨주는 과정에서 문제가 생겼다.

2022년 5월 4일
·
0개의 댓글
post-thumbnail

CRA 명령어 없이 프로젝트 셋팅(React18, TypeScript, Webpack, Babel)

CRA없이 React18환경으로 프로젝트를 셋팅해보자. tsconfig와 webpack을 활용하여 절대 경로도 설정해줄 것이다.

2022년 4월 29일
·
0개의 댓글
post-thumbnail

React Query 사용법

Client State와 Server State를 따로 관리하는 React Query를 완전 정복해보자!

2022년 4월 28일
·
0개의 댓글
post-thumbnail

Next에서 Redux ToolKit 사용하기

Redux를 적용하려다 Redux ToolKit을 적용하게 되었다.

2022년 4월 27일
·
0개의 댓글
post-thumbnail

Axios에서 HTTP request를 이용하여 에러 처리

Network 탭의 Response 값 가져오기

2022년 4월 26일
·
0개의 댓글