React

A JavaScript library created by Facebook for building user interfacesdeclarative, efficient, and flexible JavaScript library for building user interfa

일주일이 빠르게 흘러 벌써 토요일이 되었다.React는 재미있다라고 스스로 최면을 걸며 개인 과제인 todo-list를 만드는 중이다. (정말 리엑트는 재밌다!)이처럼 components를 조립(?)하였다.화면까지는 끝냈는데 state와 props가 아직 좀 햇갈린다.

부모에서 자식으로 전달\-> props를 이용한다.App.jsxChild.jsxResult자식에서 부모로 전달\-> 함수를 이용한다.자식은 props를 사용해서 부모에게 데이터를 건네줄 수 없다.따라서 부모 컴포넌트에서 함수를 정의하고 이 함수를 자식 컴포넌트에 pro

이전 포스팅 \[React] todo-list (day13)에 이어드디어 Todo List를 완성하게 되었다.첫 리엑트 프로젝트이기 때문에 처음에 많이 헤맸지만 여러 블로그참고 및 React기술매니져님께 질문을 통해 방법을 찾으며 점점 틀을 잡아갈 수 있었다.위의 사진

Hook은 React 버전 16.8부터 React 요소로 새로 추가되었다. Hook을 이용하여 기존 Class 바탕의 코드를 작성할 필요 없이 상태 값과 여러 React의 기능을 사용할 수 있다.Hook은 함수 컴포넌트에서 React state와 생명주기 기능(life

은(컴포넌트의 생명주기) 컴포넌트가 렌더링을 준비하는 순간부터, 페이지에서 사라질 때까지를 뜻한다.컴포넌트는 생성되고 -> 수정(업데이트)되고 -> 사라진다.생성은 처음으로 컴포넌트를 불러오는 단계이다.수정(업데이트)는 사용자의 행동(클릭, 데이터 입력 등)으로 데이터

이전에 만들어 본 Todo List를 복습하고자 조금 더 많은 input들을 첨가하고 응용해 새로운 리엑트 프로젝트를 만들어 보았다.Form 컴포넌트의 input란에 축구선수를 입력하면 포지션별로 나눠 Lists 컴포넌트에 출력해준다.또한 포지션별로 배치된 선수의 수를