코딩 일지

프로젝트를 하다보면 성능 최적화를 의식해 useCallback, useMemo와 Memo를 습관적으로 사용하지만 정작 어떤 차이가 있는지 정확히 알지 못한 채 사용하고 있다는 것을 깨달았다. 그래서 useCallback, useMemo와 Memo 각각의 사용법에 대해 개념부터 다시 제대로 알아보려고 한다. useCallback함수의 재생성을 방지하는 React Hook컴포넌트가 리렌더링되더라도 동일한 의존성 배열을 갖는 한, 이전에 생성한 함수를 재사용함수가 자식 컴포넌트에 props로 전달될 때 유용. 왜냐면, 새로 생성된 함수는 참조가 바뀌어 자식 컴포넌트가 불필요하게 리렌더링될 수 있기 때문어떻게 사용하는지?컴포넌트의 리랜더링 방지자바스크립트에서 function (){} 나 () => {} 은 항상..

기술블로그를 처음 작성할 때부터 어떤 플랫폼에 글을 써야할지 고민을 많이 했다.길게 고민할 여유는 없어 일단 벨로그로 시작해 몇 달동안 글을 써왔다. 마크다운 문법에는 어느 정도 익숙해졌지만 그와 별개로 여러 가지 불편한 점들이 있었다. 우선 벨로그는 플랫폼 자체 유저가 많지 않고, SEO 노출이 잘 되지 않다보니 다른 사람들과 소통한다는 느낌이 잘 들지 않았다. 블로그는 다른 사람들과 소통하는 맛으로 방문자수도 확인하고 소소하게 댓글도 남기고 하는 재미가 있는데, 그런게 부족하다보니 아무래도 동기부여가 덜 됐던 것도 있는 것 같다. 또, 이미지를 넣을 때마다 아래 설명을 넣을 수 없다는 점이 불편했고 동영상도 매번 gif로 변환해서 삽입해야한다는 점도 좀 불편했다. 이 부분은 왜 개선이 안되는지 모르겠..

이번 팀프로젝트에서는 CRUD를 구현하고 활용해야했다. 하지만 CRUD에 대해서 처음 들어본 나는 먼저 어떤 개념인지 파악을 하기위해 CRUD가 뭔지 찾아봤다. CRUD 문서란? CRUD (생성(Create), 읽기(Read), 갱신(Update), 삭제(Delete))는 저장된 데이터에 대해 작업할 수 있는 방법의 약어입니다. 영속적인 저장소의 4가지 기본 기능에 대한 연상기호입니다. CRUD는 일반적으로 데이터베이스나 데이터 저장소에서 수행되는 작업을 의미하지만, 데이터가 실제로 삭제되지 않지만 상태에 삭제된 것으로 표시되는 일시 삭제와 같은 애플리케이션의 고수준 기능에도 적용될 수 있습니다. CRUD는 대부분의 컴퓨터 소프트웨어가 가지는 기본적인 데이터 처리 기능인 Create(생성), Read(읽..

현재 상황 팀과 팀원을 소개하는 미니 프로젝트를 진행 중이다. 레이아웃이 백프로 마음에 들지는 않았지만, 메인 화면 텍스트 레이아웃에 대해서 충분히 고민할 시간은 없어 일단 그대로 진행하기로 결정했다. 일단 내가 맡은 부분은 상세페이지 구현이었는데, 레이아웃까지는 익숙한 코드라 무리없이 잘 만들었지만 아직 자바스크립트가 익숙치 않아 어떻게 시작해야할지 막막했다. 문제점 이번에 캐러셀을 처음 구현해보는거라 보통 캐러셀을 구현할 때 이미지 단위로 슬라이드를 넘기는데, 디자인과 기획 상 전체 화면이 넘어가는 방식으로 캐러셀을 구현해야 했다. 처음에는 html 파일을 여러 개를 만들어 버튼을 누르면 다른 html 파일로 넘어가도록 해야하나했는데, 팀원들과 논의 해보니 이미지처럼 div 여러 종류를 만들어 그게 ..