코딩하는 삶

[1. OAuth란]OAuth("Open Authorization")는 인터넷 사용자들이 비밀번호를 제공하지 않고 다른 웹사이트 상의 자신들의 정보에 대해 웹사이트나 애플리케이션의 접근 권한을 부여할 수 있는 공통적인 수단으로서 사용되는, 접근 위임을 위한 개방형 표준이다.-위키백과 OAuth는 각 회사들의 파편화된 인증 방식(구글의 AuthSub, AOL의 OpenAuth, 야후의 BBAuth, 아마존의 웹서비스 API 등)을 한데 모아 표준화한 것으로, 이를 사용하면 이 인증을 공유하는 애플리케이션끼리는 별도의 추가 인증 없이 인증 내용을 사용할 수 있다.  따라서 우리는 OAuth를 따르는 애플리케이션을 개발해 자체적인 로그인 및 사용자 관리 기능을 구현할 필요 없이 다른 회사의 로그인 인증 정보만..

[1. 웹 브라우저에 URL을 입력][1-1. URL]URL(Uniform Resource Locater)은 인터넷에서 웹 페이지, 이미지, 비디오 등 리소스의 위치를 가리키는 문자열이다.다음과 같은 표현 방식을 사용한다.scheme://:@:/ scheme: 자원에 접근할 방법을 정의해 둔 프로토콜 이름을 입력받는다.user, password: 사용자의 정보를 전달해 서버에서 사용자를 인증하는 데 사용하며, 현재는 거의 쓰이지 않는다.host: 서버의 도메인 이름 또는 IP 주소를 받는다.도메인 이름을 입력받으면 DNS 조회를 통해 도메인 사이트를 호스팅하는 서버의 IP 주소로 변환하는 작업이 이루어진다.port: 서버가 대기하고 있는 논리적 주소이다.웹 서버는 일반적으로 80(http) 혹은 443(..

[0. React Query란]TanStack Query (FKA React Query) is often described as the missing data-fetching library for web applications, but in more technical terms, it makes fetching, caching, synchronizing and updating server state in your web applications a breeze. 리액트 어플리케이션에서 fetching, caching, synchronizing, updating server state를 지원하는 라이브러리이다. 이를 사용해 원래 fetch 함수를 선언하고, 이를 저장할 상태를 선언하고, useEffect를 ..

[0. 모듈화의 필요성]자바스크립트는 script 태그를 통해 외부의 스크립트 파일을 가져올 수 있다.하지만 파일마다 독립적인 파일 스코프를 가지지 않고 하나의 전역 객체를 공유한다.예를 들어, 두 개의 js 파일을 스크립트 태그에 넣는다고 가정해 보자.   자바스크립트는 가장 뒤에 있는 스크립트를 기준으로 변수명을 적용하게 된다. // math.jsfunction sum(x, y) { return x + y;}// app.jssum(1, 2);console.log(sum(1, 2)); // 3 위와 같이 코드가 작성되었을 때, 만약 app.js에서 sum이 재정의되면 어떻게 될까?// math.jsfunction sum(x, y) { return x + y;}// app.js..

[1.DOM과 브라우저 렌더링 과정][1-1. DOM이란]문서 객체 모델(Document Object Model)은 XML, HTML 문서의 각 항목을 계층으로 표현하여 생성, 변형, 삭제할 수 있도록 돕는 인터페이스이다. W3C(World Wide Web Consortium)의 표준이다. DOM은 웹페이지의 콘텐츠와 구조를 어떻게 구현해야 하는지에 대한 정보를 담은 인터페이스로,  트리 구조로 이루어져 있다. [1-2. 브라우저 렌더링]브라우저 렌더링은 다음과 같은 순서로 이루어진다.URL의 호스트 이름이 DNS를 통해 IP 주소로 변경되고, 그 주소의 서버에 요청을 전송한다.서버는 HTML 파일을 전송한다.HTML/XML 파서는 전달받은 HTML을 파싱해 DOM 트리를 생성한다.파싱 과정에서 외부 리..

