React

https://ko.reactjs.org/ 리액트 공홈사용자 인터페이스(UI)를 구축하기 위해 되게 선언적이고 효율적으로 만들어진 자바스크립트 라이브러리 입니다.하나의 페이지에서 동적으로 변하면서 많은 기능들은 가능케 한다.홈페이지 따로, 로그인 페이지 따로

예를 들어서 버튼을 하나 누르면 누를 수만큼 수가 올라가는 것을 구현 해보자 한다.하지만 눌러도 카운트는 되지 않고 , 아무런 작동조차 하지 않는다.흔히 함수 컴포넌트는 그냥 함수 그자체일 뿐이기 때문이다.함수 컴포넌트에서 내부적으로 상태를 관리를 해야하는 일이 필요하

글 작성에 앞서서 리액트 공식문서를 기반으로 공부했습니다..https://ko.reactjs.org/docs/rendering-elements.html리액트앱에서 가장 작은 단위.화면에 표시할 내용을 기술하는 역할일반적인 브라우저 DOM 엘리먼트가 있듯이 리액

여러개의 프리뷰카드가 아니 여러개의 컴포넌트를 렌더링을 해야할때는 이렇게 반복적으로 적어도 좋다. 하지만 이러면 되게 보기도 별로고 가독성도 떨어지는거 같다 그래서 Array.prototype.map을 활용해서 렌더를을 해볼것이다.위 같은 방식으로 map을 활용해서 코

이 글은 리액트 공식 문서에서 공부하면서 제가 이해한 대로 글을 적은겁니다.리액트 공식 홈페이지React는 props라는 걸로 부모가 자식 컴퍼넌트에 전달을 하는 과정을 가지지만이게 한두개 컴퍼넌트가 적을때는 괜찮다 쳐도,여러 컴퍼넌트를 거치면 과정이 복장하고 번거러

리액트 수업을 받는 도중 yarn start로 리액트 앱을 실행하는데sh: react-scripts: command not found이러한 메세지가 뜬다.관련 내용을 구글링 하여 찾아보니 Package.json에서 script부분이 읽히지 않았거나 npm 인스톨이 다운

처음에 웹 서버에 요청할 때 데이터가 없는 빈 HTML을 받아옵니다.HTML과 CSS 파일들을 요청하고 로드되면 화면에 그려지게 됩니다.Javascript를 동적 렌더링을 하게 됩니다.장점 : 유저가 url을 이동해도 서버에서새로운 Html을 내려받지 않고 클라이언트에

useState와 같은 상태관리를 해주는 메서드라고 생각하면 된다.공식 사이트에선 대타로 사용할수 있는 메서드라고 한다.기본적인 구조함수형으로 작성을 했을때 state와 action을 인자로 받는다.action은 dispatch에서 넘겨준 인자가 들어오게 된다. 여기서

프로젝트 하면서 정말 몇번이나 나를 헷갈리게 했던... 물론 정신이 멀쩡할때 이해가 안된거긴 하지만 이럴때도 props의 내용을 다시 곱씹어 보기로 했다.상위 컴포넌트에서 하위컴포넌트로 정보를 넘기는 방법이런식으로 넘겨줄수가 있다. name을 props로 받게된다.이런

리액트용 애니메이션 라이브러리로 다양한 애니메이션들을 작용할수 있게 도와주는 라이브러리다.$ npm i framer-motion이런 식으로 임포트를 해주면 끝이다.공부를 하면서 작성한 코드이다.

서버사이드 렌더링의 약자이며 말그대로 서버에서 렌더링을 하는것이다.서버에서 완전하게 만들어진 Html파일을 받아와서 전체 페이지를 렌더링하는 것이다.초기 로딩 속도가 빠릅니다. 서버에서 HTML을 생성하고 전송하기 때문에 클라이언트에서 추가적인 작업이 필요하지 않습니다