웹 기초 개념 정리

2. 인터넷상에서 서버와 클라이언트가 hypertext 파일을 주고 받기 위해해 표준화된 규칙 | 1. Hypertext(하이퍼 링크) - 웹페이지에서 렌더링 가능한 텍스트 버튼
3. hypertext를 포함하는 파일이 → HTML (hypertext markup language) | | HTTP message | 일반 문서를 뛰어넘는 구조화된 텍스트를 전송하기 위해 클라이언트가 통신할때 사용하는 메세지 | | | HTTP header | 3분분으로 나뉘는(Start line, http header, entity header) 전체 http 메세지의 내용을 요약해놓은 부분 | - Start line: Get/Post 와 같은 http 메서드 형태, 서버의 주소, HTTP의 버전, Statu코드를 포함. | | HTTP 메서드 | 웹 서버에게 어떤 작업을 수행하길 원하는지 알리는 방법을 정의하는 명령 규칙 | put과 patch 차이: put은 전체적인 수정이 필요할 때 사용, patch는 전체의 부분적인 수정이 필요할 떄 | | HTTP Status 코드 | 다양한 응답을 통일된 큐칙으로 전송하기 위해 | 200: 요청을 성공했고 body에 응답 데이터도 왔을 때 201: 새로운 리소스가 성공적으로 생성됨 (게시글 등록) 204: 오청을 성공했으나 별도로 body에반환할 데이터 없을 때 (게시글 업데이트)

301: 웹사이트 주소가 변겨오디었을 때 302: 일시적인 페이지 주소 이동

400: 클라이언트쪽 데이터 형식 잘못 구현했을 떄 401: 로그인하지않고 회원만 볼 수 있는 행위 할 때 403: 권한 없는 요청 보냈을 때 404: 요청한 데이터 서버에서 없을 떄

500: 요청이나 데이터에 문제 없지만 서버에서 예상치 못한 문제가 발생 했을 때 503: 과부하로인해 일시적으로 서버를 사용 불가능할 때 | | HTTPS | HTTP의 전송 계층에 인증과 암호화를 적용해 보안을 강화시킨 통신 규약 | SSL, TLS 인증서를 성치하여 HTTPS를 활성화 할 수 있다. | | Node | 데이터 통신망에서, 데이터를 전송하는 통로에 접속되는 하나 이상의 기능 단위 | | | javascript | 웹 프로그램을 동적으로 만들기 위해 사용되는 프로그램 언어 | | | Node.js | 어디에서나 javascript를 사용할 수 있도록 하는 런타임 환경 | 자바스크립트로 코드를 작성하고 프론트 서버를 구축할때 Node.js를 사용한다 | | package.json | javaScript 프로젝트의 설정과 의존성을 명세하는 파일 | | | Pm2 | Node.js 기반의 프로젝트를 안전적이고 편리하게 배포하고 관리하기 위한 것 | | | URL | 통합 자원 탐지기 | | | URL의 Query string | 1.url의 끝부분에 있는 key=value 형태의 파라미터 값 2. 클라이언트가 서버에 추가 정보를 전달하기 위해 사용하는 문자열 | | | URL의 Path varialble | 1. URL의 경로 부분에 포함되어 특정 자원을 식별하는 변수 | 특정데이터를 접근할 때 사용된다 | | SQL | 데이터베이스 시스템에서 자료를 처리하는 용도로 사용되는 구조적 데이터 질의 언어 | | | 관계형 데이터베이스 | 테이블(컬럼,행)로 관리하는 데이터 베이스 | | | 정규화 | 데이터의 중복을 최소화하도록 구조하는 프로세스 | | | bcrypt | blowfish 알고리즘을 기반으로 한 단방향 암호화 해시 함수 | salt과 saltRound를 더해서 보안은 강화 할 수 있다 | | Connectionless | 클라이언트가 서버에 요청을 하고 응답을 받으면 그 즉시 연결을 끊는다. | 각 요청이 서로 독립적으로 처리되어 서버가 많은 클라이언트를 처리 가능하다 | | 인증 | 사용자의 신원을 확인하는 과정 | 로그인 | | 인가 | 인증된 사용자에게 접근 권한을 부여하는 과정 | 권한 부여 | | 세션과 JWT토큰 | 특정 인증서와 같은 문서를 통해 본인을 인증하는 방식 | 세션에는 공개되면 문제되는 정보를 저장한다 | | 쿠키 | 사용자의 정보가 저장되는 파일 | - 공개되도 괜찮은 파일들이 저장됨

• 세션, 토큰, 쿠키 서로 정확한 관계?

1. 세션(Session): 서버에서 사용자 상태를 관리하며, 주로 쿠키를 통해 세션 ID를 전달.

2. 토큰(Token): 클라이언트에서 상태를 저장하며, 주로 JWT를 사용하여 서버에서 인증.

3. 쿠키(Cookie): 클라이언트가 데이터를 저장하는 방법으로, 세션 ID 또는 JWT를 저장하는 데 사용. | | 프레임워크 | - 내가 만들고 있는 앱의 기반이 되는 프로그램

• 일관성 제공: 프레임워크의 규칙과 패턴을 제공 | 개발을 어떻게 할 것인지 지침과 틀을 제공 | | 라이브러리 | - 내가 만들고 있는 앱에 추가할 수 있는 기능이 있는 프로그램
• 전문성 제공: 해당 문야의 고품질의 기능을 제공하며 지식이 약해도 고품질의 기능을 구현하게 함 | 개발자가 할 수 있는 수단과 도구를 제공 | | API 문서 | API를 사용 방법을 설명하는 문서 | | | 명세서 | 라이브러리나 프레임워크의 구조를 상세히 설명하는 문서 | | | REST API | Rest: 자원을 이름으로 구분하고, 해당 자원의 상태 정보를 주고받는 모든 것
• Rest 아키텍처 스타일을 따르는 응용프로그램 인터페이스 | 사용 이유: 개발자간 일관된 규칙을 제공함으로써 업무 효율을 높이고, 단순한 URL 구조를 통해 요청의 목적을 쉽게 파악할 수 있도록 하기 위해서. 3가지 주된 장점: 클라이언트-서버 분리 가능하게 함, 데이터의 명확한 표현이 가능하다, 이해하기 쉬운 API 제공 | | MVC 패턴 | 해당 패턴으로 사용자에게 보여지는 부분(인터페이스)과 데이터를 처리하는 부분이 명확하게 구분이 되서 부하 관리하기 쉬운 구조를 갖추게 되었다. | | | DOM | HTML 코드가 브라우저에 의해 파싱되어 메모리 상에 객체 형태로 구성된 구조 | - 웹페이지가 사용자와 상호작용하면서 실시간으로 변화하는 동적인 웹 경험을 가능하게 하는 핵심
• DOM을 자바스크립트로 조작할 수 있다.
• CSSOM 웸트리와 DOM트리와 결합하여 최종적으로 웹페이지의 렌더링을 담당한다. | | Fetch | 서버에게 데이터를 비동기적으로 요청하고 수신하는 과정 | - 서버로부터 실시간으로 데이터를 받을 수 있다
• 비동기: 페이지를 새로고침 안해도 서버와 데이터를 주고 받을 수 있다 | | lottie | JSON 기반의 애니메이션 파일 제공하는 서비스 | - 애니메이션을 이미지처럼 쉽게 사용가능 | | SEO | 웹 사이트를 검색 엔진에서 더 잘 찾을 수 있도록 최적화하는 기술 | |