본문 바로가기

분류 전체보기

 (127)
번들링과 웹팩 번들링(Bundling) 번들이란 묶는다는 뜻으로 뭔가를 묶는 작업이라는 것을 이름에서 유추할 수 있습니다. 번들링이란 모듈들의 의존성 관계를 파악하여 그룹화시켜주는 작업을 뜻합니다. 모듈이란 분리된 파일입니다. 그렇다면 파일을 모듈로 분리한 이유는 무엇일까요? 그것은 작업의 효율성을 위해서입니다. 스크립트의 크기가 점점 커지고 복잡해지면서 단순히 하나의 파일이나 클래스로만 관리하기에는 그 복잡하기 때문입니다. 그렇기 때문에 머리, 가슴, 팔, 다리를 따로 떼어서 모듈로서 작업을 할 필요가 생겼습니다. 분리된 모듈들은 연계성을 띄어야하기 때문에 모듈 내부에는 import로 외부 모듈의 기능을 가져오고 export로 외부 모듈에서의 접근을 허용하여 모듈의 기능을 내보냅니다. 모듈 import와 export..
DOM 복습하기 DOM이란? DOM은 Document Object Model의 약자로, HTML 요소를 Object처럼 조작할 수 있는 Model입니다. 즉, 자바스크립트를 사용할 수 있으면, DOM으로 HTML을 조작할 수 있습니다. DOM, 자바스크립트로 조작하기 createElement - CREATE querySelector, querySelectorAll - READ textContent, id, classList, setAttribute - UPDATE remove, removeChild, innerHTML = "" , textContent = "" - DELETE appendChild - APPEND innerHTML과 textContent의 차이 innerHTML은 문자열 내에 포함된 HTML 태그를 함께..
REST한 API에 대해서 자세히 설명해주세요. REST API는 웹에서 사용되는 데이터나 자원을 HTTP URI로 표현하고, HTTP 프로토콜을 통해 요청과 응답을 정의하는 방식을 말합니다. REST API를 작성할때 몇가지 지켜야할 규칙들이 있는데, 첫번째로, HTTP 프로토콜을 사용해야 하며 두번째로, 모든 자원은 개별 리소스에 맞는 엔드포인트를 사용해야하고, 요청하고 받은 자원에 대한 정보를 응답으로 전달해야 합니다. 세번째로, self-descriptive message 즉 CRUD에 맞게 조회에는 get, 생성에는 post 등 적절한 HTTP 메소드를 사용하는 것에 중점을 둡니다. 또한 post 요청에 대해 응답은 새롭게 생성된 리소스를 보내주기 대문에 응답코드도 201로 명확하게 작성해야하며 관련 리소스를 클라이언트가 Location 헤더..
CORS란 무엇이고 목적은 어떻게 되는지 설명해주세요. 그리고 NodeJS 기반의 웹 서버에서 CORS를 어떻게 설정하는지 설명해주세요. Cross-Origin Resource Sharing, CORS는 추가 HTTP 헤더를 사용하여, 한 출처에서 실행 중인 웹 애플리케이션이 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제입니다. Cors : Cross-Origin Resource Sharing은 교차출처공유라는 것인데 이를 허용 해줌으로써 다른 출처간의 리소스를 공유할 수 있습니다. Cors에 대해 덧붙여서 설명드리려면 일단 SOP : same-origin-policy 에 대해 말씀을 드려야 할거같은데요. 동일출처정책이라는 의미로 어떤 출처에서 불러온 문서나 스크립트가 다른 출처에서 가져온 리소스와 상호작용하는것을 제한하는 보안방식입니다. 이와같은 제한은 악의를 가진 사용자가 정보를 탈취하는것 막기 ..
Token 토큰 기반 인증 1. 개념 세션 기반 인증 : 서버 (혹은 DB)에 유저 정보를 담는 방식으로, 서버에 부담이 큽니다 JWT는 클라이언트에서 인증 정보를 보관하는 방법으로 부담을 클라이언트에게 넘겨주기 위해 고안된 대표적인 토큰 기반 인증입니다 클라이언트가 토큰을 가지고 있으면 서버에 해당 토큰을 보여주고 다양한 기능을 요청할 수 있습니다 클라이언트는 XSS 공격이나 CSRF 공격에 노출될 위험이 있어 민감한 정보는 가지고 있지 않는게 안전합니다 하지만 토큰은 유저 정보를 암호화한 상태로 담을 수 있고, 암호화 했기 때문에 클라이언트에 담을 수 있습니다 세션 기반 인증 VS 토큰 기반 인증 세션 : 인증 정보가 서버에 저장됩니다 토큰 : 인증 정보가 브라우저에 저장됩니다 2. 장점 1) Stateless..
Session 1. 세션기반 인증 (Session-based Authentication) 1) 로그인 로그인 조건 1. 서버는 사용자가 인증에 성공했음을 알고 있어야 합니다 2. 클라이언트는 인증 성공을 증명할 수단을 갖고 있어야 합니다 서버는 Client에 유일하고 암호화된 ID를 부여 (중요 데이터는 서버에서 관리) 암호화된 ID : 각 세션을 구분할 수 있는 Session Id로 클라이언트에서 세션 성공을 증명할 수단이 됩니다 * 사이트에서 로그인을 유지하기 위한 수단으로 쿠키를 사용, 쿠키에는 서버에서 발급한 Session Id가 저장됩니다 (session id가 담긴 쿠키는 클라이언트에 저장) 상대적으로 보안에 취약한 쿠키는 경우에 따라 자바스크립트로 접근이 가능하기에 Session Id는 암호화 과정이 필요..
Cookie 서버에서 클라이언트에 데이터를 저장하는 방법 중 하나로 http의 stateless 특징을 보완해주는 도구로 작은 문자열을 저장합니다. 서버가 원한다면 서버는 클라이언트에서 쿠키를 이용하여 데이터를 가져올 수 있습니다. 데이터 저장 이후 아무 때나 데이터를 가져올 수는 없으며, 특정 조건들이 만족하는 경우에만 다시 가져올 수 있습니다. 쿠키를 이용하는 것은 서버에서 클라이언트에 쿠키를 전송하는 것만을 의미하지 않고, 클라이언트에서 서버로 쿠키를 전송하는 것도 포함합니다. 서버는 일방적으로 브라우저에 응답의 헤더를 이용 해 쿠키를 줄 수 있습니다. 쿠키를 저장할 때에는 헤더를 이용합니다 (사용헤더: cookie, set-cookie) stateless 각각의 요청은 독립적이기 때문에 이전 요청에 대한 것을..
Hashing hash는 부수다는 뜻으로 (hashbrown) 다이제스트라고도 합니다. 암호화에서 해시란 원본 데이터를 잘게 부숴서 결과를 변형하는 것을 의미합니다. 원래 값을 잘게 부숴서 알아볼 수 없게 결과를 변형하는 것입니다. 암호화의 기본으로, 어떠한 문자열에 '임의의 연산'을 적용하여 다른 문자열로 변환하는 것으로, 항상 똑같은 결과를 내며, 사실상 복호화가 불가능합니다. 하지만 뻔한 password같이 레인보우 테이블에 기록된 경우에는 값을 알 수 있습니다. 해시 충돌: 경우에 따라 다른 input임에도 똑같은 해시 값이 나올 수 있습니다. 대표적인 hashing: SHA1, SHA256 적용: 비밀번호에 대한 해시 값이 데이터베이스에 저장됩니다. 조건 1. 모든 값에 대해 해시 값을 계산하는데 오래걸리지 ..
반응형

티스토리툴바