본문 바로가기
반응형

JavaScript32

프로그래밍 (모던 자바스크립트 Deep Dive) 1.1 프로그래밍이란? 프로그래밍은 컴퓨터와의 커뮤니케이션이며 앞서 필요한 것은 아래와 같다. 요구사항 이해한다는 것은 요구사항을 분해 → 정리 → 순서에 맞게 행위 배열하는 것이다. 문제 해결 방안 정의한다는 것은 컴퓨터가 이해할 수 있도록 문제를 설명해야한다. 이때 필요한 것이 컴퓨팅 사고이다. 프로그래밍 내에서 사용될 모든 개념은 논리적으로 설명되어야 한다. 평가 기준이 없는 것은 프로그래밍에서 유의미하지 않다. 1.2 프로그래밍 언어 우리는 컴퓨터에게 문제를 해결하기 위해 명령을 내려야한다. 그때 필요한 언어는 기계어이다. 기계어를 배워 컴퓨터에게 전달하기에는 어려운 일이기 때문에 우리는 프로그래밍 언어를 사용한다. 이는 사람이 이해할 수 있게 약속된 문법의 형태의 인공언어이며 Syntax(문법).. 2024. 4. 15.
ESM (ES Module) feat. Vite JS 파일은 브라우저에서 해석될 수 없다. 모듈은 모듈 스코프를, 변수/함수 스코프를 통해 서로의 파일이 오염되지 않도록 하는 장점이 있다. import, export 를 활용한다. ES6부터 모듈 기능을 제공하기 시작했다. 하지면 IE는 여전히 지원하지 않는다. entry 파일을 기준으로 import한 파일들을 찾아가며 의존성 그래프를 그린다. ES module이 동작하려면 브라우저에서 사용가능하도록 module record라는 데이터 구조로 변환해야한다. 이 변환 과정은 ES6 명세가 아닌 HTML 명세를 따라 구문 분석을 한다. (브라우저 한정) 이런 모듈화 작업은 구성 → 인스턴스화 → 평가 단계로 진행된다. 구성단계에서는 로더가 파일을 불러온다. 파일을 모듈 레코드로 구문 분석한다. 로더는 모듈.. 2024. 4. 15.
브라우저 캐시 캐시는 브라우저에서 서버에 최초 요청 이후 로딩을 더 빠르게 하기 위한 장점이 있다. 그러나 요청에 의해 캐시가 저장되면 이후 변경 내용이 있어도, 사용자 브러우저의 캐시에 의해 캐시를 지우기 전까지 변경 내용의 수정이 일어나지 않을 수 있다. 우리는 header의 cache-control 태그를 이용해 max-age 속성으로 캐시의 수명을 지정할 수 있다. 말만 들으면 max-age=60 으로 설정해놓으면 60초 동안 캐싱된 데이터를 사용하고, 그 이후는 캐싱된 데이터를 사용하지 않고 새 응답을 받는 것 같다. (200을 받을 것같으나) 하지만 이것은 명확한 캐시 수명이 아니다. 60초 이후에도 브라우저는 캐싱된 데이터를 확인하며 캐싱된 데이터가 있다면 304 Not Modified 응답을 준다. 결국.. 2024. 4. 15.
엄격하게 commit 하기 (husky, commitlint, lint-staged) Conventional Commit commit 메시지의 규칙 모두 같은 규칙을 사용하며 커밋의 변경 및 수정사항, 기능 구현 등을 명시적으로 표현할 수 있다 커밋을 통한 히스토리도 파악할 수 있다 conventional commit 문서에서 커밋 규칙을 더 자세하게 알 수 있다 husky convential commit을 따르기 위해 node.js 패키지 중 하나인 husky를 사용해 git hooks를 관리할 수 있다 방법 1. husky 설치 npm install --save-dev husky 2. husky 초기화(추천) ./husky/pre-commit을 생성하고, package.json에 prepare 명령어를 추가한다 npx husky init 3. lint-staged 설치 linting .. 2024. 4. 15.
728x90
반응형