728x90 Front-end/React13 [ React ] SSR ( 서버사이드렌더링 ) & CSR ( 클라이언트사이드렌더링 ) SSR과 CSR에 대한 개념과 React에서 어떻게 SSR 환경을 구축하고 사용할 수 있을지 궁금해서 오랜만에 포스팅 해보려고 한다. SSR 이란 ? SSR은 Server Side Rendering 약자로 처음 클라이언트가 접속했을때 브라우저에서 자바스크립트 코드를 다운 받아 해석 할 때 까지 기다리지 않고 서버에 보여질 HTML을 미리 준비해 클라이언트한테 응답해주는 방식이다. 사용자가 웹 페이지에 접속했을 때 서버에서는 사용자에게 렌더링될 HTML 파일을 응답하여 사용자에게 웹 페이지가 바로 렌더링 될 수 있도록 해준다. 그 후 브라우저는 자바스크립트 파일을 다운받아 해석하고 실행하는 절차를 가진다. --> 사용자는 브라우저가 자바스크립트 파일을 해석하고 보여질때까지 기다리지 않고 바로 렌더링 하기 .. 2020. 5. 13. [ React ] npm start , webpack 에러 create-react-app 으로 React 프로젝트를 만들어 진행중이었다 컴퓨터를 잠깐 재부팅 후 다시 React를 시작하려고 npm start 로 띄우는데 이게 무슨일이여.. 초기 create-react-app 설치 시에 자주 만났던 에러를 또 다시 만났다. ( 성공적으로 깔고 프로젝트를 만들어가는 중에도 만나게 되는구나.. ) 과연 오늘의 삽질은 몇시간이 걸릴것인가 한번 겪은 에러가 아니니까 내 목표는 에러 후기 작성까지 30분 할 수 있ㄷ ㅏ다아러ㅣ멀아이ㅏ얼아ㅣ러ㅣㅇㄹ 삽질 START. 🔪 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 Th.. 2020. 4. 7. [ React ] 클래스형 컴포넌트 vs 함수형 컴포넌트 React 클래스형 컴포넌트 vs 함수형 컴포넌트 클래스형 컴포넌트 : 단축키 rcc render()가 꼭 필요하다. 함수형 컴포넌트 : 단축키 rsc 메모리 자원을 클래스형 컴포넌트 보다 덜 사용한다. state와 라이프 사이클 API 사용이 불가능하지만, Hooks의 도입으로 해결 가능하다 리액트 공식 매뉴얼에서는 함수형 컴포넌트와 Hooks를 권장한다. 참고문서 ) https://velog.io/@kimdoldol/Chapter-03-%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8 2020. 4. 6. [ React ] React 의 특징 , create-react-app 시작하기 React ? A JavaScrirpt library for building user interfaces ( 리액트는 UI 를 만들기 위한 자바스크립트 라이브러리입니다. ) 웹 세계는 정신없이 변화하고 있다. 무언가가 순식간에 시장을 휘업잡는듯 하다가 언제 그랬냐는 듯 사라진다. React는 현재 최강의 웹이라고 할 수 있는 Facebook이 만든 Javascript라이브러리이다. React는 단숨에 수많은 개발자들을 사로잡았다. Facebook을 비롯하여 Airbnb, Netflix, Dropbox, Twitter, Evernote, Uber 등 세계를 선도하는 서비스들이 React를 사용한다. / 특징 # component 앱의 다른 부분, 또는 다른 앱에서 쉽게 재사용이 가능하다. 유지가능한 앱을 .. 2020. 4. 3. 이전 1 2 3 4 다음 반응형
