User Interface를 만들기 위한 Library페이스북에서 나온 자바스크립트 라이브러리 중 하나로 2013년도에 세상에 나온 후에 지속적인 사랑을 받고있다! 페이스북, 에어비앤비, 우버, 넷플릭스, 인스타그램도 대체적인 웹 어플리케이션도 React로 만들어졌다!
state의 개념과 props의 개념과 사용 목적을 확실히 말할 수 있을정도로 개념을 알고 있자! 1. State >컴포넌트 내부에서 가지고 있는 컴포넌트의 상태값으로, 화면에 보여줄 컴포넌트의 UI 정보(상태)의 데이터를 보관하고 있는 객체 state는 컴포넌
map 메소드를 사용하여 `` 엘리먼트 안에 요소를 하나씩 반환하고 결과를 저장하는 코드를 작성하였다. 예시 부모 컴포넌트의 일부 자식 컴포넌트의 일부 코드를 실행하면, 이와 같이 li의 각 항목에 key를 넣어야 한다는 경고가 표시된다. >key는 리스트를 만
프론트와 백엔드의 처음 통신이후 더 구체적으로 구현해보고 싶다는 마음이 들었다! 회원가입부터 댓글달기 기능까지 인증 인가에 대한 개념을 적용해보며 서버에 데이터가 저장되고, 다시 프론트가 받아오는 것들을 배웠다. 회원가입 : 회원가입 API로 프론트에서 입력된 acc
인스타그램 클론 코딩의 댓글 추가기능을 구현 중 나는 push 메소드를 사용하였고 같은 팀원인 주영님은 concat을 사용한 것을 볼 수 있었다.이것에 대한 정보를 찾아보다가 React의 불변성이라는 중요한 개념을 알았기에, 정리해보고자 한다.두 메소드의 같은 점은 배
arr.filter 조건을 만족한 값을 새로운 배열로 리턴한다. callback 함수를 호출하여
요새 리액트적으로 사고하기 공식문서를 읽으며 자꾸 리액트화하려고 노력중...자바스크립트에서도 비동기적 특성을 배웠는데, 리액트에서도 setState의 개념에 있어 비동기적 특성을 알아보았다.state를 업데이트 하려면 setState 함수를 사용해야 하는데, setSt
동적 라우팅 라우트 경로에 특정 값을 넣어 해당하는 페이지로 이동할 수 있게 하는 것을 동적 라우팅이라 한다. 동적 라우팅 router 가 제공하는 세 가지의 객체 중 history, location 는 공백 클론 프로젝트 TIL을 통해 정리해보았다. 마지막으로 상
ES6문법에 추가된 새로운 개념, 다시 한 번 정리해보는 구조분해할당 Destructuring Assignment 객체와 배열 모두 쓸 수 있다 const { name, level } = student; const [first, second] = animals;
다시 기존의 배열의 값은 건드리지 않으면서 새로운 배열의 값을 추가적으로 넣는 연산자이다. spread 연산자는 컴마를 기준으로 앞 뒤로 위치를 변경해주면 순서대로 입력값이 들어간다. React는 독특하게 업데이트라는 개념을 가지고 있다. 즉 기존의 값을 가져온 다