react는 npm으로 설치된다. npm(node package manager)이니 node.js가 필요하다. node.js는 js(브라우저,인터프리터 언어)를 서버(터미널환경)에서 사용할 수 있게한 프로그램. node.js, npm이 설치하고 정살적으로 됬을
하나의 페이지에서 동적으로 변하면서 많은 기능들은 가능케 한다.홈페이지 따로, 로그인 페이지 따로 이런식이 아니라 하나의 페이지에서 변하며 기능들을 구현하게 하는것어떤 UI 한단위들을 COMPONENT화 하여 필요한 곳들마다 사용할 수 있게 해준다.이는 복잡해져가는 웹
코딩에서 자주 강조하던 코드의 유지보수, 그리고 재사용성을 위한 리액트의 가장 기본UI를 이루는 한 단위의 그룹들이라고 생각할 수 있음.기존 class나 function들로 하는 것과 유사함.리액트 컴포넌트는 딱 함수만 나눈다기보다는 보여지는 기능들을 단위로 쪼갰다고
commentList, commentInput라고 컴포넌트를 만들었다. commentList의 역할을 받아온 데이터를 보여줄 output 공간이다. commentInput의 역할은 데이터를 input받을 공간이다.여기서 props는 컴포넌트 옆에 달린 것들이다. 우선
리액트는 state의 변화가 일어날때 render가 일어난다. render가 일어난다는것? 화면의 보이는 것이 변한다는 것이다. 그리고 그건 웹브라우저가 일을 한다는 것이다.요즘 웹페이지에서는 한부분이 변한다고 해서 모든 페이지가 리로딩되거나 리다이렉트 되지 않는다.s
하이퍼텍스트(HTML) 문서를 교환하기 위해 만들어진 protocol(통신 규약).즉 웹상에서 네트워크로 서버끼리 통신을 할때 어떠한 형식으로 서로 통신 규약프론트앤드와 백엔드간에의 통신에서도 사용된다.Stateless 란 말그대로 state(상태)를 저장하지 않는 다
쉽게말해서 차이점은 간결하다는 것이다. 당연히 함수형이 클래스형보다 간결하니까.또한 당연히 하는 일은 하는일은 같다.그러면 무조건 함수형을 써야되냐? 아니면 클래스형을 써야되냐? 우선 기본기를 다지기 위해 클래스형을 공부하고 나중에는 함수형도 빠르게 쓰면 될것으로 생각
리액트의 기본 모드는 cra에서는 기본적으로 페이지를 이동하는 routing을 위한 로직이 없다.그래서 추가적으로 react-router 를 설치하여 페이지 이동을 하였다.!! 이런것만 봐도 리액트가 자유도가 높다는 말을 알 수 있다. 기본 route를 위한 것도 추
먼저 원하는 폰트를 다운받아야 한다. 웹에서 사용중인 것을 다운받고 싶을 땐 해당 웹페이지에서개발자도구로 들어가서 네트워크탭에서 새로고침 후 나오는 font탭을 보면 알 수 있다.src\\styles\\fonts\\에 해당 woff 나 woff2 파일을 집어넣는다.
리스트페이지가 있다고 할때 리스트의 하나를 그려주는 자식요소 component그리고 그 자식요소를 반복적으로 뿌려줄 list component로 구성했다.comment.js에서는 가장 기본단위로 한개의 댓글을 그려준다.comementList.js에서는 댓글 data(j
get요청을 해서 백엔더 api에서 데이터를 받듯이 내 로컬 목데이터 저장주소로 데이터를 요청하고 받는것이다.이것은 local 또한 하나의 서버로 하여 보내고 받는 것이다.