[Nomad Coders] IT 5분 잡학사전 #05

TIL(2023. 10. 11)

DAY4

📖 오늘 읽은 부분 : 에피소드 16 ~ 에피소드 21

---

💡 풀스택(full stack) 개발자 : 프런트엔드, 백엔드 그리고 데브옵스(DevOps)를 다 포함한 개발자.

에피소드 16 인터넷 익스플로러가 사라진 이유와 브라우저 엔진

에이젝스(Ajax, Asynchronous JavaScript and XML) : 웹 사이트에서 어떤 내용을 업데이트 하면 새로고침으로 확인해야하는데 그 과정 없이 업데이트한 내용을 볼 수 있게 해주는 기술.

브라우저가 이해해야 할 언어 3가지

1. HTML
2. CSS
3. JavaScript

웹 브라우저의 핵심 프로그램 : '브라우저 엔진' 또는 '렌더링 엔진'

엔진 이름	브라우저 이름
게코(gecko)	파이어폭스
웹킷(webkit)	사파리
블링크(blink)	크롬

에피소드 17 아, 쿠키가 먹는 게 아니라고요?

HTTP : HyperText Transfer Protocol, 인터넷에서 정보를 주고받기 위한 프로토콜
서버와 항상 연결 되지 않다(stateless)
*서버는 데이터를 보내 준 곳을 기억하지 못해서 쿠키가 필요하다.
쿠키 : 어떤 웹 사이트에 방문했을 때 브라우저를 통해 나의 컴퓨터에 보관하는 기록물
웹 사이트에 접속할 때마다 서버에 전송되어 서버의 기억을 되살리는 역할
규칙
1. 쿠키는 도메인 1개에만 한정한다.
2. 쿠키는 자동으로 보낸다.
3. 쿠키는 컴퓨터에 자동으로 저장된다.

에피소드 18 프론트엔드, 백엔드?

프런트엔드 : 모든 프로그램의 가장 앞, application 또는 웹 사이트에서 실제로 사용자가 사용하는 화면.
=> 사용자가 보는 인터페이스.
기술의 변화 속도가 빠르다. => 공부해야할 내용이 많다
내가 입력한 내용을 바로 볼 수 있다.

백엔드 : 모든 프로그램의 가장 뒤, 데이터베이스나 라우터와 같은 곳을 책임지는 부분.
=> 눈으로 볼 수 없지만 실제로 사용해야하는 기능. (ex. 계정 생성, 동영상 업로드, 댓글 저장 기능 ...)
개발 환경이 안정적이다.
기술 선택지가 다양하다. (ex. 자바, 루비, 장고, 파이썬, 플라스크 등..)
사용자가 거리가 멀어져 흥미가 떨어질 수 있다.

에피소드 19 서버가 뭔지 아직도 모른다고?

서버(server):
외부 모습

• 모니터가 없는 컴퓨터
• 365일 24시간 내내 인터넷에 연결되어있어야한다.
• 서버 크키는 저장소와 메모리 모두 크다.

내부 모습

• 주소가 입력되면 해당 주소에 맞는 웹 페이지를 보여 주는 코드

에피소드 20 슈퍼 개발자만 할 수 있다, 풀스택?

풀스택(full stack) 개발자 : 프런트엔드, 백엔드 그리고 데브옵스(DevOps)를 다 포함한 개발자.

데브옵스(DevOps) :
소프트웨어의 개발(development)와 운영(operations)의 합성어.
소프트웨어 개발자가 정보 기술 전문가 사이에 소통, 협업, 통합을 강조하는 개발 환경이나 문화를 말한다.
=> 서버선택 및 설정, 서버에 소프트웨어도 설치, 데이터베이스 설정, 보안 관리 등

취업시 주의사항

• 백엔드로 node.js를 사용? 파이썬 사용?
• 데브옵스는 할 수 있지만 개발에 더 집중하고 싶다. 개발 프로세스에 대해 알기
• 팀원이 몇명인지

에피소드 21 서버리스는 서버가 없다는 뜻?

서버리스(serverless) : 서버가 없는게 아니라 개발자가 직접 관리하지 않는 서버.
아마존의 등장 : EC2 서비스
EC2 : 아마존 엘라스틱 컴퓨트 클라우드(Amazon Elastic Compute Cloud)
=> 서버를 아마존이 대신 운영해준다는 목적을 가진 서비스
=> 수동 관리로 위한 정전 또는 각종 사고를 대비하여 안전하게 제공, 관리해주는 서비스

1. 소프트웨어(백엔드 코드)를 작은 함수 단위로 쪼갠다
2. 서비스(서버)에 등록 이 함수들은 항상 깨어있지 않는다
3. 함수가 필요할 때 요청하면 요청한 작업들을 수행한다.
   효율성이 좋다

단점

1. 서버리스의 함수는 잠에서 깰 때 시간이 필요하다 : 콜드 스타트
2. 서버 제공자에게 지나치게 의존한다.

서버리스를 사용하면 좋은 사람

• 사이트 프로젝트를 하는 사람, 프로토타입을 최대한 빠르게 출시하고 싶은 기업.

서버리스 프레임워크 사이트 :
severless.com, AWS 람다, 구글 클라우드 펑션(Google Cloud Functions), 아펙스(Apex), 테라폼(Teraform)

웹 개발자라면 꼭 알아야하는 브라우저 익스텐션

1. ColorZilla(컬러질라) : 웹 사이트의 특정 부위 색상을 알려준다.
2. Momentum(모멘텀) : 브라우저 창을 열 때마다 멋진 풍경이나 그림이 배경으로 나타나고 인사말을 건네주는 서비스, 할 일도 적어 놓을 수 있다.
3. CSS VIewer : CSS element를 확인할 수 있다.
4. JSON VIewer : JSON 파일을 아름답게 보여준다.
5. React Developer Tools : 리액트 관련 정보를 볼 수 있게 해주는 도구.
6. WhatFont : [마우스 오른쪽 클릭 -> 검사 창 열기 -> 폰트 찾기]
7. Grid Ruler : 웹 사이트에서 줄자를 사용할 수 있게 해주는 익스텐션
8. BuiltWith Technology Profiler : 웹 사이트가 어떤 기술로 만들어졌는지 알려 주는 익스텐선

---

🐣 느낀 점

지금은 비록 아직 프론트엔드를 공부중인 아주 부족한 학생이지만 한개 한개 도구들을 알고 용어들을 알면서 한 걸음씩 나아가고 있는 기분이다. 슈퍼 개발자가 되는 그 날까지.. 꾸준히 더 열심히 공부하고 싶어진다. ..
브라우저 익스텐션 다 설치했다.. 얼른 빨리 사용해보고 싶다.. 두근두근

---