부가 라이브러리 사용 없이 React와 NestJS (+TypeOrm)으로 Pagination을 구현해봤다. 우선 백엔드인 NestJS 코드는 이렇다. (Service만 보겠다)Controller에서 queryString으로 page를 받는다. 우리 게시판은 무조건 게

NextJS 13.4 App Router 회고를 간단히 tailwindcss 사용기부터 시작하려고 한다.많은 장점이 있지만, 우리가 이번에 tailwind를 사용하기로 결정한 가장 큰 이유는 Next팀이 장려하고 있기 때문.를 CLI로 입력하면,이 메세지가 뿅 나타난다

Git, 개발의 필수 툴이다. 그러나 초보 개발자들에게 Git을 어떻게 쓰고 있는지를 물어보면, 의외로 (?) commit - push - pull만 치는, 마치 Google Cloud 처럼 사용하는 경우가 많을 것이다.이번에 GanOverflow 프로젝트를 팀 단위로

아니, 공식문서에서 useEffect가 이렇게 늦게 나온다고? 원래 안그랬잖아... 심지어 useRef보다도 늦게 나오고, 심심지어 둘 다 리액트 밖으로 나가고 싶을 때 이런 탭에 있다니! 의역이다. 원문은 Escape Hatches. 차근차근 Effect가 뭔지 다

가 필요한 조건다대다인 경우단순히 id만 가지고 있는 게 아니라 새로운 속성이 만들어져야 함다른 relationship에 참여할 필요가 있을 때. = 독립적으로 또다른 entity와 relationship으로 참여할 필요가 있을 때.Prerequisite 선수과목을 속

dd

컴포넌트가 어떤 정보를 "기억" 하게 하고 싶지만, 리렌더링은 안했으면 좋겠을 때 - 그 때 ref 를 쓰자. > ## 이 문서에서는.. 컴포넌트에 ref 더하기 ref 값 업데이트하기 ref vs state ref 안전하게 쓰는 법 을 배워보자. 컴포넌트에 ref

reducer : state 업데이트 로직을 통합 context : 깊은 하위 컴포넌트에 정보 넘겨줌 둘을 같이 쓰면 무적의 state 관리자가 되겠지요? > ### 이 문서에서는 reducer와 context 같이 쓰기 props로 state 넘기고 dispatc

중간고사에 레거시 파일시스템의 문제점 5가지가 나올 거시다~ Advantages of the Database Approach Program - data independence data descriptions are stored in a central loc

보통 부모에서 자식 컴포넌트로 정보를 넘겨줄 때는 prop을 사용한다. 그러나 props는 때로 귀찮아진다. 부모 - 자식 컴포넌트 사이에 3개 - 4개 컴포넌트가 끼어 있는 경우 (고조할아버지 컴포넌트 ?), 같은 정보를 아주 많은 컴포넌트가 공유하고 있어야 할 경우

너무 많은 이벤트 핸들러들과 너무 많은 State updater 함수가 있는 컴포넌트는 복잡해지기 쉽상이다. 이럴 때 모든 state upater 로직을 컴포넌트 밖에 있는 reducer라는 단 하나의 함수에 때려박을 수 있다! > ### 이 문서에서는 reducer

네임스페이스 <- 헷갈리지 말라고메인 함수variables : memory location to store data for a program. must be declared before being used.c++ identifiers : caseSensitive.

State는 컴포넌트에 고립돼 있다. 리액트는 UI 트리에서 컴포넌트의 위치를 기반으로 어떤 state가 어떤 컴포넌트에 소속돼 있는 녀석인지를 계속 추적한다. 개발자는 리렌더링 사이에서 언제 state를 보존할지, 리셋할지 컨트롤할 수 있다. > ### 이 문서에서

State는 모든 종류의 JS 값을 담을 수 있다. 당연히 객체 포함! 그러나 state에서 직접적으로 객체를 바꾸면 안된다. 그렇게 하지 말고, 새로운 객체를 만들어서 (아니면 기존 객체를 copy) 그 사본으로 state를 설정해라! > ### 이 문서에서는..

배치로 상태 업데이트하기 > 복습 : 각 렌더링의 state 값은 고정이다. > 버튼 누르면 setState() 세번 실행해도 → 0 에서 1로 바뀐다. > 사실상 이것과 같다 : 한가지 더 : 리액트는 이벤트 핸들러 안에 있는 모든 코드가 실행되길 기다린다

새로운 리액트 공식문서 beta - State as a Snapshot > 기존 공식문서 바탕으로 리액트를 정리하다 보니, 함수형 + hooks 패러다임에서 확 와닿지 않게 돼 있는 경우가 많았다. > 그 중에서도 가장 눈에 걸리는 부분이 바로 state 였는데, 새

선 결론 : 언제나 합성 승리 > * 합성 Composition * : 여러 컴포넌트를 합쳐서 하나의 큰 컴포넌트 만들기. props와 state, hooks의 환상적인 협동 액션이 합성을 받쳐준다. 컴포넌트 간 코드 재사용에도 유리. > * 상속 Inheritanc

이 문서가 바로 블로그 개설 계기. ? 리액트를 공부한다면 반드시 알아야 할 개념이고, 말로 설명을 들으면 "음~ 그렇지" 라고 하지만, 정작 "상태 끌어올리기를 설명해주세요" 라고 하면 말문이 막힌다. > 꺼진 공식문서도 다시 보고, 기본 개념을 더 정확히, 자세히

기존 HTML 에서는... Name: 그냥 인풋창이다. 문제는 안에 타이핑을 해도 리액트가 그 값을 실시간으로 알지는 못하고, submit 인풋을 눌렀을 때 자동으로 이벤트가 생기고 새로고침된다는 것이다. 리액트가 지향하는 Client Side Render

array 타입의 메서드이다. someArray.map()인자로 어떤 함수를 넣어준다. 새로운 array 안에 어떤 함수를 통과한 결과를 리턴해줌. someArray.filter() 인자로 test 함수를 넣어준다. 새로운 array 안에 test 함수 통과한 값이 t