728x90 프론트엔드4 #10. React (리액트) 란? Whatr is React.js ? 👋🏻 1. Library. Made by Facebook. Released in 2013 1. Components module과 비슷하게 컴포넌트로 이루어져 있어서 재사용이 가능하다. 2. Virtual Dom Real DOM vs Virtual DOM - Real DOM? 1. 만약 10개의 리스트가 있다. 2. 그 중에 한가지의 리스트만 Upload 됨. 3. 전체 리스트를 다시 Reload 해야 됨 4. Super Expensive한 작업 ! - Virtual DOM? ✔️ 1. 만약 10개의 리스트가 있다 2. 그 중에 한가지의 리스트만 Update 됨 3. 바뀐 한 가지 아이템만 DOM에서 바꿔준다. 어떻게 Virtual DOM에서 바꿔주지? 👀 1. JSX를.. 2021. 1. 20. [ React ] SSR ( 서버사이드렌더링 ) & CSR ( 클라이언트사이드렌더링 ) SSR과 CSR에 대한 개념과 React에서 어떻게 SSR 환경을 구축하고 사용할 수 있을지 궁금해서 오랜만에 포스팅 해보려고 한다. SSR 이란 ? SSR은 Server Side Rendering 약자로 처음 클라이언트가 접속했을때 브라우저에서 자바스크립트 코드를 다운 받아 해석 할 때 까지 기다리지 않고 서버에 보여질 HTML을 미리 준비해 클라이언트한테 응답해주는 방식이다. 사용자가 웹 페이지에 접속했을 때 서버에서는 사용자에게 렌더링될 HTML 파일을 응답하여 사용자에게 웹 페이지가 바로 렌더링 될 수 있도록 해준다. 그 후 브라우저는 자바스크립트 파일을 다운받아 해석하고 실행하는 절차를 가진다. --> 사용자는 브라우저가 자바스크립트 파일을 해석하고 보여질때까지 기다리지 않고 바로 렌더링 하기 .. 2020. 5. 13. [ 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 다음 반응형
