전체 글35 DNS 동작 과정 웹 브라우저가 웹 페이지를 불러올 때 먼저 하는 일 중 하나가 소켓통신을 위해 서버의 IP를 찾는 일이다. 웹 문서를 어떤 과정을 거쳐 불러오는지를 평가하는 것 같다.또한 웹페이지를 리디렉션 해야할 때, 직접 DNS를 만져야 하는 일이 생기므로 이에 대한 것도 물어볼 수 있다. *관련 레이어: Application Layer DNS(Domain Name System)는 네트워크 호스트의 도메인 이름과 실제 IP 주소를 매칭시켜주는 시스템이다. 인터넷에 접속된 모든 호스트들은 IP 주소를 부여받게 되고 이를 통해서 다른 호스트들과 데이터를 주고받는다. DNS의 동작과정 전반적인 컨셉은 계층적인 네임 서버를 놓는 것부터 시작한다. 상위 계층의 네임 서버는 바로 아래 계층의 네임서버의 IP를 갖고있다. 상위 .. 2023. 4. 4. 문자는 컴퓨터에 어떤 bit형태로 저장될까? 왜 이렇게 쓸까? 우리가 컴퓨터에서 사용하는 문자는 어떤 bit로 저장될까? 그리고 어떻게 사용될까? 우리가 사용하는 프로그래밍 언어들은 문자 자료형을 지원한다. 하지만 컴퓨터는 기계이고, 우리가 사용하는 일반문자를 사용하지 않는다. 컴퓨터는 이진수로 변환된 문자, 즉 이진수로 인코딩된 문자를 사용한다. 이 글에서 다루고자 하는 것은 아스키코드, 유니코드, utf-8과 같은 인코딩이 무엇인지, 그리고 왜 나타났는지에 대해서 알아보고자 한다. 아스키코드 아스키코드란 미국 정보교환 표준 부호(ASCII: American Standard Code for Information Interchange)의 약자로, 1960년대 초에 미국의 표준화 기관에서 제정한 문자 인코딩 표준이다. 이 표준은 128개의 다른 문자 값을 나타낼 수 .. 2023. 4. 3. 숫자는 컴퓨터에 어떤 bit형태로 저장될까? 왜 이렇게 쓸까? 이 글은 정수(Integer)와 부동소수점(Float) 수가 어떤 비트로 표현되는지, 그리고 왜 그렇게 표현되는지에 대해 다룹니다. * 조너선 스타인하트의 '한 권으로 읽는 컴퓨터 구조와 프로그래밍'을 공부한 내용에 제가 추가적으로 알아본 내용을 정리하였습니다. * 양의 이진수를 덧뺄셈하는 법. 간단한 논리연산은 안다고 가정하고 글을 진행하겠습니다. 아마 프로그래밍을 조금이라도 접해보았다면 프로그래밍 언어에는 다양한 데이터 타입들이 존재한다는 것을 알고 있을 것이다. 그리고 각각의 데이터의 크기가 몇 바이트인지에 대해서도 들어봤을 것이다. 혹시 잘 기억나 지 않는 사람들을 위해 아래의 표를 보고 떠올려보길 바란다. 아래의 표는 C언어를 기준으로 작성한 자료형 별데이터의 범위와 크기이다. 다른 언어로 프로.. 2023. 3. 29. 13) javascript의 제어문 제어문이 무엇일까? 다른 언어를 경험해봤다면 당연히 아는 개념일 것이고, 아니어도 단어 자체에 뜻이 있으므로 감을 잡을 수 있을 것이다. 제어문(Control flow statement)은 코드 블록을 조건에 따라 실행하거나, 반복적으로 실행해야 할 때 사용하는 실행문을 말한다. 즉 프로그램의 실행 흐름을 제어한다. 제어문은 프로그래밍 언어라면 대부분 갖고 있는 문장이다. 생각해보면 당연하다. 우리는 컴퓨터에게 일을 시켜야 한다. 우리가 커다란 프로그램을 처음부터 실행 순서대로 일일이 작성할 수 있는 능력이 있을까? 같은 일을 여러 번 시켜야 하는 경우에는 같은 코드를 일일이 반복해서 작성해야 할까? 1억번의 같은 일을 시켜야 하면, 1억번의 같은 코드를 작성해야 할까? 다행히 그럴 수도 없고, 그럴 일.. 2022. 8. 31. 12) javascript의 연산자 목차 산술연산자 대입연산자 증감연산자 비교연산자 논리연산자 연산자(operator)가 무엇일까? 연산을 할 때 사용할 때 사용하는 부호다. 연산이라 하면 대개 수학적인 연산, 그러니까 사칙연산을 같은 것을 떠올릴 것이다. 하지만 꼭 수학에만 한정할 필요는 없다. 하나 이상의 대상에서 규칙에 따라 새로운 것을 만들어 내는 조작. 이것을 연산이라고 한다. 그리고 연산의 대상을 피연산자라고 한다. 만약 연산의 대상이 하나면 단항연산자, 두개면 이항연산자, 세개면 삼항연산자라고 부른다. 갑자기 새로운 개념을 몰아쳤으니, 예시를 하나 들어보는 것이 좋겠다. 만약 3+5이라는 식이 있다고 하자. 그럼 3과 5는 피연산자이고, 덧셈기호인 +는 이항연산자에 속한다. 그리고 해당 연산자는 양 옆의 수를 더한 수를 내놓는.. 2022. 8. 29. 11) 데이터 타입과 형 변환 *이 글은 프로그래밍 지식이 아예 없다는 가정하에 작성하였습니다. 혹시 다른 프로그래밍 언어를 경험해보신 분들은 빠르게 넘어가셔도 좋습니다. 프로그래밍 언어는 어떤 문법을 갖춰야 할까? 당신이 어떤 사람에게 일을 시킨다고 가정해보자.대개 어떻게 말할까? 뭉뚱그려서 말하면 “무엇을, 이럴 때, 이렇게 해라!” 라고 말해야 한다. 컴퓨터도 마찬가지다. ‘무엇을’을 쓰는 것에 관한 것은, ‘선언(Declaration)과 정의(Definition)’의 개념에 대해서 알아야 한다. 얘가 숫자인지, 문자인지, 변할 수 있는 것인지 아님 절대 변할 수 없는 것인지 이런 식으로 컴퓨터에게 자신이 처리해야할 데이터의 종류에 대해 알려주는 것이다. ‘어떤 조건에서’에 대해 설명하는 것은 ‘조건문’이라는 것을 활용한다. 만.. 2022. 8. 25. 10) javascript에 들어가며... 웹프로그래밍의 핵심언어라고 할 수 있는 자바스크립트(javascript, 짧게 줄이면 js라고도 부른다.)에 대해서 배운다. HTML은 웹페이지의 정보를 담고 정확히 그 정보를 나누는 역할을 했다. CSS는 웹페이지를 꾸미는 역할을 했다. 그럼 자바스크립트는 무슨 일을 할까? 이제부터 배울 이 언어는 ‘웹에 특화된 프로그래밍 언어’이다. 마크업 언어와 프로그래밍 언어의 차이점을 짧게 언급한 적이 있다. 다시 설명하면 마크업 언어의 목적은 문서구조를 명확하게 드러내기 위해서 사용하는 것이고, 프로그래밍 언어는 기계(컴퓨터)의 조작 및 제어를 위해 사용하는 것이다. 프로그래밍 언어는 다양하지만 공통적으로 이런 동일한 목적을 두고 있다. 초기 자바스크립트는 컴퓨터, 더 정확하게는 컴퓨터 안에 있는 ‘웹브라우저.. 2022. 8. 13. 9) 간단한 반응형 웹 디자인: 미디어 쿼리 반응형 웹 디자인? 반응형 디자인이란 말을 들어본 적이 있나 모르겠다. 개념은 간단하다. 사람들이 어떤 대상에 조작을 가할 때마다 그것의 모습이 변화하는 디자인이다. 웹페이지를 디자인하는 사람이라면 이러한 반응형 디자인을 염두에 두어야 한다. 특히 웹브라우저의 크기가 변화함에 따라서 웹페이지의 크기가 달라지는데 그럼 웹페이지가 전달하고자 하는 정보를 사람들에게 제대로 전달하지 못하는 경우가 생길 수 있다. 우리가 이용하는 대부분의 웹페이지는 반응형 디자인을 적용하고 있다. 예를 들어 쿠팡을 들어가보면 화면의 크기에 따라 나타내는 컨텐츠를 달리 적용하고 있는 것을 알 수 있다. 우리가 만든 웹페이지도 반응형 디자인을 간단한 수준으로 나타내볼까 한다. 그래서 활용하는 것이 미디어 쿼리(media query).. 2022. 8. 12. 8) 박스모델과 그리드 오늘은 무엇을 할 것인가? 저번에 하고자 했던 웹페이지 디자인을 마무리 지을 것이다. 이번 글에서는 박스모델과 그리드에 대해서 배우는 것이 핵심이지만, 이것을 이해하고 활용하기 위해서는 다른 여러가지 개념도 같이 배워야 한다. 다행스럽게도 크게 어려운 내용은 없으니, 하나하나 배워보자. 목차 1. 블록 요소와 인라인 요소 2. 블록 요소의 구성 3. 그리드 1. 블록 요소와 인라인 요소 먼저 저번에 한 것을 돌이켜보자. 저번에는 class와 id를 활용하는 방법을 배웠고, 이 방법을 활용해서 원하는 부분의 글자색을 바꾸고, 하이퍼텍스트의 밑줄까지 조절했다. 그리고 이번에는 배치에 관한 것을 수정할 차례이다. 사각형 상자 형태로 내용을 나누어서, 위쪽은 Web이라고 써진 부분을, 왼쪽은 리스트 부분을, 오.. 2022. 8. 12. 이전 1 2 3 4 다음
