728x90 리액트15 리액트 프로젝트 시작하기 리액트 공부와 함께 기존의 vue.js로 진행했던 프로젝트들을 리액트에서 정리해볼 겸 프로젝트를 시작하려고 한다. 지금 진행하는 프로젝트는 nuxt로 ssr을 사용하고 있지만 아직은 리액트의 전체적인 흐름을 모르기때문에 시기상조라고 생각한다. 리액트에서도 배우고 있는 사람들에게 추천하는 spa 로 먼저 진행해보려고한다. gatsby는 정~~말 예전에 사용해봤는데 포트폴리오 사이트 만들기에 정말 적합하다고 생각한다. 리액트에서 추천하는 방식을 참고해주세요 npx create-react-app side-project-react cd side-project-react npm start Ok to proceed 계속 진행하시겠습니까? yes install 이 완료 되면 프로젝트 폴더로 이동해서 npx start.. 2022. 10. 9. 리액트 배열 추가, 삭제, 수정 배열 값을 업데이트를 해야하는 경우에도 객체와 동일하게 불변성을 지키야한다. push, splice, sort 와 같이 배열을 직접적으로 제어 할 수 있는 함수를 쓰면 안된다! 상태관리를 위해 동일하게 useState 를 사용하면 된다. const [users, setUsers] = useState([ 생략 ]) Vue로 작업을 진행할때는 deep clone을 하지 않는다면 서로 값을 계속 공유하는 현상이 일어나는 반면 리액트는 이를 제어 할 수 있는 점이 상당히 편리한 점이 될 것 같다. ( 뭐 좀 더 써봐야 알겟지만…! ) 배열 추가 새로운 배열 원소를 생성 useState로 기존 배열을 복사한 후 생성한 배열 원소를 추가한다. spread concat const onCreate = () =>{ //.. 2022. 10. 5. 리액트 입문 강의 정리 프론트엔드 이직시에 리액트 과제가 정말 압도적으로 많다. 그냥 여지것 본 모든 것들은 다 리액트였던 것 같다.. 그러므로 나도 뛰어든다 리액트! 아주 예전에 리액트 강의를 사둔 것이 있기에 해당 강의를 보고 정리하려고한다. 최종으로는 지금 vue.js로 구현한 것과 동일하게 구현할 예정이다. 과연 얼마나 걸릴지.. 리액트는 vue.js와 다르게 library이기 때문에 script 상단에 import React from 'react';를 꼭 해주어야한다 컴포넌트간 데이터 전달vue.js와 동일한 props을 사용하지만 사용법이 약간 다르다. 이때 props은 객체로 넘어 온다. react는 함수형으로 컴포넌트를 구성하므로 전달할 props을 매개변수로 받을 수 있다. props를 사용하여 전달 //---.. 2022. 9. 28. 이전 1 2 3 다음 728x90 반응형
