개발/React 스터디 (5) 썸네일형 리스트형 리액트 5주차 보호되어 있는 글입니다. 리액트 4주차 6-8 React에서 API호출 JSONplaceholder 서비스 이용 Resources 에 가서 comment를 사용할 것임. const initData = res.slice(0, 20).map((it) => { return { author: it.email, content: it.body, emotion: Math.floor(Math.random() * 5) + 1, created_date: new Date().getTime() + 1, id: dataId.current++ }; }); setData(initData); }; Math.random은 정수가 반환되지 않음 그러므로 정수로 바꿔주는 math.floor 를 사용해줌 created_date는 현재시간으로 생성 ... 완성된 init데이터를 .. 리액트 3주차 6-2 React에서 DOM조작하기 handle submit 기능을 수정 console.log(state) ---> if(state.author.length 리액트 2주차 5-3 JSX 자바스크립트와 리액트를 혼용해서 사용할 수 있는..! jsx는 component하는데 필요! 화면에 컴포넌트를 구현하기 위해서는 App이라는 부모페이지에 child 페이지를 포함하고 있어야한다. 안녕리액트{name} jsx의 간단한 문법들 -닫힌규칙 가 있으면 처럼 닫힌 태그가 있어야만 한다 특힌 처럼 html에서는 닫힌태그를 쓰지 않았던 것들은 주의해야한다 -최상위규칙 다른태그들을 감싸고 있는 가장 바깥쪽 태그가 최상위 태그(부모)이며 이게 없어지면 오류가 발생한다 만약 최상위태그를 사용하고 싶지 않으면 react.fragment를 사용하면 된다. import React from "react"는 필수 -jsx에서는 class 대신 classname import React from "rea.. 리액트 1주차 4-1 자바스크립트 코드는 브라우저 내장 자바스크립트 엔진을 이용하여 실행 ex) safari, firefox, chrome, edge, opera 기존의 자바스크립트는 html기반으로만 동작을 하다보니 웹사이트의 interaction을 수행하는 기능밖에 하지 못했음 but, v8을 브라우저에서 분리하여 자바스크립트를 어디에서든 사용할 수 있게 만들었음 그것이 바로 node.js node.js가 생김으로써 javascript로 web server로 개발 가능 웹서버란 웹을 반환받으면 웹서버 미디어를 반환받으면 미디어 서버 채팅을 반화받으면 채팅서버 노드와 리액트와의 관계 리액트는 브라우저에서 동작하는 복잡하고 여러가지 기능을 가진 자바스크립트 파일을 만들어내는 기능 노드를 기반으로 기능하기 때문에 노드없.. 이전 1 다음
