일단 시작해보는 블로그

Create-React-App Facebook에서 제공하는 React 프로젝트의 개발 환경 Initializer 입니다. 기본적인 개발 환경이 다 구축되어있고 그 위에서 개발을 위한 코드 수정만 하면 됩니다. 개발에만 집중할 수 있도록 하는 아주 좋은 오픈소스입니다. 또한, 잘 구축된 개발환경이기 때문에 React에 대하여 공부하는 용도로 사용되어도 좋을 것 같습니다. 따라서 Create-React-App 으로 만들어진 프로젝트로 React의 구조 및 작동 원리를 알아보겠습니다. Create-React-App의 공식 페이지 Create-React-App을 홈페이지를 참조하여 만들면 다음과 같은 폴더구조를 갖는 리엑트 프로젝트가 생기게 됩니다. my-app ├── README.md ├── node_modu..

React 란? 프론트엔드 프레임워크/라이브러리로, 웹 개발을 하게 될 때, 귀찮은 DOM 관리와 상태값 업데이트 관리를 최소화 하고, 오직 기능 개발 그리고 사용자 인터페이스를 구현하는 것에 집중할 수 있도록 하기 위해서 사용됩니다. 알려진 React의 장점은 다음과 같습니다. component 기반의 개발방식 Virtual DOM 을 통한 성능 이점 서버와 클라이언트가 같은 코드로 렌더링하는 유니버설 렌더링(universal rendering) 사용 가능 1. component 기반 개발 방식 React를 배우려고 하시는 분들은 대부분 html/css/js 로 뭔가 만들어 보신 경험이 있을 것입니다. 저의 경우 html/css/js 는 진입장벽이 낮았던 이유로 쉽게 입문하게 되었었지만, 졸작 프로젝트..

React를 처음 접하게 된 계기는 급하게 혼자서 공부한 후 프로젝트를 진행하는 것이었다. 일단 `프로젝트 완수` 가 목표였기 때문에 "돌아가게만 만들자" 라는 목표를 두고 진행을 했었다. 리액트의 관련한 코드를 많이 읽어보고, redux 공부도 해보고 한 현재로서, 이때의 코드들을 보면 정말(..ㅎㅎ.. )얼른 고치고 싶은 마음이 든다. 그래서 Code refactoring을 결정했고 더 나아가 깊이 있는 react, javascript 공부를 병행하며 하기로 결심했다. 방향 공부 내용을 정리 프로젝트에 적용된 코드가 어떻게 돌아가는지 자세히 설명 적용 react : 기존의 프로젝트의 구조 및 코드 개선 react+redux : redux 적용한 구조 및 코드 개선