Amada Coding Club

여전히 패스트 캠퍼스 강의를 듣고 있다. 나는 분명 이 강의가 리액트를 아예 모르는 사람들을 위한 강의인 줄 알았는데 어우 Hook을 설명도 없이 막 쓴다. 그래서 당황한 마음에 리액트에서 자주 사용하는 Hook을 정리하려고 한다. (Hook은 커스텀도 가능하고 계속 만들어지고 있기 때문에 모든 hook을 설명하는 건 힘들다) 먼저 Hook에 대해 알아보자 Hook이란? Hook은 React 16.8에 새로 추가된 기능입니다. Hook은 class를 작성하지 않고도 state와 다른 React의 기능들을 사용할 수 있게 해줍니다. Hook은 함수형 컴포넌트에서 사용되는 기능으로 클래스형 컴포넌트에서 가능했던 state나 다른 기능들을 함수형 컴포넌트에서도 사용할 수 있게 도와준다. 또한, 기존에 클래스형..

패스트캠퍼스에서 이미지 갤러리 서비스를 연습하던 중 이미지 파일을 브라우저에 드롭할 수 있게 도와주는 react-dropzone에 대해 알아봤다. 신기하게 이번 시간에선 리액트를 타입스크립트로 만졌고 React-dropzone에서 다음 부분에 문제가 생겼다. const onDrop = useCallback((acceptedFiles) => { // Do something with the files }, []) 파일이 브라우저에 드롭됐을 때 그 파일을 처리하는 부분이다. 이 부분의 acceptedFiles 부분에 문제가 생겼다 acceptedFiles가 'any'타입으로 명시되어 오류가 난다는 뜻이다. 해결책은 간단했다. 타입 스크립트이기 때문에 acceptedFiles의 타입을 명시하면 된다. 이 값은 ..