TIL

Javascript에서는 HTML 태그에 사용자가 직접 커스텀 속성을 할당할 수 있다.커스텀 속성을 작성할 때는 원하는 속성명 앞에 data-를 추가해야 하고, Javascript에서 dataset을 통해 한번에 관리할 수 있다.위와 같이 div 태그에 data-속성명

Api로 호출한 데이터의 양이 많을 때, 이를 여러 페이지에 나눠서 표시하는 방법에 대해 알아보았다.데이터 호출먼저 Api를 통해 데이터를 호출한다. data는 useQuery() 훅 함수를 이용하여 호출했다.페이지 구성먼저 useState() 훅 함수를 활용해 페이지

이번 해커톤 기간 동안 많은 시도를 해보았고, 그만큼 부족한 부분이 많다는 것을 깨달았다. 코드를 리팩토링 하고 구현하지 못했던 부분을 채워가면서 배웠던 내용을 정리하고자 한다.로그인 방식에는 크게 두 가지가 있다.• Session• JWT세션을 이용한 방식은 브라우저

처음으로 git을 통한 협업을 했다. 이전에는 개인 작업물을 저장하는 용도로만 사용했기 때문에 commit, push 등의 기능만을 사용했었다. 다른 사람들과 작업물을 공유하기 위한 git의 활용은 이제까지 알던 것과는 완전 다른 세계였다. 그래서 git에 대해 간단히

정렬 알고리즘 선택 정렬 리스트의 데이터 중 가장 작은 것을 선택해 맨 앞에 있는 것과 바꾸고, 그 다음으로 작은 것을 선택해 앞에서 두 번째 데이터와 바꾸는 과정을 반복하여 데이터를 정렬한다. 시간 복잡도 N-1번 만큼 가장 작은 수를 찾아서 앞으로 보내야 한다.

정렬 카테고리에 있는 문제라서 처음에는 여러가지 정렬을 사용하여 접근해보았다. 문제를 해결하는 로직은 크기가 작은 두 개의 카드 뭉치를 더해주고, 합해진 카드 뭉치를 다시 모든 카드 뭉치와 비교하여 작은 것들끼리 합쳐주면 된다. 그렇게 처음 작성한 코드가 아래와 같다.

Web Editor 진행 중인 프로젝트에서 게시글을 등록하는 코드를 작성하게 되었다. 단순히 ``로 구현하기에는 UI가 너무 밋밋한 느낌을 주어 Web Editor를 사용하게 되었다. 이미 리액트에는 web editor를 쉽게 사용하도록 도와주는 다양한 라이브러리가

불변성(Immutability) 불변성이란? 리액트에서 객체와 배열 타입의 상태를 다룰 때에는 불변성을 지켜야 한다. 불변성이란, 객체 또는 배열을 직접 수정하지 않는다는 것을 의미한다. 가령 다음과 가은 객체가 있다고 가정해보자. 이 때, data.name의 값을

Link & NavLink React에서는 브라우저의 주소를 변경하기 위해 ` 태그 대신 컴포넌트를 사용한다. 이 때, ` 컴포넌트는 HTML5 History API를 사용하기 때문에 컴포넌트들을 새로 불러오는 것 없이 브라우저의 주소만 변경한다. content를

CSR: Client-side Rendering 클라이언트 사이드 렌더링은 클라이언트 측에서 최초에 1번 전체 페이지를 로딩하고, 이후에는 사용자의 요청에 따라 서버에서 데이터를 받고 클라이언트가 해석하고 렌더링 하는 방식이다. CSR은 모바일 기술이 발전하면서 모바

본인만의 메서드 라인에 대한 기준을 세울 것발생할 수 있는 예외 사항에 대해서 고민할 것비즈니스 로직과 UI 로직을 분리할 것객체의 상태 접근을 제한할 것객체는 객체스럽게 사용할 것필드 수를 줄이기 위해 노력할 것성공하는 케이스 뿐만 아니라 예외 케이스에 대해서도 테스