[111일차] 그동안 배운 내용 개념 정리 (웹통신, 비동기)

Before you die 프로젝트 관련 질문 : 채팅 내용 db 에 담기 ? 그리고 ex) 100개 이상은 자동삭제되게 !? - 메모리 어떻게 쓰는건지 

 

 

 

 

 1교시 : 모듈 vs 패키지 vs 라이브러리 vs 프레임워크 

https://blckchainetc.tistory.com/313

모듈 vs 패키지 vs 라이브러리 vs 프레임워크

 

 

---

 

 

2 교시 : 웹통신 

같은 언어를 사용해도 구동하는 곳에 따라 결과물이 다름 ex. node.js

 

req, res = 컴퓨터들 간의 대화 = 프로토콜 

규격이 정해진 text file을 보내주는 게 = request (web server가 이를 해석함) 

블록체인도 http 규약을 대표적으로 사용 (ex. 지갑에 요청 등등...) 

http 통신 (= port 80 으로 약속함) 

header : 요청에 대한 데이터 타입 / 전역변수 설정 / 보안 설정 / 기본 정보들을 계속적으로 담고 싶을 때

ex. cookie : 브라우저가 계속 담고 있는 것 - 브라우저가 전역변수를 계속 저장하고 싶을 때 -> body가 아닌 header에 넣음 -> 요 내용들이 cookie임 (로그인 했을 때 쿠키값 확인) 

web server -> header로 받은 내용은 그대로 돌려줌 

header 그대로 돌려주기 

 

 

Restful API (웹서버 안에 있는 개념 )

API = 요청, 응답을 보낼 때 json 형태로 보내는 것

header에 body 데이터의 어떤 형태가 담기는지 씀 -> Content-Type:'application/json' 요런거 ! 

 

 

---

 

 

3교시 : 동기 vs 비동기 

 

동기

: 브라우저로 요청 보내는 것 

한 번의 요청 -> 한 번의 응답

브라우저가 요청을 보낼 수 있는 방법은 -> 도메인 창 + Enter only ! 

 

 

비동기 

: JS로 요청 보내는 것 (js 로 Request Message 를 만듬 ex. url, header, body..... 요런거 만들었음!) 

ex) Fetch(내장패키지) , Axios (개발자가 만든 패키지) 

 

 

 

 

언어를 해석하는 방식이 다르다 -> JS 는 브라우저가 해석 / python 은 특정 프로그램이 해석 

python -> 내 마음대로 멈추는게 가능 / JS는 멈추는게 불가능 (Single Thread ! )

* single thread - 코드가 돌아가는 곳이 한 곳 뿐

* multi thread - 코드가 돌아가는 곳이 여러 곳 ! (ex. python) 

 

 

 

 

 

예전에 쓴 글 

https://blckchainetc.tistory.com/71

Router, 라우터란? API란? AJAX란? 비동기란? 특징과 장점들

 

 

 

React, 리액트 (프론트앤드) 

프레임워크 (폴더트리 有, 다른 여러개의 패키지를 넣어서 만든 것) 

 

Webpack - 우리가 직접 셋팅 

Create React App (CRA) - 기본 셋팅

리액트의 주 목적 : SPA (Single Page Application) 을 만들 때 유용 

- 데이터(상태)가 바뀌면 화면(컴포넌트)이 바뀐다. 

 

 

---

 

 

4교시 : 우리가 지난 몇 달 동안 한 개념 정리 

 

리액트 에서 node.js 를 쓴 이유

Node.js  JSX (JavaScript + XML) 

<button></button> 이러한 html 문법을 JS가 해석할 수 없음 -> babel package 다운하면 해석할 수 있음! 

단점 : 한 파일에 클래스 / 함수형 컴포넌트들이 쌓이게 됨. -> 간단하게 실행시킬 수 있게끔 -> webpack settings (return 1html, 1 js file)  

webpack 안에 DevServer라는 패키지를 다운 -> 자동 build (hot load) => 순전히 개발을 위함 

-> nginx 사용해서 실제 배포를 함 

 

 

 

사용자 - 클라이언트 관계

 

사용자 : 사람

클라이언트 : 보는 화면 UI  (브라우저, 어플리케이션 etc..) 

 

 

 

 

블록체인 

앞으로 배울 것 : coin 블록 만들기,  mining