주기적인 반복으로 머리속에 채워보자
URL의 구조
Scheme(=Protocol)
브라우저가 리소스를 요청하기 위해 사용해야 하는 프로토콜을 나타낸다.
프로토콜은 중앙 컴퓨터와 단말기 사이에서 데이터 통신을 원활하게 하기 위해 필요한 통신 규약으로, 웹에서는 브라우저와 서버 간에 데이터를 주고 받기 위한 방식으로 HTTPS/HTTP 프로토콜이 가장 많이 사용되고 있다. HTTPS/HTTP 외에도 mailto:(이메일 주소를 지정하는 프로토콜), ftp:(파일을 주고 받는 프로토콜) 등 다양한 프로토콜이 존재한다.
Domain Name
도메인(Domain)은 IP 주소를 갖는 서버를 사용자가 쉽게 기억하고 찾을 수 있도록 만들어준 서비스이다. 실제 컴퓨터와의 통신에서는 숫자로 표현된 주소(=IP)를 사용하기 때문에 이를 변환시켜 줄 네임 서버가 필요하다.
www: 호스트명(차상위 도메인/서브 도메인)
google: 도메인명
com: 최상위 도메인명
Port
포트 번호를 통해 어떤 서버를 이용할지 결정하며, : (콜론) 뒤에 나온다. 웹 서버가 HTTP 프로토콜의 표준 포트(HTTP의 경우 80, HTTPS의 경우 443)를 사용하는 경우 일반적으로 생략되기 때문에, URL에는 기본적으로 표준 포트번호가 생략되어 있는 것이다.
Path
파일의 경로를 가리키며, / (슬래시) 뒤에 나온다. 폴더 내에 파일과 폴더를 계속 만들 수 있는 것처럼 컴퓨터의 폴더와 비슷한 개념으로 생각하면 이해가 쉽다.
Parameter
파라미터는 쿼리 스트링이라고도 부르며, key(파라미터의 이름)=value(파라미터의 값) 형태로 이루어진다. ?(물음표) 뒤에 나열되고, &기호로 구분되어 여러개가 존재할 수 있다.
Anchor(=Fragment)
프래그먼트(Fragment), 해시태그(Hashtag)라고도 부르며, 특정 요소를 지시할 수 있다.
예를 들어, 해시태그로 이동을 원하는 요소의 id를 링크로 연결하면 스크롤 이동없이 바로 해당 위치로 이동한다. 파일 디렉토리 및 파일 이름과 유사한 역할로 쓰이는 경우도 있다.
출처
https://velog.io/@liankim/URL%EC%9D%98-%EA%B5%AC%EC%A1%B0
생명주기 메서드
마운트(Mount)
DOM이 생성되고 웹 브라우저상에 나타나는 것을 Mount 라고한다.
constructor : 컴포넌트를 새로 만들 때마다 호출되는 클래스 생성사 메서드
getDerivedStateFromProps : props 에 있는 값을 state 에 넣을 때 사용하는 메서드
render : 준비한 UI를 렌더링하는 메서드
componentDidMount : 컴포넌트가 웹 브라우저상에 나타난 후 호출하는 메서드
업데이트(Update)
props가 바뀔 때
state가 바뀔 때
부모 컴포넌트가 리렌더링될 때
this.foceUpdate로 강제로 렌더링 트리거할 때
업데이트에 호출되는 메서드
getDerivedStateFromProps : 앞서 Mount 과정에서도 호출되고, props 변화에 따라 state 값에도 변화를 주고 싶을 때 사용
shouldComponentUpdate : 컴포넌트가 리렌더링을 해야 할지 말아야 할지를 결정, true 를 반환하면 다음 라이프사이클 메서드를 계속 실행, false 를 반환하면 작업을 중지(리렌더링 X)한다.
render : 컴포넌트를 리렌더링한다.
getSnapshotBeforeUpdate : 컴포넌트 변화를 DOM에 반영하기 바로 직전에 호출
componentDidUpdate : 컴포넌트의 업데이트 작업이 다 끝난 후 호출
언마운트(Unmount)
Mount 의 반대 과정, 즉 컴포넌트를 DOM에서 제거하는 것을 Unmount 라고 한다.
언마운트시 호출하는 메서드
componentWillUnmount : 컴포넌트가 웹 브라우저상에서 사라지기 전에 호출
