어쩌다 블로그

Toast UI Editor는 이미지 업로드 시 이미지가 base64의 형태로 자동 변환되어 업로드된다. base64는 엄청 긴 문자열이기 때문에 이를 데이터 베이스에 업로드시 여러분의 데이터 베이스는 살아남지 못할 것 그래서 이미지 업로드시 콜백 함수로 서버의 어떤 위치에 저장을 한 후에 해당 사진의 url을 리턴 값으로 받아서 에디터에 출력시켜주어야 한다. TUI Editor가 요즘 뜨는 신흥강자라고 해서 나도 이번 프로젝트에 적용하며 사용해보다가 저 부분을 개선하기 위해 인터넷을 서칭해보고 addImageBlobHook을 이용하면 된다는 걸 보고 적용하려 했는데 base64랑 url이 두 개 다 삽입이 되는 것이다...ㅠㅠㅠㅠ 개선하기 위해 해당 깃 헙의 이슈를 뒤졌는데 해결한 분이 있긴 했다. h..

최고의 공부는 역시 코딩이지~ 싶어서 이론에 대해 탄탄히 살펴볼 생각없이 구현시 필요한 것만 찾아가며 공부했는데 이론이 부족해 실수도 많이하고 어딘가에서 자꾸 좋은 코드를 못 짜고 벽에 부딪히고 있다는 생각이 자꾸 들더라.. 역시 제대로 공부해보는 경험이 필요할 것 같다는 생각이 들던 와중 카우치 코딩이란 곳에서 React 에 관한 이론 스터디를 진행한다고 하여 참여하였다. ( React 공식 사이트 + 스터디 조합의 이론공부가 정말 좋을 것 같다 두 개가 얻을 수 있는 결과물이 다르다 ) 그동안 학원 공부 하겠다고 스프링 및 Java 위주의 공부를 하며 MVC패턴만 하다가 오랜만에 리액트 코드를 만드니 살짝 어색했었는데 파이널 프로젝트에 리액트를 적용하게 되어 도움이 되고 있다. 혹시라도 카우치 코딩 ..

useCallback useCallback 이란? useCallback이란 리렌더링이 될 시에 콜백함수도 불필요하게 다시 만들어지는 상황을 방지하여 성능 최적화를 하기 위해서 생긴 hook입니다. useMemo 와 같이 이전에 만들어진 값을 재사용하기 위해 메모이제이션을 하여 이전에 만들어 놓은 콜백함수를 그대로 재사용합니다. (정확히는 값이 아닌 함수를 재사용한다.) useCallback을 사용하게 될 경우에 함수 재생성을 방지할 수는 있지만 이용하고 있는 state값이나 props값이 있을 경우 그 값이 변경되었을 시에 함수를 재생성하기 위해 의존성 배열 (deps) 내부에 값을 넣어 줘야 합니다. useCallback의 기본적인 형태는 이렇습니다. const memoizedCallback = use..

Props? 자식 컴포넌트가 부모 컴포넌트로 받아오는 값 , 언제, 왜 쓰게 되는 걸까? (데이터의 전달) 자료 출처 : Components and Props - React \ 특정한 상황에서 부모 컴포넌트에서 자식 컴포넌트로 특정한 값을 전달해서 렌더링해야할 시점이 있습니다. 이럴때 우리는 Props 를 사용하게 됩니다. 또한 리액트 애플리케이션내에서는 state값의 변경으로 리렌더링하는 로직을 호출하게 됩니다. 이로인해 전반적인 로직이 돌아가고 애플리케이션이 동작하게 됩니다. state값을 서로 전달할 때에 유용하게 props를 사용하게 됩니다. Props 전달과정 (React의 공식문서를 참고하였습니다.) function Hello(props) { // -----> props = {name : "r..