전체 글 (47) 썸네일형 리스트형 #7 React 졸업하기(A to Z) 0. React 짱짱맨 React는 페이스북(facebook)에서 제공하는 프런트엔드 라이브러리이다. JSX가 기본이 되며, 컴포넌트 기반의 개발을 도와준다. 사실 React가 없 더라도 우리는 HTML, CSS, JS등 이미 잘 알려진 도구를 활용해 웹페이지를 만들 수 있다. 하지만 사람들이 왜 그토록 React에 열광하는 것일까? 그 이유는 React의 특징과 이것이 없을 때와 있을 때 편의성을 비교해보면 쉽게 알아차릴 수 있다. React는 앞서 말했듯이 컴포넌트라는 것을 이용해 UI를 만들어 나간다. UI가 큰 덩어리 라고 가정하면, 컴포넌트는 이 큰 덩어리를 이루고 있는 작은 덩어리들이라고 생각하면 쉬울 것 같다. 즉, 우리가 웹 사이트를 볼 때 만약 그것이 React로 짜여있다면 내비게이션 바.. 10] React Update & Delete 1. update 구현 update의 기능은 read+create기능이다. update는 기존의 컨텐츠를 불러와서 내용을 추가해주는 과정이기 때문이다. 먼저 form 기능이 구현되어있는 CreateContent컴포넌트를 복사하여 외부파일로 만들어주고, UpdateContent로 이름지어준다. 다음으로 App.js에서 mode가 update로 바뀌면 Update컴포넌트로 바꾸어주기 위해 Create때와 똑같이 조건문을 추가하여 컴포넌트를 생성해준다. 바뀌는 컴포넌트를 생성해주는 부분을 잘라 함수로 만들어, 밖으로 빼준다. getContent()안에 내용들을 render밖으로 빼내, return _article을 해준다. 컴포넌트가 들어가는 부분이었던 {_article}을 {this.getContent()}.. 9] React Create 0. props vs state 쉽게 말해서 props는 해당 컴포넌트 내에서 바꿀 수 없으며, state는 바꿀 수 있다. 또한, state는 내부적으로 쓴다. 외부에서는 props를 통해 컴포넌트를 만진다. 이 모든 것은 DOM에 영향을 주어 UI에 변화를 준다. 결론은...props와 state를 적절하게 이용해야 한다는 의미이다. 지금까지는 read가 되는 페이지를 만들었는데, 이제 write를 통해 동적으로 페이지를 유저가 바꾸는 앱을 만들어보자!! 두둥!! 1. create 구현 : 소개 모든 정보는 CRUD 안에 있다고 한다. Create, Read, Update, Delete를 의미하는데, 우리는 이미 read를 해보았다. create, update, delete라는 버튼을 추가할 것이다... 이전 1 2 3 4 5 6 ··· 16 다음
