공부/~~란 무엇인가? 17

[ React-Hooks ] Hooks란 무엇인가

Hooks란 무엇인가? Hooks는 리액트 v16.8에 새로 도입된 기능으로서, 함수형 컴포넌트에서도 상태 관리를 할 수 있는 useState, 그리고 렌더링 직후 작업을 설정하는 useEffect 등의 기능 등을 제공하여 기존의 함수형 컴포넌트에서 할 수 없었던 다양한 작업을 할 수 있게 해 줍니다. Hooks의 종류 1.useState useState는 가장 기본적인 Hook으로서 함수형 컴포넌트에서도 가변적인 상태를 지니고 있을 수 있게 해 줍니다 만약에 함수형 컴포넌트에서 상태를 관리해야 되는 일이 발생한다면 이 Hook을 사용할 수 있습니다 2.useEffect useEffect는 리액트 컴포넌트가 렌더링 될 때마다 특정 작업을 수행하도록 설정할 수 있는 Hook입니다 클래스형 컴포넌트의 com..

시맨틱(Semantic) HTML이란?

시맨틱(Semantic) HTML 이란? 시맨틱(Semantic) HTML 은 번역하면 "의미의, 의미론적"이라는 뜻이다 즉 의미론적인 HTML이라는 것이다 시맨틱 태그와 그렇지 않은 태그 일반적으로 HTML 태그만 보고는 이 태그 안에 들어간 내용의 의미를 알수 없다 하지만 시맨틱 태그를 보면 대략적으로나마 태그안에 들어갈 내용의 의미를 유추할 수 있다 시맨틱 태그 시맨틱 하지 않은 태그 HTML에서 새로 등장한 시맨틱 태그 : 글을 의미한다 : 페이지 내용 주변에 있는 내용을 의미한다 : 사용자가 보거나 숨길 수 있는 추가적인 세부정보를 의미한다 : 의 설명을 의미한다 : 사진, 일러스트, 코드 같은 그 자체로 의미를 갖는 내용을 의미한다 : 문서나 섹션의 꼬릿말을 의미한다 : 문서나 섹션의 머릿말을..

SPA 란?

SPA 란 무엇인가 SPA란 Single page Application의 약자이다 SPA는 즉 하나의 페이지 애플리케이션이다 웹사이트 전체를 하나의 페이지에 담아 동적으로 화면을 바꿔가면서 표현하는 것이 SPA이다 이미지에서 전통적인 웹페이지는(좌측) SPA웹페이지는(우측)처럼 구성되어있다 기존에는 사용자가 다른 페이지로 이동할 때마다 새로운 HTML을 받아오고 페이지를 로딩할 때마다 서버에서 리소스를 전달받아 해석한 뒤 화면에 보여주었다 이렇게 사용자에게 보이는 화면은 서버 측에서 준비했었다 사전에 HTML 파일을 만들어서 제공하거나 데이터에 따라 유동적인 HTML을 생성하는 템플릿 엔진을 사용하기도 했었다 요즘은 웹에서 제공되는 정보가 정말 많기 때문에 새로운 화면을 보여주어야 할 때마다 서버 측에서..

Redux 란?

