10장 웹 콘텐츠에서 사용하는 기술 10.1 HTML 10.1.1 웹 페이지의 대부분은 HTML로 되어 있다. HTML은 웹 상에서 하이퍼텍스트를 보내기 위해 개발된 언어다. 하이퍼텍스트는 문서 시스템의 하나로서, 문서 중에 임의의 장소의 정보가 다른 정보에 관련된 즉 링크되어 있는 문서를 의미한다. HTML로 쓰여진 문서를 브라우저가 해석해서 렌더링 된 결과를 우리가 보게 된다. 10.1.2 HTML 버전 HTML1.0: 1993년에 일리노이 대학의 NCSA에서 모자이크라는 브라우저가 발표되었는데 이 브라우저가 해석할 수 있는 HTML의 사양이다. HTML4.0: 1999년 12월에 W3C라는 조직에 의해 출시되었다. HTML5: 2014년에 정식으로 권고안이 발표되었다. 10.1.3 디자인을 적용하는..
9장 HTTP에 기능을 추가한 프로토콜 9.1 HTTP를 기본으로 하는 프로토콜 HTTP의 규격이 만들어졌을 때는 주로 HTML을 주고 받는 용도로 생각했기 때문에 스펙이 간단한 편이었지만, 최근에 용도가 달라지면서 새로운 기능들이 필요해졌다. 9.2 HTTP의 병목 현상을 해소하는 SPDY Google은 2010년에 HTTP의 병목 현상을 해소하고 웹 페이지의 로딩 시간을 50% 단축하는 목표를 세운 SPDY가 있었다. (결과적으로 SPDY와는 폐기되었고 HTTP/2를 지원하는 것으로 결정했다) 9.2.1 HTTP의 병목 현상 트위터같은 사용자가 많은 실시간 서비스를 구현하기 위해서는 HTTP 사양은 한계가 있었다. 1개의 커넥션으로 1개의 리퀘스트만 보낼 수 있다. 리퀘스트는 클라이언트에서만 시작할 ..
치킨 가격 비교 및 개인 취향별 치킨 추천 서비스인 ‘딱너닭’ 앱을 출시했어요. 실제로 스토어에 앱을 올린지는 꽤 되었지만, 앱을 출시하고 한동안 업데이트를 하지 않았었는데요. 2024년부터 다시 팀원분들과 작업을 하기로 계획해서 이렇게 블로그에 글을 작성해보았습니다. 지금 당장은 부족한 부분이 많지만 조금씩 그리고 안정적으로 많은 기능들을 추가해보려고 해요. - App Store: https://apps.apple.com/us/app/%EB%94%B1%EB%84%88%EB%8B%AD/id6466733757 - Google Play: https://play.google.com/store/apps/details?id=com.ddakyoudak&pli=1
최근에 프론트엔드 개발자로 일하고 계신 루쏘님에게 코드 리뷰 멘토링을 받았습니다. 코드 리뷰 멘토링에 대한 설명 글은 아래 링크에서 확인하실 수 있습니다. https://artvelop.vercel.app/23 처음에는 인프런에 스터디 게시판을 보고 알게 되었는데요. 좋은 기회라고 생각해서 빠르게 연락을 드렸고 이틀만에 과제를 진행해서 코드 리뷰를 받게 되었습니다. 리뷰 받았던 과제는 아래 링크로 확인하실 수 있습니다. https://github.com/Seung-wan/codereview-react/pull/1 코드 리뷰를 위한 과제도 정성스럽게 준비해주셔서 재밌게 작업할 수 있었는데요. 나중에 코드 리뷰를 할 때 알아차렸는데 제가 피그마 디자인 시안을 잘못 보고 개발했던 컴포넌트가 있어서 조금 아쉬웠..
개발자로서 일을 하면서 많이 배우고 다양한 감정을 느꼈던 23년이 된 것 같아요. 24년에는 하루도 빠짐없이 어제의 '나'보다 성장하는 사람이 되려고 해요. 많은 것들을 배우고 지식들을 연결시키며 더 많은 생각들을 할 수 있으면 좋겠어요. 23년에는 아래와 같은 일들이 있었던 것 같아요. 풀스택으로 개발하기 2023년 상반기에는 회사에서 풀스택으로 개발을 시작했어요. JavaScript 기반으로 프론트엔드와 백엔드 기술 스택이 이루어져 있어서 큰 문제없이 바로 개발을 할 수 있었어요. Express, Nest 프레임워크로 어드민 서버와 히어로즈 네버 다이라는 게임의 서버 개발을 했어요. 기존에는 사이드 프로젝트 선에서만 서버 개발을 했었는데 실제로 프로덕션에서 개발을 하게 되니 코드의 안정성이나 동시성 ..
8장 누가 액세스하고 있는지를 확인하는 인증 8.1 인증이란? 아래와 같은 정보들로 인증을 할 수 있다. 패스워드 원타임 토큰 전자 증명서 바이오 매트릭스 IC 카드 HTTP에서 사용하는 인증 방법 BASIC DIGEST SSL 클라이언트 폼 베이스 8.2 BASIC 인증 리퀘스트에 인증이 필요한 경우 401과 함께 인증 방식과 Request-URI의 보호 공간을 식별하기 위한 문자열을 WWW-Authenticate 헤더 필드에 포함해서 리스폰스를 반환한다. 클라이언트는 ID와 패스워드를 콜론으로 연결한 문장을 Base64 형식으로 인코드하여 Authorization 헤더 필드에 포함해서 보낸다. 서버는 인증 정보가 정확한지 판단한다. 8.3 DIGEST 인증 챌린지 리스폰스 방식이 사용되고 있다. 최초..
7장 웹을 안전하게 지켜주는 HTTPS HTTP는 약점이 있다. 평문 통신이기 때문에 도청 가능 통신 상대를 확인하지 않기 때문에 위장 가능 완전성을 증명할 수 없기 때문에 변조 가능 7.1.1 평문이기 때문에 도청 가능 HTTP는 암호화 기능이 없기 때문에 평문으로 메시지를 보낸다. 따라서 통신 경로의 도중에 패킷을 수집하여 도청할 수 있다. 암호화로 도청을 피하는 방법 통신 암호화 SSL(Secure Socket Layer)이나 TLS(Transport Layer Security)라는 다른 프로토콜을 조합함으로써 HTTP의 통신 내용을 암호화할 수 있다. SSL을 조합한 HTTP를 HTTPS라고 부른다. 콘텐츠 암호화 콘텐츠의 내용 자체를 암호화해 버리는 방법이다. 7.1.2 통신 상대를 확인하지 않..
6장 HTTP 헤더 6.1 HTTP 메시지 헤더 메시지 헤더: 클라이언트와 서버 처리에 필요한 주요 정보가 거의 다 여기에 있다. 메시지 바디: 사용자와 리소스를 필요로 하는 정보가 있다. HTTP 프로토콜의 리퀘스트와 리스폰스에는 반드시 메시지 헤더가 포함되어 있다. 메시지 헤더는 클라이언트나 서버가 리퀘스트나 리스폰스를 처리하기위한 정보가 들어있다. 리퀘스트의 HTTP 메시지 메소드, URI, HTTP 버전, HTTP 헤더 필드 등으로 구성되어 있다. 리스폰스의 HTTP 메시지 HTTP 메시지와 HTTP 버전, 상태 코드(코드와 설명), HTTP 헤더 필드 등으로 구성되어 있다. HTTP 요청에서 가장 다양한 정보를 가지고 있는 것이 HTTP 헤더 필드다. 6.2 HTTP 헤더 필드 6.2.1 HTT..
