목록React (13)
COCO World
1. export named export라고도 함 import시 -> import export할때 객체 함수 이름 ex) import 선언된 이름 from '파일경로' 2. export default 개발자가 원하는 이름으로 import할 수 있음 ex) import 원하는 이름 from '파일경로' 3. 정리 한 모듈 안에 여러 가지 함수를 선언한 경우, export를, 한 모듈 안에 함수 대상이 하나이면 export default를 사용하자 한 모듈 안에 여러가지 함수를 선언했을 때 export default를 선언할 경우, 협업 시 헷갈릴 수 있다 export 를 사용할 경우 사용한 이름을 그대로 가져오기 때문에 관련정보 파악이 쉽다 export default를 사용할 경우, 협업하는 팀원들끼리 명..
1. 불변성 : 불변성이란 값이나 상태를 변경할 수 없는 것을 의미합니다. 이를 이해하기 위해선 자바스크립트의 원시형과 참조형에 대해 알아보아야 한다. 원시형 (Boolean, Number, String, null, undefined, Symbol) : 불변성을 유지하는 타입 객체형 (Object) : 변경이 가능한 타입으로 불변성을 갖지 못하는 타입 [1] 원시형 예시 아래의 예시는 메모리 영역을 2개 사용한 것으로, 값이 바뀐 것이 아니라 변수 a는 처음에 할당을 하고나서, 다른 메모리에 재할당을 한 것이다. = 즉, 메모리에 재할당을 하였지 불변성을 유지하는 특징이 있다. let a = '나는 원시형이다'; a = '사실 원시형이 아니야'; [2] 객체형 예시 메모리 영역은 그대로 이지만, 그 메모..
1. SPA와 MPA 렌더링이란? : 웹 애플리케이션 상에서 데이터를 표시하는 행위 🌻 SPA(Single Page Application) SPA는 한 개의 페이지로 구성된 애플케이션으로 서버로부터 완전한 새로운 페이지를 불러오지 않고 현재의 페이지를 동적으로 다시 읽음으로써 사용자와 소통하는 웹 앱이다. 이러한 방식은 연속되는 페이지가 렌더링하면서 주는 불편함을 줄여주기 때문에 사용자 경험의 간섭을 막아주고 더욱 자연스럽게 동작하도록 만들어준다. 🌻 SPA의 특징 웹 애플리케이션에 필요한 모든 정적 리소스를 최초 한번에 받아온다 이후 새로운 데이터 요청이 있을 때 필요한 데이터만 전달받아서 페이지를 갱신하기 때문에 반응성이 좋다 때문에 SPA는 CSR(Client Side Rendering)방식으로 렌..
1. 데이터 바인딩(Data Binding) : 화면상에 보여지는 데이터(View)와 브라우저 메모리에 있는 데이터(Model)를 묶어서(Binding) 서로 간의 데이터를 동기화하는 것을 의미한다. MVC 모델에서 model과 view가 묶여져 자동 동기화시키는 것을 의미하기도 한다. 이러한 데이터 바인딩에는 양방향 바인딩과 단방향 바인딩이 있다. 2. 양방향 바인딩 [1] 설명 : 양방향 데이터 바인딩에서는 부모 컴포넌트와 자식 컴포넌트 간의 데이터가 서로 양방향으로 흐르기 때문에 부모와 자식 모두 데이터를 직접 변경할 수 있다. : Model(JavaScript)와 View(HTML)가 있을 때, Model의 데이터가 업데이트 될 경우 -> view도 업데이트 view의 데이터가 업데이트 될 경우 ..
React 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리로 웹 또는 앱 애플리케이션의 UI, 보여지는 부분인 프론트엔드 영역을 구축하게 해주는 역할을 한다. 리액트의 특징 [1] SPA(Single Page Application) 아키텍처 정의 - SPA란, 한 개의 페이지로 이루어진 애플리케이션이라는 뜻으로, MPA(Multi Page Application)과는 상반된 개념이다. 특징 - 딱 한개의 페이지로 구성된 웹 앱 - 서버에 1회 리소스를 요청하고, 그 이후부터는 필요할 때 데이터만 받아와서 기존 페이지를 '수정'하는 방식으로 화면이 보여진다 - SEO(Search Engine Organization)에 약하다. - MPA는 위와 반대로, 요청이 일어날때마다 웹페이지를 새로 다시..