반응형 웹개발80 React의 주요 개념과 사용법 이번 주는 React에 대해서 공부했다. 정말 처음 시작이 너무 어려웠지만 며칠 동안 고생한 덕에 이제 조금은 이해가 간다. 오늘은 정리 및 복습을 위해 블로깅을 해볼까 한다. 왜 리액트(React)가 등장했는가? 웹 사이트가 점점 커지면서 사용자와 인터렉션이 많아져 관리해야 할 DOM 역시 많아지게 되었다. 이러한 상태 관리를 최소화하면서 기능 개발에만 충실하기 위해서 리액트가 고안되기 시작하였고 지금의 리액트 라이브러리가 등장하게 되었다. 그럼 리액트는 무엇인가? React란 Component라는 개념에 집중하고 있는 JavaScript 프론트앤드 라이브러리이다. 여기서 Component란 기능 개발을 중심으로 사용하기 위해 나온 하나의 의미(기능)을 가진 독립적인 단위 모듈이다. Component를.. 2020. 11. 27. [2020.11.22] 11월 셋째주 회고록 이번 한 주는 서버와 리액트에 대해서 공부했다. 조금 고생한 한 주 이긴 했지만 저번 주에 비해 공부량이 훨씬 늘어나 뿌듯하기도 했다. 또한 그동안 밀렸던 블로깅도 대부분 완료해서 뿌듯한 한 주가 되었다. 리액트는 저번에 조금 해봐서 어느정도 내가 알고 있다고 생각하고 괜찮겠다 싶었는데 전혀 아니었다. 예전에 좀 잘못 배웠다는 것을 깨달았다. 이번에 공부하면서 다시 개념을 잡고 이해하고 클론 코딩을 진행해보니 확실히 달랐다. 그리고 서버 개발 공부도 조금 진행했는데 원하는 url로 요청을 보내고 요청에 맞게 응답을 내보내 주는 것을 배웠다. 순수 node.js로 제작하다가 미들웨어를 적용시켜서 express.js도 이용해보고 body-parser와 cors를 이용해 좀 더 손쉬운 방법으로 제작도 해보았다.. 2020. 11. 22. CommonJS 오늘은 CommonJS에 대해서 공부했다. JavaScript의 모듈화를 위해 CommonJS를 사용해야 하는데 CommonJS에 대해서 간단하게 알아보고자 한다. CommonJS의 특징 스코프(Scope): 모든 모듈은 자신만의 독립적인 실행 영역이 있어야 한다. 정의(Definition): 모듈 정의는 전역 객체인 exports 객체를 이용한다. 사용(Usage): 모듈 사용은 require 함수를 이용한다. // foo.js exports.foo = () => { console.log('foo') }; // bar.js exports.bar = () => { console.log('bar') }; // foobar.js exports.foobar = () => { console.log('foobar.. 2020. 11. 22. Express.js와 Middleware 오늘은 Express.js와 Middlewara에 대해서 공부했다. Express.js는 Node.js 환경에서 웹 어플리케이션 혹은 API를 제작하기 위해 사용되는 인기있는 프레임워크이다. express framework 는 npm을 통해 다운로드할 수 있다. express가 기존 http 모듈로 작성했던 서버와 갖는 큰 차이점은, 다음과 같다. 미들웨어를 붙이기 쉽다. 자체 라우터를 제공한다. 어떠한 라이브러리 없이 순수 node.js 코드로 API를 만든다면 코드는 다음과 같다. const requestHandler = (req, res) => { if(req.url === '/messages') { if (req.method === 'GET') { res.end(messages) } else if.. 2020. 11. 22. 이전 1 ··· 5 6 7 8 9 10 11 ··· 20 다음 반응형