TIL 날짜 및 읽은 범위
- 2023.01.18
- Ep.16 ~ Ep.21
에피소드 16 : 인터넷 익스플로러가 사라진 이유와 브라우저 엔진
인터넷 익스플로러는 CSS를 최초로 적용한 웹 브라우저
웹 브라우저의 핵심 프로그램을 '브라우저 엔진' 또는 '렌더링 엔진' 이라고 해
| 엔진이름 | 브라우저 이름 |
|---|---|
| 게코 (gecko) | 파이어폭스 |
| 웹킷 (webkit) | 사파리 |
| 블링크 (blink) | 크롬 |
엔진의 성능이 바로 웹 브라우저의 성능을 결정한다는 거지
그러니까 이 엔진이 최신 표준안, 최신 기술을 지원한다면 최신 웹 브라우저가 되는거야
인터넷 익스플로러는 점점 게을러지기 시작했어
새 버전이 나오기까지 정말 오래 걸렸는데, 이것이 보안 문제와 맞물렸거든
인터넷 익스플로러가 이러는 동안 다른 웹 브라우저는 발전했어
결국 마이크로소프트는 인터넷 익스플로러 지원을 중단 했어
에피소드 17 : 아, 쿠키가 먹는게 아니라고요?
쿠키는 여러분이 어떤 웹 사이트에 방문했을 때 브라우저를 통해 여러분의 컴퓨터에 보관하는 기록물을 말해
HTTP 는 HyperText Transfer Protocol 줄임말로, 인터넷에서 정보를 주고 받기 위한 프로토콜이야
인터넷에서 사용자와 서버가 정보를 주고 받기 위한 일종의 규칙
HTTP 에서는 우리와 서버는 항상 연결 되어 있지 않다(stateless) 는 특징이 있어
서버는 그 주소에 해당하는 데이터를 우리에게 보여주고, 데이터를 다 보내면 우리와 연결 상태를 끊고, 우리가 누구인지 잊어버려
그런데 여기서 문제가 하나 발생하지
서버는 가끔 우리가 누구인지 기억해야한다는 거야
그래서 쿠키가 필요한 거야
로그인으로 알아보는 쿠키
로그인을 하면 서버에서는 영수증 같은 것을 발행해줘
이 영수증은 여러분의 컴퓨터 어딘가에 저장돼
이후 같은 웹 사이트에 다시 접속하면 여러분이 모르는 사이에 이 영수증을 서버에 보내는 거야
그러면 서버는 이 영수증을 보고 '오! 우리가 신뢰하는 사용자 니콜라스구나!!' 하고 로근인 상태를 유지해 주는 거지
이 영수증이 바로 쿠키야!!
쿠키는 여러분이 웹 사이트에 접속할 때마다 서버에 전송되어서 서버의 기억을 되살리는 역할을 하는거야
쿠키에도 규칙이 있다고 ?
- 쿠키는 도메인 1개에만 한정한다
- 쿠키는 자동으로 보낸다
쿠키는 여러분이 원하든 원하지 않든 여러분의 컴퓨터와 서버를 왔다 갔다 할 수 있어
물론 웹 사이트를 처음 접속하면 '쿠키 수집에 동의하십니까?'라고 묻는 곳도 있지만 대부분 자동으로 쿠키를 보내 - 쿠키는 컴퓨터에 자동으로 저장된다
에피소드 18 : 프런트엔드, 백엔드?
프런트엔드 개발자, 당신은 누구인가요 ?
프런트엔드 기술은 정말 빨리 발전해서 개발자가 공부해야 할 내용이 너무너무 많거든
이게 프런트엔드 개발자의 단점이야
자바스크립트 피로 (JavaScript Fatigue) 라는 단어까지 있을 정도지!
하지만 그만큼 관련 기술이 활발히 논의되는 곳이니 기회도 많아!
그리고 여러분이 작업한 것을 바로 볼 수 있는거야
사용자와 거리도 매우 가깝지
백엔드 개발자, 당신은 누구인가요 ?
개발환경이 프런트엔드에 비해 안정적이야
하나만 배워 두면 쭉 개발할 수 있으니까
기술 선택지가 다양해!
그러나 사용자와의 거리가 멀다는거야
에피소드 19 : 서버가 뭔지 아직도 모른닥고 ?
서버는 그냥 컴퓨터야
서버는 모니터가 없는 컴퓨터! 그리고 365일 24시간 내내 인터넷에 연결되어 있어야 해
서버 크기는 저장소와 메모리 모두 어마어마해서버의 외부 모습
모니터가 없거나 1개만 있다
항상 인터넷에 연결되어 있다
저장소와 메모리 크기는 모두 어마어마하다
서버의 내부 모습은 어떻게 생겼을까 ?
사용자가 요청했을 때 네트워크에 연결된 컴퓨터가 실행하는 코드를 서버라고 생각하면 돼
서버는 여러분이 웹 사이트 주소를 입력하기를 기다렸다가 해당 주소가 입력되면 그에 맞는 웹 페이지를 꺼내서 보여 주는 코드라고 생각하면 돼
서버는 인터넷에 항상 연결되어 있으면서 사용자가 웹 사이트 주소를 입력하기를 기다리고 있어
서버는 항상 켜져 있는 컴퓨터이면서 인터넷에 연결되어 있고 접속 요청을 응답하는 컴퓨터야서버의 특징
서버는 24시간 내내 주소 입력을 기다린다
주소가 입력되면 그 주소에 해당하는 데이터를 꺼내서 보여 준다
에피소드 20 : 슈퍼 개발자만 할 수 있다, 풀스택 ?
풀스택은 프런트엔드, 백엔드, 그리고 데브롭스(DevOps)를 포함하는거야
프런트엔드 개발은 HTML, CSS, 자바스크립트, 리액트, 제이쿼리, Vue.js 등 다양한 기술을 공부
이 기술들은 모두 사용자와 상호작용하기 위한 것
백엔드 개발자는 PHP, 자바, 파이썬, 자바스크립트, C# 등 많은 언어를 공부
데브옵스 개발자는 서버를 고르고, 설정하고, 서버에 소프트웨어도 설치하고, 데이터베이스 설정도 하고, 보안도 신경 써야하고, 할 것이 엄청나게 많아
풀스택 개발자는 무조건 모든 영역을 다 개발해야 한다고 생각하는데, 할 수 있는 것과 하는 것은 엄연히 다른 거야
에피소드 21: 서버리스는 서버가 없다는 뜻 ?
서버리스는 서버 없음이 아니라 우리가 직접 관리하지 않는 서버를 의미해
서버리스가 없던 시절에는 실제 회사마다 서버를 직접 구매해서 전원을 꽂고 인터넷을 연결해서 관리해야 했어
예전에는 서버를 전부 수동으로 관리 했어
아마존의 등장으로 서버는 우리 곁을 떠났다
EC2 는 아마존 엘라스틱 컴퓨트 클라우드 (Amazon Elastic Compute Cloud)
아마존이 대신 운영해 준다는 목적으로 나온 서비스야
이런 서비스들은 하드웨어를 제공, 관리해 줄 뿐이고 서버의 소프트웨어 관리는 여전히 우리가 해야 해
서버의 운영체제 업데이트, 보안 점검, 장애 회복 시스템 구축, 데이터 백업 등 해야 할 일이 엄청 많아
바로 이때 서버리스가 등장하는거야!
서버리스, 서버 제공부터 서버의 소프트웨어 관리 그리고 더 ?
서버리스에선 함수들이 잠을 자고 있어
그리고 그 함수가 필요할 때(요청) 깨워서 요청한 작업을 수행해
그러고 나서 함수는 다시 잠이 들지
서버리스는 여러분이 등록한 함수가 실행된 만큼 돈을 내면 돼
외부에서 그 함수를 실행하는 요청이 들어오면 함수가 꺠어나서 실행되고, 그리고 무언가를 수행하면 그때 돈을 내는 거야
요청이 없으면? 함수는 잠만 잤을 테니 돈을 낼 필요가 없는 거지
서비리스의 2가지 단점
단점 1. 서비리스의 함수는 잠에서 깰 때 시간이 필요하다 : 콜드 스타트
단점 2. 서버 제공자에게 지나치게 의존한다
서버리스를 사용하고 있다면 AWS와 결혼한 것과 같아
그래서 AWS 가 마음에 들지 않는다고 해서 바로 헤어질 수 없어
사이드 프로젝트를 하는 사람이나 프로토 타입을 최대한 빠르게 출시하고 싶은 기업에게 추천해
서버리스를 배워 보고 싶다면 서버리스 프레임워크 사이트인 serverless.com 이나 AWS 람다, 구글 클라우드 펑션 (Google Cloud Function), 아펙스 (Apex), 테라폼(Terraform) 같은 상품을 둘러봐!
웹 개발자라면 꼭 알아야 하는 브라우저 익스텐션
- ColorZilla
- Momentum
- CSSViewer
- JSON Viewer
- React Developer Tools
- WhatFont
- Grid Ruler
- BuiltWith Technology Profiler
오늘 읽은 소감은?
"영원한 것은 없다. 발전하지 못 하면 도태되고 결국 세상에서 사라지는 것 같다"
"영수증으로 비유해서 쿠키를 설명해줘서 쉽게 이해할 수 있었어!"
"내가 프런트를 선택한 이유지! 나의 코드가 이렇게 멋지게 변신하는 모습을 바로 볼 수 있으니까! 너무 멋져!"
"풀스택의 의미를 정확하게 알게 되었다."
"막연하게 생각했던 서버와 서버리스에 대한 내용을 이야기 하듯이 해줘서 이해하기 편했다. 조금 더 자세하게 공부하고 싶은 호기심이 생겼다."
"강의를 보면서 궁금해서 도구들을 속 시원하게 알려주셔서 감사합니다! 바로 추가추가!!"
최애 TIL 을 찾아라
https://aytekin.tistory.com/category/TIL/TIL%20-%20%EB%85%B8%EA%B0%9C%EB%B6%81
핵심 내용을 간결하고 깔끔하게 정리해서 좋았다
https://jurepi.notion.site/TIL-2022-01-17-5-82ee4241b9764caabc9cddff0232a379
해당되는 내용의 페이지를 같이 적어줘서, 추가적인 부분이 궁금할 때 바로 찾을 수 있어서 좋았다
https://nomadcoders.co/community/thread/6499
각 에피소드 별로 정리를 잘 해서 한눈에 내용을 볼 수 있어서 좋았다
