👩‍💻 REACT

프레임워크는 뼈대나 기반구조를 뜻하고 제어의 역전 개념이 적용된 대표적인 기술이다. 소프트웨어에서의 프레임워크는 소프트웨어의 특정 문제를 해결하기 위해 상호협력하는 클래스와 인터페이스의 집합이라 할 수 있으며 완성된 어플리케이션이 아닌 프로그래머가 완성시키는 작업을 해

리액트는 페이스북에서 개발하고 관리하는 UI를 만들기 위한 js 라이브러리이다. 리액트를 사용하는 가장 큰 이유 중 하나는 UI를 자동으로 업데이트 해준다는 점이다. 이로 인해 선언적개발이 가능해지고 자동으로 UI를 업데이트하는 과정에서 Virtual DOM(가상돔)을

사용자가 요청한 url에따라 해당 url에 맞는 페이지를 보여주는 것이다. 리액트는 라이브러리이기에 UI를 그리는 기능만 있어서 react-router를 설치해서 routing 기능을 사용한다.Router.js로 프로젝트 내에 컴포넌트들에 대한 경로를 관리한다. 사용자

UI구성에 필요하지만 동적으로 변하지 않아서 백엔드 API등 을 통해 가져올 필요가 없는 데이터들이다. 이런 데이터들은 상수 데이터로 만들어 UI를 구성할 수 있다. 즉 상수 데이터란 정적인 데이터를 의미한다.첫번째로는 하드코딩으로 만들게 되면 코드가 길어져 가독성에

위 코드와 같이 Route를 설정하게 되면 /detail/ 뒤에 어떤 글자가 와도 모두 상세페이지 컴포넌트를 보여준다.:기호 뒤에 붙는 id와 같은 문자열을 path parameter라고 부른다.useParams hook은 path parameter의 값을 가져올 수

쿼리스트링은 url의 한 부분으로서 요청하고자하는 url에 부가적인 정보를 포함하고 싶을 때 사용한다.예를들면 상품리스트를 최신순 / 인기순 등으로 보여달라는 구체적인 요청을 할 때 필요로 한다.(쿼리스트링의 형태)쿼리스트링은 key=value형태로 표현되고 시작점은

✅ useMemo 👉 Memoization Memoization이란 기존에 수행한 연산의 결과 값을 어딘가에 저장해두고 동일한 입력이 들어오면 재활용하는 프로그래밍 기법이다. 적절하게 활용하면 중복연산을 피할 수 있기때문에 애플리케이션의 성능을 최적화 할 수 있다.

상태를 관리할 때 사용하는 hook 함수로, useReducer를 사용하면 컴포넌트의 상태 업데이트 로직을 컴포넌트에서 분리시킬 수 있다.상태 업데이트 로직을 컴포넌트 바깥에서 작성할 수도 있고, 심지어 다른 파일에 작성 후 불러 와서 사용할 수도 있다.본격적으로 us

React Hook Form 은 리액트에서 form을 쉽게 만들기위한 라이브러리로 성능이 좋고 유효성 검사에 아주 탁월하다.장점으로는 아래 항목들이 있다.적은 코드로 더 좋은 퍼포먼스를 낼 수 있다.다른 라이브러리 혹은 React에 비해 Re-render 수가 적다.F

오늘은 구글로그인데 대해 적어보려고 한당...2차 프로젝트에서 시도했던 구글로그인 결국 실패하고 협업나와서 다시 만났다 ( 어 안녕 ) 😡역시나 이틀 고뇌하다가 결국 대표님 찬스 😅 변명을 해본다면 타입스크립트로 처음이었고 공식문서는 이해가 안갔었고.. 블로그에는