리덕스란 무엇인가? 리덕스는 가장 사용률이 높은 상태관리 라이브러리이다 러덕스를 사용하면 앞으로 만들게될 프로젝트의 컴포넌트들의 상태관련 로직들을 다른 파일들로 분리시켜서 더욱 효율적으로 관리할수 있다 또한 컴포넌트끼리 상태를 공유하게될때 여러 컴포넌트를 거치지 않고도 손쉽게 상태 값을 전달할수있다 리덕스의 필요성 리덕스는 글로벌 상태 관리를 하게 될때 굉장히 효과적이다 물론 리덕스를 사용하는것이 유일한 방법은 아니고 Context API를 사용해서도 동일한 작업을 할수있다 리덕스의 키워드액션 (Action) 상태에 어떠한 변화가 필요하게 될때 액션을 발생시킨다 액션은 하나의 객체로 표현된다 액션은 type 필드를 필수적으로 가지고 있어야하고 그 외의 값들은 개발자 마음대로 넣어줄 수 있다 { // 필수..

호스팅 이란?

호스팅이란 호스팅이란 정보의 집약체인 서버의 전체 혹은 일부를 이용할 수 있도록 임대해 주는 서비스이다 서버를 관리하기 위해서는 24시간 내내 안정적으로 전기를 공급해야 하고 빠르고 안정적인 인터넷 회선을 사용해야 하며 철저한 보안 시스템을 갖추고 있어야 한다 따라서 개인이 서버를 관리하기보다는 전문 업체의 호스팅 서비스를 사용하는 것이 일반적이다 호스팅의 종류 웹 호스팅 장점 하나의 서버를 여러 웹사이트가 함께 사용하는 형태이다 하나의 서버를 나누어 쓰기 때문에 저렴하게 이용할 수 있다 호스팅 업체의 통합 관리를 받기에 편리하다 단점 사용할 수 있는 하드웨어가 제한적이라는 단점이 있다 서버호스팅 장점 고객의 단독 서버를 사용하는 형태이다 넓은 하드웨어 공간을 사용할수 있고 서버 운영/관리에 대한 직접적..

브라우저의 동작 원리

브라우저란? 브라우저는 웹서버에서 이동하며 쌍방향으로 통신하고 HTML 문서나 파일을 출력하는 그래픽 사용자 인터페이스 기반의 응용 소프트 워어이다. 웹 브라우저는 대표적인 HTTP 사용자 에이전트의 하나이기도 하다 브라우저의 주요 기능 사용자가 선택한 자원을 요청하고 브라우저에 표시하는 것이다 자원은 보통 HTML 문서지만 PDF나 이미지 또는 다른 형태일수 있다. 자원의 주소는 URL에 의해 정해진다. 브라우저는 웹 표준화 기구인 W3C(World Wide Web Consortium) 에서 정한 명세에 따라 파일을 해석해서 표시한다. 브라우저의 사용자 인터페이스는 브라우저마다 서로 닮아 있는데 다음과 같은 요소들이 일반적이다 URI를 입력할 수 있는 주소 표시줄 이전 버튼과 다음 버튼 북마크 새로 고..

HTTP와 HTTPS란 무엇인가?

HTTP HTTP는 하이퍼 텍스트 전송 프로토콜 (Hypertext Transfer Protocol)의 약자이며 서로 다른 시스템 사이에서 통신을 주고받을 수 있게 해주는 가장 기초적인 프로토콜이다 쉽게 생각하면 프로토콜은 규칙이라고 생각할 수 있다 규칙을 정해두었기 때문에 모든 프로그램이 이 규칙에 맞춰서 서로 정보를 교환할 수 있다 HTTP는 프런트엔드 개발자가 기본소양으로 알고 있어야 하는 지식이다 HTTPS HTTPS는 하이퍼 텍스트 전송 프로토콜(Hypertext Transfer Protocol) + 보안(Secure) 이다 일반HTTP의 문제점은 서버에서 브라우저로 전송되는 정보가 암호화 되지 않는다는것이다 그래서 데이터의 도난등 보안문제가 발생할 수 있다 이문제를 보완하기 위해 HTTP에 S..

쿠키(Cookie)란?

쿠키는 서버가 클라이언트에 저장하는 정보로서, 클라이언트와 연결이 끊어져도 클라이언트에 저장된 정보가 유지되어 서버에 재 방문할 때 요청정보의 헤더 안에 포함되어 서버로 전달된다. 쿠키를 언제 사용하는가? 이전에 방문한 적이 있는 웹서버에 다시 방문했을 때 몇 번째 방문인지 비로그인자가 쇼핑몰에서 주문할 때까지 장바구니에 선택한 상품 정보들을 유지 포털 사이트에서 클라이언트가 특별히 관심 있어하는 항목에 대한 정보 유지 자동 로그인을 허용할 때

Library 와 Framework 는 무엇인가?

1. Framework 프레임워크는 하나의 애플리케이션을 구축할 때 모든 애플리케이션의 공통적인 개발 환경을 제공해 주는 것 개발에 필요한 화면 구현, DB 연동, 개발환경들에 공통적인 부분을 제공해서 개발 시간과 리소스 비용을 절감해 생산성을 높여주는 것 쉽게 말해 뼈대나 기반구조를 뜻하고 어떠한 프로그램을 만들기 위한 기본 틀이라고 할 수 있습니다. 2. Library 라이브러리는 재사용이 가능한 필요기능으로 반복적인 코드를 없애기 위해 언제든지 필요한 곳에서 호출해서 사용할 수 있도록 Class, Function 으로 만들어진 것입니다. 3. Framework와 Library의 차이 Framework와 Library 차이는 Flow(흐름)의 대한 제어 권한이 어디에 있느냐의 차이입니다 프레임워크는 ..