0719-TabTab

intro

오늘은 진짜 진짜 Tab 개발을 좀 하자

오늘 할 일

  1. NextStep [4][…]
  • tab 개발
    — Ajax 삽질 … -open-send set !!! [2]
  • 크롱리뷰 정리
    – 비동기 강의 -> 열리는 데로 복습
    —- promise
    — generator
    — async await
  1. 러버덕 스터디 [2]
  • 브라우저가 웹 페이지 요청하고 받는 과정 설명 공부
  1. 알고리즘 스터디 quick sort 구현 [1.5]

  2. 코드스피츠 강의 듣고 공부 [3]
    — iterator & generator

오늘도 이상하게 … 그냥 앉아만 있었던 기분을 지울 수가 없다. 하아… 그냥 tab 데모 요청 그거
xhrhttpRequest.open()
xhrhttpRequest.send()

하기 싫을 떈 하지 말자 ! …끝 이상하게 오늘은 공부가 너무 하기 싫다 ㅜ
아니 어제부터 … 겁나 안됨

오늘의 잘한 점 아쉬운 점

잘한점은 … 꾸역 꾸역 블로그의 정리하고 있는 점

아쉬운 점

집중력 제로
크롱에게 나중에 물어봤지만 사람들에게 여기 저기 안되는 것들은 물어봤다.
맹선생님도 이용 좀 해야 되는데 내가 공부를 해야 질문하는데 ;;;

코드스쿼드 비동기 수업

비동기에는 뭐가 있을까?

콜백 교집합으로 비동기가 있는 건데 ;;; 콜백이라고 잘 못 대답했다 바보

애니매이션
xhr-ajax 통신
indexedDB
cache
api

메인스레드/멀티스레드 이벤트 루프

기존 promise 패턴 try catch {} bracket 타고 타고 들어가는 문을 좀 더 깔끔하게 정리해줄 수 있다.
.then .then 다음 다음

  • promise
  • async/await
  • generator 막강 리모컨

프로미스 all 3 개중 하나 오는 걸로

XHR + Promise-> Fetch
기존 ajax 통신 설정하는 것을 보다 깔끔하고 promise 문법을 제공해줘서 사용하기 편하게 한 것 => Fetch (native api es6)/ axios
Fetch mode header cors 설정을 통해서 데이터 전송 cors 문제 해결 등등 여러가지를 할 수 있다.

비동기에서 신경 써서 설계 해야 하는 대표적인 것들

  1. 예외처리
  2. 서버응답 처리
  3. 세션 처리

쿠키.세션.id , credential 설정 origin
Using fetch default 로 서버에서 쿠키를 받지 않는다. 서버 라우팅
cf) axios 중간처리 요청 취소 같은 기능을 제공해줘서 인기를 많이 끌고 있다.

Promise.prototype.finally 마지막에 처리하는 것
에러처리 /test/detail 옵션

마이크로 스택 큐/ 매크로 스택 큐

마이크로 큐가 먼저 실행됨 promise.then 같은 애들 순서가 정해져있다. 바로 바로 비동기 중에서도 등급이 있었다 !

xhrHTTPRequest

xhr breakPoint
Cors 백엔드에서 처리 헤더 /Jsonp

Error 처리가 중요 !!

Form-data 파일 업로드

credential

fetch

axios

generate 동기적 외부와 협력으로 비동기 제어 리덕스/사가

프레임워크##
상호/협력적인 코루틴 패턴

코드스피츠

iterator 와 Generator
함수 지역변수 다신 자기 영역 아닌 것을 쓸 수 있는게 자유변수고
닫힐 때 클로저