본문 바로가기

컴퓨터 사이언스 Computer Science14

[모두를 위한 컴퓨터 과학] 1-3. 알고리즘 * 부스트캠프 "모두를 위한 컴퓨터 과학"의 강의 내용을 기록한 게시물입니다. https://www.boostcourse.org/cs112/lecture/118999 모두를 위한 컴퓨터 과학 (CS50 2019) 부스트코스 무료 강의 www.boostcourse.org 알고리즘 전 강의에서 숫자, 글자, 색깔 등을 컴퓨터가 이해할 수 있는 2진법으로 표현 것을 배웠습니다. 이 것은 입력(input)에 해당하는 것입니다. 이제는 출력(output)에 대해 이야기를 해볼까요? 그럼 어떻게 입력(input)에서 출력(output)을 얻을 수 있을까요? 컴퓨팅은 입력을 받아 그 입력을 처리한 후 출력하는 과정입니다. 알고리즘은 입력(input)에서 받은 자료를 출력(output)형태로 만드는 처리 과정을 뜻합니.. 2022. 8. 18.
[모두를 위한 컴퓨터 과학] 1-1. 이진법 * 모두를 위한 컴퓨터 과학의 강의 내용을 기록한 게시물입니다. https://www.boostcourse.org/cs112/lecture/118997 모두를 위한 컴퓨터 과학 (CS50 2019) 부스트코스 무료 강의 www.boostcourse.org 컴퓨터 과학 ? 컴퓨터 과학은 문제 해결에 대한 학문이다. 문제 해결은 입력(input)을 전달받아 출력(output)을 만들어내는 과정입니다. 그 중간에 있는 과정이 바로 컴퓨터 과학입니다. 이러한 입력과 출력을 표현하기 위해선 우선 모두가 동의할 약속(표준)이 필요합니다. 따라서 컴퓨터 과학의 가장 첫 번째 개념은 어떻게 표현하는지에 대한 표현 방법입니다. 2진법 우리가 일상에서 사용하는 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 총 10개.. 2022. 8. 17.
[WEB] 인증 방식 종류 2_Token 과 JWT 1. Token 인증 1) 개념 토큰 기반 인증 시스템은 클라이언트가 서버에 접속을 하면 서버에서 해당 클라이언트에게 인증되었다는 의미로 '토큰'을 부여한다. 이 토큰은 유일하며 토큰을 발급받은 클라이언트는 이후 서버에 요청을 보낼 때 요청 헤더에 토큰을 담아 보낸다. 그러면 서버에서는 클라이언트로부터 받은 토큰을 서버에서 제공한 토큰과 일치하는지 여부를 체크하여 인증 과정을 처리한다. 기존의 세션 인증은 서버가 파일이나 데이터베이스에 세션 정보를 가지고 있어야 하고 이를 조회하는 과정이 필요하기 때문에 많은 오버헤드가 발생한다. 하지만 토큰은 세션과는 달리 서버가 아닌 클라이언트에 저장되기 때문에 메모리나 스토리지 등을 통해 세션을 관리했던 서버의 부담을 덜 수 있다. 토큰 자체에 데이터가 들어있기 때.. 2022. 8. 5.
[WEB] 인증 방식 종류 1_Cookie & Session 1. 쿠키와 세션을 사용하는 이유 - 쿠키와 세션은 HTTP 가 Connectionless와 Stateless라는 특징을 가지고 있어 등장하게 되었습니다. - 비연결지향은 클라이언트에서 서버에 요청을 보내면 서버는 클라이언트에 응답을 하고 접속을 끊는 특성을 말합니다. - HTTP 통신은 요청을 응답하고 접속을 끊기 때문에 클라이언트의 상태정보를 알 수 없습니다. 이를 Stateless하다고 합니다. - 만약 로그인을 하고 그 상태를 유지한 채로 웹 서비스를 제공하려면 어떻게 해야할까요? HTTP프로토콜에서 상태를 유지하기 위해 쿠키와 세션이라는 방법이 존재합니다. 2. 쿠키 1) 개념 - 쿠키는 클라이언트 로컬에 저장되는 Key-Value쌍의 작은 데이터 파일입니다. - 클라이언트가 어떤 웹사이트를 방.. 2022. 8. 3.
[자료구조] 최고의 자료구조는 무엇일까? * JavaScript 알고리즘 & 자료구조 마스터클래스 강의를 듣고 정리한 게시물입니다. 왜 이런 많은 자료 구조들이 존재하고, 그것들은 대체 무슨 일을 하는 것일까? 이진 검색 트리, 큐, 단방향 연결리스트, 비방향(undirected)/비비중(unweighted) 그래프 이진 힙, 우선순위 큐, 방향 그래프, 해쉬 테이블, 양방향 연결리스트, 스택 등 특정 유형의 문제에 있어서 특정한 자료 구조가 효율적이기 때문입니다. 자료구조들은 모두 다른 일을 합니다. 일부 자료 구조는 매우 특화되어 있는 반면, 배열이나 자바스크립트 객체와 같이 자주 사용되고 있는 일부 자료구조들은 매우 일반적입니다. 이런 일반적인 자료 구조들의 경우 우리가 직접 구현할 필요가 없습니다. (무료로 제공되니까) 그러나 RB (R.. 2022. 8. 1.
[네트워크] CDN 이 뭔가요? 개념 Content Delivery Network 또는 Content Distribution Network 의 약자. 협력하여 인터넷 콘텐츠를 고속 전송하는 지리적으로 분산된 서버 집단을 의미합니다. 지리적 제약 없이 전 세계 사용자에게 빠르게 콘텐츠를 전송할 수 있게 만듭니다. 원리 CDN은 콘텐츠를 가능한 한 빠르고, 저렴하고, 신뢰할 수 있고, 안전하게 전송하기 위해 상호 연결된 서버의 네트워크입니다. CDN은 속도와 연결을 개선하기 위해 다양한 네트워크 사이의 익스체인지 포인트에 서버를 배치합니다. 이러한 인터넷 익스체인지 포인트(IXP)는 다른 네트워크에서 발생한 트래픽에 대한 상호 액세스를 제공하기 위해 다양한 인터넷 제공자들이 연결하는 주요 위치입니다. CDN 제공자는 이러한 고속 대규모 상.. 2022. 7. 11.
[브라우저] 렌더링, SSR, CSR 렌더링, SSR, CSR 렌더링 (Rendering) 개념 서버로부터 HTML 문서를 받고, 렌더링 엔진이 HTML파일을 파싱해서 style 속성을 계산하여 DOM tree를 만드는 과정을 의미합니다. * 브라우저는 렌더링을 수행하는 렌더링 엔진(Rendering Engine)을 가지고 있습니다. * 크롬의 경우 웹킷(Webkit)을 사용하다가 웹킷을 Fork하여 블링크(Blink) 엔진을 자체적으로 구현하여 사용하고 있습니다. 렌더링 과정 1. DOM(Document Object Model), CSSOM(CSS Object Model) 생성 가장 첫 번째 단계는 서버로부터 받은 HTML, CSS를 다운로드 받는다. 그리고 HTML, CSS 파일은 단순한 텍스트이므로 연산과 관리가 유리하도록 Object.. 2022. 6. 10.
[프론트엔드] 상태관리 (2) - Redux (상태관리 라이브러리) Redux React에서 전역 상태관리의 필요성 React에서 State는 component 안에서 관리됩니다. 자식 컴포넌트들 간의 다이렉트 데이터 전달은 불가능 합니다. 자식 컴포넌트들 간의 데이터를 주고 받을 때는 상태를 관리하는 부모 컴포넌트를 통해서 주고 받습니다. 그런데 자식이 많아진다면 상태 관리가 매우 복잡해집니다. 상태를 관리하는 상위 컴포넌트에서 계속 내려 받아야합니다. => Props drilling 이슈 발생 Redux 를 언제 사용해야 할까? (공식문서 내용 번역) https://redux.js.org/faq/general#when-should-i-use-redux 어플리케이션의 많은 공간에서 필요한 상당한 양의 데이터가 있을 때 상태값이 매우 빈번하게 업데이트될 때 상태를 업데이.. 2022. 6. 10.
[프론트엔드] 상태관리 (1) - 상태/상태관리 개념, 상태관리 역사와 방법론 요약 1. 상태 - 사용자에게 노출시키고 상호작용하기 위한 데이터와 눈에 보이지 않지만 서버와 주고받는 데이터까지 모두 포함하여 상태라고 부릅니다. 2. 상태 관리 - 상태를 정의, 유지하고 변화를 주고, 외부에 상태를 반영하는 것을 의미합니다. 3. 상태관리가 필요한 이유 - 상태들이 복잡하게 얽혀있다면, 상호간에 의존성이 많아지게 되어 UI가 어떻게 변하는지 알기 어려울 수 있기에 효율적으로 관리해야 함. 4. 평소 상태관리는 어떻게 하는지? - 특정 컴포넌트에서만 사용하는 상태는 useState 를 사용하여 로컬 상태로 관리하고, 여러 컴포넌트에서 사용하는 상태는 Redux-toolkit 등 전역 상태관리 툴을 이용하여 전역 상태로 관리합니다. 상태(State) 사용자에게 노출시키고 상호작용하기 위.. 2022. 6. 9.

티스토리툴바