프로젝트 & 강의6 Next js (1) 기초지식 서론 SSR을 사용하기 위해서 왜 사용해야 하고 그럼 현재 우리 서비스는 어떻게 구성되어 있는지 알아가는게 중요하다고 생각해서 정리 시작 본론 개념 정리 csr ssr 웹서버 CloudFront CDN CSR client side rendering 프론트 서버에서 한번에 번들되어 있는 js 파일을 다운받아서 진행된다. 해당 js는 브라우저에서 돌아가서 화면에 보여준다. 다운로드 때문에 SSR에 비해 초기 진입속도가 느리다 ⇒ code splitting 으로 해결 가능 SSR server side rendering 서버에서 데이터까지 모두 포함하여 페이지를 구성한 후 브라우저에 전달 SSR의 단점 : 불필요한 부분까지 렌더링이 된다. CSR의 단점 : 초기 진입 속도가 느리다. SEO에 취약하다. 브라우저.. 2021. 12. 10. react 웹앱 서비스 개발 1. 서론 웹앱 기반인 서비스를 하나 만들 생각이다. react-native 기반의 앱과 안에서 웹으로 돌아가는 형식으로 개발할 생각이다. 둘다 react 기반으로 작동하다 보니, state 관리 및 라이브러를 어떤걸 쓸지 왜 쓸지 고민하게 되면서 적게 되었다. 2. 본론 앱은 간단하게 navigation tab 으로만 이동할 생각이라 간단한 state 관리가 필요할것 같아서 요즘 코드 및 관리 포인트가 적은 react-query, swr 사용해 볼까 고민중이다. 웹은 테스트 및 미들웨어 장점을 많이 사용하기 위해서 redux, saga 등 또는 graphql를 사용해서 좀 더 관리에 용의한 웹 사이트를 개발해 볼 생각이다. 3. 개념 정리 react-query vs SWR redux vs Graphql 2021. 12. 8. react(2) middleWare Redux ( 공식문서 ) ko.redux.js.org/advanced/middleware 미들웨어 | Redux 심화 강좌 > 미들웨어: How middleware enable adding additional capabilities to the Redux store ko.redux.js.org reducer가 순수함수 이어야 하는 이유는 reducer 자체가 동기 함수이기 때문에 순수 함수여야 한다. 순수 함수: 외부와 아무런 dependency 없이, 그리고 side effect 없이 동작하는 함수, 인풋이 똑같으면 아웃풋이 동일하다. 순수 하지 않는 함수: 실행 될때 마다 결과가 일정하지 않은 작업 ( 비동기 ) const api= (url, db) =>{ setTimeout((.. 2020. 11. 20. react (1) React + TypeScript 강의 도구를 사용하게 되면 도구 사용법에만 집중하게 되면 마법처럼 느껴질때가 많다. 그 안에 있는 숨은 논리나 원리를 알면 복잡한 새로운 도구가 나와도 어떻게 개발 되었구나라는 걸 짐작할수 있는데, 도구 사용에만 급급하다. 방법) 초기 깃헙을 보면서 공부하면 좋다. 이 강의의 목적: 원리, 숨은 논리 알려주는 것 서양에서 만들어 진것이기 때문에 철학을 이해 하는게 중요, 여기서 이야기하는 철학이란 그들의 논리 세계를 이해 하면 어떤 큰 도구더라도 그 밑 바닥에는 논리세계가 쌓여 있다. 왜 이게 필요하게 되었는지 이해하고 공부하는게 중요하다. 예) 왜 react를 만들었을까? 왜 redux가 있을까? 등... React 개념 - JSX를 통해서 만든 VDOM은 이전 VDO.. 2020. 11. 16. 이전 1 2 다음
