목록React (4)
코딩쌀롱

📌 상황1 이슈 트래커의 라벨페이지에서 라벨들을 get할 때 selector를 사용해서 response 값을 받으려고 했다. 그런데 라벨, 마일스톤을 한 selector로 받아올 수 있으면 좋을 것 같아 인자를 넘길 수 있는 selectorFamily를 사용했다. path값을 인자로 넘겨서 라벨, 마일스톤이 한 selector를 사용할 수 있게끔 했다. ✱selectorFamily - 공식문서 공식문서를 보면 코드가 아닌 글들은 이해하기 어렵다ㅠㅠ 좀 더 익숙해지면 이해할 수 있게 될까... selector 문서와 같이 영어로 보면서 이해하려고 노력해봤다. ‣ key: 내부적으로 atom을 식별하는데 사용되는 고유한 문자열, 앱 전체의 atom, selector에 대해 고유해야 함! key값이 똑같은 게..

🤨 오류1 useRef로 바로 캔버스 요소를 쓰려고 하자 null로 오류 🤓 해결 카일코드를 참고해서 해결했다. useEffect를 사용해서 canvas요소와 context객체를 state에 저장했다. 🤨 오류2 함수에서 상태값을 바로 사용하려니까 오류. 사실 너무 쉬운..문제임-.- 초기값을 null로 해줬고, generic도 유니언타입으로 넘겨놓고... 🤓 해결 조건문으로 상태값 확인! 참고로, canvas 상태값은 안 썼으니까 조건문에 없어도 됐음 if(!ctx) return; 이렇게~~

📌 event.target 타입 지정 event.target을 typescript로 어떻게 해줘야할지 모르겠었는데 카일이 도움을 줘서 해결했다. 위 코드에 주석을 붙여 설명해보았다. 아직 타입단언이 뭔지 감이 안 온다...😥 📌 달력 기능 구현 완료.. 오늘 드디어 달력을 마무리했다. 크게 단계를 나누자면 1. 달력을 띄우는 것: new Date()와 여러 메서드들 사용 2. 캐로셀: 화살표 버튼 클릭에 따라 duration, position, 내용이 바뀐다. 3. 날짜 선택: 사용자의 클릭에 따라, 호버에 따라.. 1단계인 달력을 띄우는 건 바닐라로 해봤어서 확실히 수월했다. 바닐라 자바스크립트로 할 때 참고했던 블로그가 즐겨찾기에 있어서 다행히..ㅎㅎㅎ 2단계는 큐랑 세미페어할 때 캐로셀 코드를 봤어..

useState의 지연 초기화를 통해 리액트 함수 컴포넌트를 최적화시킬 수 있다. // 예제 1 const Counter = () => { const [count, setCount] = useState( Number.parseInt(window.localStorage.getItem(cacheKey)), ) useEffect(() => { window.localStorage.setItem(cacheKey, count) }, [cacheKey, count]) return ( Count: {count} setCount((prevCount) => prevCount - 1)}>- setCount((prevCount) => prevCount + 1)}>+ ) } // 예제 2 const Counter = () =>..