Front-End/Front-End 지식4 Vue와 React 차이 라이브러리, 프레임워크 React는 UI 라이브러리이며, Vue는 프레임워크이다. 라이브러리는 참고가 용이하고, 라이브러리의 일부분만 가져와서 사용하는게 편리하다. 그리고 리액트는 UI 라이브러리이기 때문에 리액트 자체만으로는 전역상태 관리, 라우팅, 빌드 시스템을 지원하지 않기때문에 별도의 라이브러리를 통해서 이런 기능을 사용한다. 프레임워크는 부분적인 사용이 불가능하고, 프레임 워크 안으로 들어가서 프레임 워크가 지원해주는 문법에 따라 작성하애 한다. 더 많은 기능을 디폴트로 제공한다. 코드 형태의 차이 리액트는 JSX 형태로 코드를 작성하여 JavaScript 문법을 응용하기 때문에 JavaScript만으로 UI 로직과 DOM을 구현한다. 뷰는 HTML, JS, CSS 코드 영역을 분리해서 작성한다.. 2023. 3. 28. 브라우저 저장소 브라우저 저장소는 크게 LocalStorage, SessionStorage, Cookie 세가지가 있다. LocalStorage와 SessionStorage를 묶어서 Web Storage라고도 부른다. Web Storage는 키/값 쌍으로 데이터를 저장하고, 키를 기반으로 데이터를 조회한다. 사이트의 도메인 단위로 접근이 제한된다. LocalStorage 만료 날짜가 없는 데이터를 저장한다. JavaScript 또는 브라우저 캐시 지우기를 통해서만 지워진다. 저장한도는 3MB, 5MB 이전 브라우저 IE7이하에서는 지원되지 않는다. same-origin policy에서 작동한다. SessionStorage 사용자가 브라우저를 닫을 때 세션이 지속되는 동안에만 데이터를 저장한다. 최상위 탐색 컨텍스트이므로.. 2023. 3. 28. 호이스팅(Hoisting) 개념 함수 안에 있는 선언들을 모두 끌어올려서 해당 함수 유효 범위의 초상단에 선언하는 것을 의미한다. 자바스크립트 함수는 실행되기 전에 해당 함수를 한번 훑고, 함수안에 존재하는 변후/함수 선언에 대한 정보를 기억하고 있는다. 필요한 변수값들을 모두 모아서 유효 범위의 최상단에 선언한다. 실제로 코드 및 메모리에 변화가 있는 것은 아니며, 자바스크립트 Parser 내부적으로 끌어올려서 처리한다. 대상 var변수 선언과 함수 선언문에서만 호이스팅이 일어난다. let/const 변수 선언과 함수 표현식에서는 호이스팅이 발생하지 않는다. // 함수 선언문 function action1(){ console.log("Hello"); } action1(); // 동작함 action2(); // 에러남 //함수 표.. 2023. 3. 28. 브라우저 브라우저의 주요 기능 브라우저의 주요 기능은 사용자가 선택한 자원을 서버에 요청하고 브라우저에 표시하는 것. 자원은 보통 HTML 문서지만 PDF나 이미지 또는 다른 형태일 수 있다. 자원의 주소는 URI에 의해 정해진다. 브라우저의 기본 구조 사용자 인터페이스 : 주소 표시줄, 이전/다음 버튼, 북마크 메뉴등. 요청한 페이지를 보여주는 창을 제외한 나머지 모든 부분. 브라우저 엔진 : 사용자 인터페이스와 렌더링 엔진 사이의 동작을 제어 렌더링 엔진 : 요청한 콘텐츠를 표시. HTML을 요청하면 HTML과 CSS를 파싱하여 화면에 표시함. 통신 : HTTP요청과 같은 네트워크 호출에 사용됨. 플랫폼 독립적인 인터페이스이고, 각 플랫폼 하부에서 실행됨. UI 백엔드 : 콤보 박스와 창 같은 기본적인 장치를.. 2023. 3. 28. 이전 1 다음
