프론트엔드개발자(47)
-
RESTful API
RESTful API란? REST는 Representational State Transfer로 자원의 상태를 주고 받는 것을 의미 하고, API는 Application Programming Interface로 프로그램을 사용하는 방법을 의미한다. 거기에 -ful이 붙어 충분한, 가득한, 완전한의 의미를 갖추었다. RESTful API는 두 컴퓨터 시스템이 인터넷을 통해 정보를 안전하게 교환하기 위해 사용하는 인터페이스다. 안전하고 신뢰할 수 있으며 효율적인 소프트웨어 통신 표준을 따르므로 이러한 정보 교환을 지원한다. RESTful API의 이점? 확장성 REST API를 구현하는 시스템은 REST가 클라이언트-서버 상호 작용을 최적화하기 때문에 효율적으로 크기 조정을 할 수 있다. 무상태는 서버가 과거..
2023.05.01 -
HTTP와 HTTPS의 차이
HTTPS란? 기존 HTTP의 보안 버전으로, 데이터를 암호화하고 인증서를 사용하여 데이터의 무결성과 보안을 강화한다. HTTPS를 사용하면 브라우저와 웹 서버 간의 통신이 암호화되어 데이터를 볼 수 없기도 하고 3자가 데이터를 조작할 수 없도록 보호한다. HTTP와의 차이점? HTTP는 데이터를 암호화하지 않기 때문에 데이터가 제3자에게 노출될 위험이 있다. 반면 HTTPS는 데이터를 암호화하여 제3자가 데이터를 가로채더라도 해독할 수 없도록 보호해준다. HTTP와 HTTPS의 차이점은 보안성이다. SSL인증서란? HTTPS를 사용하기 위해 필요한 디지털 인증서다. 공식인증기관에서 발급되어 웹사이트의 신원과 보안성을 보장하기 위한 역할을 해준다. SSL인증서는 웹사이트와 브라우저 간의 통신을 보호하기 ..
2023.04.29 -
브라우저 저장소
브라우저 저장소란? 웹 브라우저에서 데이터를 저장하는 방법이다. localStorage, sessionStorage, IndexedDB가 있다. JavaScript를 사용하여 쉽게 조작할 수 있고, 데이터는 key-value쌍으로 저장이 된다. 일반적으로 데이터는 문자열 형식으로 저장되지만, 필요에 따라 객체나 배열 형태로 저장할 수도 있다. localStorage localStorage는 브라우저에 데이터를 저장하기 위한 key-value형태의 저장소이다. 이 저장소는 브라우저의 세션이 종료되어도 데이터가 유지되어 사용자가 다시 웹사이트를 방문할 때에도 이전에 저장한 데이터를 볼 수 있게 해준다. 장점 데이터를 지속적으로 유지할 수 있다. 저장소 용량이 크고, 대부분의 브라우저에서 5MB이상의 데이터를..
2023.04.29 -
class를 활용해서 모듈화하기
class란? class는 객체 지향 프로그래밍에서 사용되는 기본적인 개념으로, 데이터와 해당 데이터를 처리하는 메서드를 포함하는 캡슐화된 코드 블록이다. 클래스는 객체를 만들기 위한 설계도 역할을 한다. 클래스를 사용하면 객체를 만들 때 해당 객체에 포함될 속성과 동작을 사전에 정의하고, 이를 기반으로 객체를 생성할 수 있다. 객체는 클래스에서 정의한 속성과 메서드를 상속하고 이를 활용하여 독립적인 동작을 수핼할 수 있다. class의 특징? class 내에 정의된 함수를 method라고 부른다 클래스를 통해 생성된 객체를 인스턴스라고 부른다. class도 함수처럼 호출하기 전까지는 코드가 실행되지 않는다. class의 이름은 항상 대문자로 시작한다. this는 본인 객체를 의미한다. 클래스 내에서 메..
2023.04.29 -
제로베이스 2개월차 후기
제로베이스 프론트엔드스쿨 2개월동안 좋았던 점 우선 제로베이스를 2개월동안 완주한 내 자신에게 칭찬을 하며 이 글을 시작해보려고 한다. 처음 시작할 때에는 완주가 가능할거라 생각했었는데 1개월 완주 후 2개월 차에 어렵고 힘들었던 순간들이 있었다. 하지만 포기하지않고 완주하려고 노력하였고, 그 결과 2개월차 완주를 할 수 있었다. 2개월동안 해본 제로베이스 프론트엔드스쿨은 진짜 프론트엔드에게 맞춤인 프로그램들로 구성이 되어있다고 생각이 들었다. 프론트엔드에게 꼭 필요한 역량들을 채워주는 커리큘럼들로 이루어져 있어서 강의를 들을 수록 알차다는 생각을 하게 되었다. 매일매일 해야하는 todo list는 공부의 동기부여가 되어주고, 데일리 스크럼은 성실하게 공부를 할 수 있게 도와주어서 좋았다. 1개월차에 수..
2023.04.29 -
noreferrer, noopener, nofollow
noopener, noopener 하이퍼링크 해당 앵커 태그에 target="_blank"을 자주 쓸 때가 있다. 하지만 이는 성능과 보안면에서 취약점이 발생한다. 새롭게 열린 페이지는 보조 브라우징 컨텍스트이기 때문에 , 자기 자신을 생성한 원본 브라우징 컨텍스트를 오프너 브라우징 컨텍스트라는 이름으로 참조하고 있기 때문에 원본 페이지와 동일한 프로세스에서 실행될 수 있다. - 보안상 취약하다. 링크된 페이지의 javascript에서 window.opener API를 통해 부모 윈도우를 참조하거나 window.opener.location의 값을 변경하여 부모 윈도우의 URL을 변경할 수 있다. 이렇게 부모 윈도우를 피싱 페이지로 변경하여 사용자의 개인 정보가 유출될 수 있기 때문에 보안상의 문제가 발생..
2023.04.25