[0. 글을 들어가며...] 레벨 1이 끝났다. 원래는 블로그를 중간중간 열심히 작성하려고 했지만, 도무지 시간이 나지 않았다...라고 하면 거짓말이고, 잊고 살았다는 말이 더 정확하겠다. 거기다가 뭔가 기술 블로그라는 틀 안에 갇혀 있다 보니 공부한 내용에 대해 작성해야 할 것 같다는 알 수 없는 압박감이 나를 누르고 있었다. 그래서 가끔씩 생각날 때마다 '써야지, 써야지' 하는 생각만 하고 정작 손도 대지 않고 않았지만, 3월 6일 크론과의 면담 중 크론의 말이 큰 와닿음을 주었다. "굳이 거창한 기술 내용들로 블로그를 채울 필요 없어요. 다른 블로그에도 많을 텐데요, 뭘." 크론의 말을 듣고 블로그에 글을 쓰는 것에 대한 부담감이 한결 덜어지는 느낌을 받았다. 앞으로는 2주, 바쁘면 한 달 간격으로..

Big-O 표기법이란 빅오 표기법은 알고리즘의 효율성을 표현하기 위해 가장 많이 사용하는 표기법 중 하나이다. 알고리즘의 실행 시간 또는 공간 복잡도를 입력 크기에 대한 함수로 나타낸다. 최악의 경우를 표기하기 때문에 알고리즘 복잡도의 상한을 표현하기에 적합하다. 표기법은 아래와 같다. O(f(n)) n은 입력 크기를 나타내고, f(n)은 알고리즘의 복잡도를 표현하는 함수이다. 그 외 표기법으로는 Big-Ω 표기법: 최선의 경우의 복잡도를 표기. Big-Θ 표기법: 평균적인 경우의 복잡도를 표기. 컴퓨터공학에서는 항상 최악의 경우를 고려해야 하므로 주로 Big-O 표기법을 사용한다.

[시간 복잡도(Time complexity)] 자료의 수 n이 증가할 때 시간이 증가하는 대략적인 패턴을 표현하는 방식. 보통 Big-O 표기법을 사용한다. 수치가 작을수록 효율적인 알고리즘이지만 문제에 따라 O(2^n) 또는 O(n!)등의 복잡한 알고리즘을 사용해야만 하는 경우도 존재한다. O(1) < O(log n) < O(n) < O(n log n) < O(n^2) < O(2^n) < O(n!) 함수를 설계할 때 최대 O(n log n)정도의 시간 복잡도를 가지게 하는 것이 바람직하다. O(1) - 상수 n에 관계없이 일정한 시간이 걸리는 알고리즘. 대부분의 경우에서 가장 단순하고 빠르다. stack의 push/pop 연산, 배열/큐 등의 원소에 대한 접근 등이 이에 해당한다. function fo..

본격적으로 CS 공부에 들어가기 전에 '프로그래밍이란 무엇인가'에 대해 정리해보고자 한다. 컴퓨터 프로그래밍 또는 간단히 프로그래밍 혹은 코딩은 하나 이상의 관련된 추상 알고리즘을 특정한 프로그래밍 언어를 이용해 구체적인 컴퓨터 프로그램으로 구현하는 기술이다. 출처: 위키백과 - 컴퓨터 프로그래밍 프로그래밍은 컴퓨터 언어를 이용해 알고리즘의 조합으로 원하는 목적을 달성하는 프로그램을 작성하는 과정을 말한다. 많은 사람들이 프로그래밍을 단순히 코드를 작성하는 것 또는 알고리즘을 작성하는 것으로 생각하곤 한다. 나 또한 프로젝트에 참여하기 전에는 단순 알고리즘 구현 능력만이 코딩 실력의 전부라고 생각하고 있었다. 하지만 프로젝트를 진행해보고, 우테코 프리코스와 최종 코딩테스트에 참여하면서 생각이 바뀌게 되었..

나는 최근까지 프로그래밍에 있어 전공 지식의 필요성이 크게 와닫지 않았었다. 전공 지식보다는 특정 언어의 문법과 알고리즘을 활용하는 것이 훨씬 더 중요하다고 생각했기 때문이었다. 하지만 몇 개의 프로젝트들을 진행하면서, 어떤 코드를 작성하든 '내가 자료형과 작동 원리에 대해 더 공부하면 더 잘, 더 깔끔한 코드를 작성할 수 있을 것 같은데' 라는 생각이 끊임없이 머리를 맴돌았다. 무엇보다도, 사용하는 언어들이 많아지면서 서로의 문법, 메모리 할당 방식 등이 헷갈리는 경우가 많아졌다. 그러다 보니, 여러 언어들을 꿰뚫는 기본 지식을 통해 변화에 유연하게 적응할 수 있는 프로그래머 가 되고 싶었다. 그래서 지금까지는 '그렇구나' 하고 넘겼던 전공 지식들을 다시 돌아보며 내실을 다지려고 한다.