본문 바로가기

React/Velopert's React

(22)
[React] Study #2 | Component, 컴포넌트! 1️⃣ 컴포넌트 하나 만들어보기 import react from 'react';// 리액트 불러오기 function Hello() { return 안녕하세요 } export default Hello;// Hello 라는 컴포넌트로 내보내겠다! 리액트 컴포넌트 종류 함수형 : 내가 블로그에 작성하고 공부하면서 쓸 컴포넌트 형태임! 클래스형 export default Hello; 다른 컴포넌트에서 불러와서 사용가능 2️⃣ App.js에서 Hello 컴포넌트 불러오기 import React from 'react'; //리액트 불러오기 import Hello from './Hello'; //Hello 컴포넌트 불러오기 function App() { return ( {/* 적용! */} ); } export de..
[React] Study #1 | React? React! 💡아이디어의 시작 " 어떠한 상태가 바뀌었을 때, 그 상태에 따라 DOM을 어떻게 업데이트 할 지 규칙을 정하는 것이 아니라, 아예 다 날려버리고 처음부터 모든걸 새로 만들어서 보여준다면 어떨까? " 라는 아이디어에서 시작! 아이디어의 장점 : "업데이트를 어떻게 해야할 지"에 대한 고민을 전혀 안해도 되기 때문에 개발이 쉬움 아이디어의 단점 : 모든 걸 다 날려버리고 새로 만든다? 너무 오래걸려! 하지만, 이 단점은 Virtual DOM 이라는 것을 사용해서 해결! Virtual DOM 말 그대로 메모리에 존재하는 가상의 DOM 그저 Javascript 객체! -> 속도가 빠름! 상태가 업데이트 되면, 업데이트가 필요한 곳의 UI를 Virtual DOM을 통해서 렌더링 업데이트를 어떻게 할지에 대한 고..