소개
무엇이든 쉽고 재미있게 설명할 방법이 있다고 믿는 사람입니다.
인사이트 "한 입 크기로 잘라먹는 리액트" 도서의 저자입니다.
주니어 개발자 혹은 개발자들을 희망하는 이들을 돕기 위해
지식 공유사이트 DEVSTU를 개발해 약 2년간 운영했고
리액트 개발자들을 위한 오픈채팅방을 운영하고 있습니다.
좋은 발성과 딕션 그리고 시각자료에 언제나 진심입니다.
강의
전체2수강평
게시글
질문&답변
2024.07.24
versel 배포 후 id : null
안녕하세요 이정환입니다. 프로젝트의 전체 코드를 확인해봐야 이유를 알 수 있을 것 같습니다. 질문 가이드라인을 확인하시어 전체 프로젝트의 코드를 깃허브 등으로 전달해주시면 확인해보겠습니다 😃
- 0
- 1
- 47
질문&답변
2024.07.23
eslint 다운로드하면서
안녕하세요 이정환입니다. 아마 eslint가 아닌 prettier 옵션 설정이 잘못된 것으로 보입니다. 1섹션의 "VSCode 설치하기" 챕터에 안내드린대로 prettier 설정을 다시 확인해보시는게 좋을 것 같습니다. 그래도 안된다면 답글 부탁드립니다.
- 0
- 1
- 59
질문&답변
2024.07.23
투두리스트 코드
안녕하세요 이정환입니다. 섹션 0의 "예제 코드 및 강의 자료 안내" 에 챕터별로 안내되어 있습니다. 참고하시기 바랍니다 (사진)
- 0
- 1
- 60
질문&답변
2024.07.22
Checkbox를 누르는데 왜 Editor가 리렌더링되나요?
안녕하세요 이정환입니다. 현재 프로젝트에서 최적화를 적용했는데도 강의와 다르게 Editor 컴포넌트가 리렌더링 된다는 말씀이실까요 ? 그렇다면 원인을 정확히 파악하기 위해 질문 가이드라인에 공지해 드린대로 전체 프로젝트의 코드가 필요합니다. 코드를 깃허브에 업로드하신 다음 링크로 공유해주시면 살펴보겠습니다.
- 0
- 2
- 61
질문&답변
2024.07.22
로컬 스토리지 로딩 관련질문
안녕하세요 이정환입니다. 넵 .. 로딩이 너무 빨라서 그렇습니다 ㅠㅠ 로딩화면을 보고 싶으시다면 LocalStorage로 부터 데이터를 불러오는 함수에 setData 메서드를 호출하기 전에 setTimeout 함수를 사용해 딜레이를 걸어주시면 됩니다. 구체적으로 말씀드리자면 우선 다음과 같은 딜레이 함수를 만들어주신 다음에 export async function delay(ms: number) { return new Promise((resolve) => { setTimeout(() => { resolve(""); }, ms); }); } 해당 함수를 다음과 같이 호출해 주시면 됩니다! useEffect(() => { init(); // useEffect 내에서 await을 사용할 수 없으므로 init 이라는 별도의 함수로 분리 }, []); const init = async () => { await delay(3000); // 3초간 정지 const storedData = localStorage.getItem("diary"); if (!storedData) { setIsLoading(false); return; } const parsedData = JSON.parse(storedData); if (!Array.isArray(parsedData)) { setIsLoading(false); return; } let maxId = 0; parsedData.forEach((item) => { if (Number(item.id) > maxId) { maxId = item.id; } }); idRef.current = maxId + 1; dispatch({ type: "INIT", data: parsedData, }); setIsLoading(false); };
- 0
- 3
- 83