jam 블로그

HTTP/3 2019년 9월 정도에 새로운 웹 표준인 HTTP/3에 대한 지원을 발표하였습니다. 파트 내에서 웹 로딩 및 접근 속도를 위해서 조사를 하였습니다. HTTP Protocol 발전 과정 요약 HTTP/0.9 HTTP 초기 버전에는 버전 번호가 없지만 추후 버전과 구별을 위해 붙여졌습니다. 특징 GET 메소드만 존재 HTTP 헤더가 존재하지 않음 HTTP/1.0 0.9버전에서 브라우저와 서버 모두 융통성을 가지도록 확장되었습니다. 특징 버전 정보가 각 요청 사이내로 전송되기 시작 (HTTP/1.0 GET ~) HTTP Status code가 라인 또는 시작 부분에 붙어 전송 브라우저의 요청에 대한 성공 실패 여부 확인 및 그에 따른 동작 HTTP 헤더 개념이 요청, 응답 모두에 도입 메타 데이터..

React의 전반적인 것 Created: Feb 14, 2020 4:08 PM React React는 Facebook에서 만든 SPA(Single Page Application)을 만들기 위해 고안된 언어입니다. 비슷한 것으로는 Vue, Angular가 있습니다. 설치 및 실행 # node를 먼저 설치 후 진행해야합니다. # node 설치 후 # create-react-app은 그간 설정하기 어려웠던 webpack 등을 자동으로 만들어주는 명령어 입니다. npm create-react-app project-name cd project-name # 실행 시 localhost:3000으로 가상 서버가 띄워집니다. yarn startReact 기초 해당 글은 16.12 최신 버전을 기반으로 작성하였습니다. p..

Webpack이란? Webpack은 최신 javascript application을 위한 정적 모듈 번들러입니다. 좀 더 설명하면 es6를 쓰는 javascript들을 모아서 하나의 파일로 만듭니다. 설정에 따라서 sass나 이미지 등도 bundle 시킬 수 있습니다. 주 목적은 다중 파일들을 하나로 묶어서 웹 로딩 시 파일 다운로드 되는 것들 최대한 줄여보자입니다. Webpack에 넣을 패키지들 호환성 문제가 되지 않는 선에서 최신 버전으로 설치할 예정입니다. (최신을 사랑합니다.) webpack typescript babel 설정하기 필요한 package들을 다 설치해 봅시다. # npm 대신 yarn을 설치하고 사용할 수 있습니다. # webpack 설치 npm install -D webpack w..

const, let javscript ES6 버전에서는 변수 선언시 이전 버전의 var 말고도 const, let 키워드가 추가되었습니다. let 블록 스코프 변수로써 자신을 정의한 블록에서만 접근 가능하며 블록 밖에서는 볼 수 없습니다. function letTest() { let x = 10; console.log(x); //10 if(true) { let y= 20; console.log(y); //20 } console.log(y); //Reference Error Exception } const 읽기 전용 변수, 즉 값을 다시 할당할 수 없는 상수를 선언 const도 블록 스코프 변수라 let으로 선언한 변수와 규칙은 동일 다만, 객체 자신이 아닌 참조값이 저장하므로 객체 내부는 변경 가능 fu..

destructuring assignment (해체 할당) 이터러블이나 객체의 값/프로퍼티를 각각 배열이나 객체 생성자 리터럴과 비슷한 구문으로 변수에 할당하는 표현식 // es5 var arr = [1, 2, 3]; var a = arr[0]; // 1 var b = arr[1]; // 2 var c = arr[2]; // 3 // es6 const arr = [1, 2, 3]; let a, b, c; [a, b, c] = arr; // [1, 2, 3] let [d, , e] = arr;console.logbconsole.logb console.log(d); // 1 console.log(e); // 3 let [f, ...g] = arr; console.log(a); // 1 console.log(..