일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
- 투포인터
- 타입 좁히기
- Jest
- Promise
- map
- 결정 알고리즘
- Cypress
- 태그된 유니온
- 이분 검색
- 반공변성
- 공변성
- 무한 스크롤
- TS
- RTK Query
- CI/CD
- 인터섹션
- 호이스팅
- React
- tailwind
- ESlint
- dfs
- async/await
- CORS
- useAppDispatch
- app router
- 리터럴 타입
- webpack
- autosize
- recoil
- SSR
- Today
- Total
목록분류 전체보기 (510)
짧은코딩
HTTP API API URI를 설계할 때 가장 중요한 것은 리소스 식별이다. 만약 회원을 등록, 수정, 조회하면 이때 리소스는 회원이라는 개념이다. 따라서 리소스를 식별하고 그 리소스를 대상으로 하는 행위를 분리하면 된다. 예를 들면 리소스는 회원이고 행위는 조회, 등록, 삭제, 변경이다. 메서드 종류 주요 메서드는 get, post, put, patch, delete가 있다. 자주 사용하지 않는 메서드로는 head, options, connect, trace가 있다. GET get은 리소스를 조회할 수 있다. 보통 서버에 전달하고 싶은 데이터는 query(쿼리 파라미터, 쿼리 스트링)으로 전달을 한다. get도 메시지 바디를 통해 데이터를 전달할 수 있지만 실무에서는 get에 body를 넣지 않는다...
타입스크립트는 단순히 값만 가지고 타입 추론을 하지 않고 문맥까지 본다. 하지만 문맥까지 고려하면 추론이 이상해질 수도 있다. 이상한 에러 -에러 코드 type Language = 'JavaScript' | 'TypeScript' | 'Python' function setLanguage(language: Language) { /* ... */ } setLanguage('JavaScript') // OK let language = 'JavaScript' setLanguage(language) // ~~~~~~~~ Argument of type 'string' is not assignable // to parameter of type 'Language' 여기서 language의 타입 추론은 string으로 ..
비동기와 async 과거에는 비동기를 하기 위해 콜백 지옥을 겪었다. 이후에 "Promise"와 "async와 await"이 등장해 콜백 지옥을 해결했다. await는 각 Promise가 처리(resolve)될 때까지 기다려준다. try/catch를 이용해 예외 처리도 가능하다. 타입스크립트 컴파일러는 async와 await이 동작하도록 정교한 변환을 수행한다. 즉, TS는 런타임에 상관없이 async/await을 사용할 수 있다. 콜백보다 프로미스를 사용해야 하는 이유 1. 콜백보다 프로미스가 코드를 작성하기 쉽다. 2. 프로미스가 타입 추론에 유리하다. -Promise 예시 async function fetchPages() { const [response1, response2, response3] =..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/tpOXw/btr2D9NZhBg/a4aT3Qz8D5UIu2uYKYZ8t1/img.png)
타입스크립트의 타입은 일반적으로 변하지 않는다. 타입스크립트에서 객체를 생성할 때는 여러 속성을 한 번에 생성하는 것이 타입 추론에 유리하다. 잘못된 타입 할당 const pt: Point = {} // ~~ Type '{}' is missing the following properties from type 'Point': x, y pt.x = 3 pt.y = 4 이 코드는 pt가 맨 처음 값을 기준으로 타입이 추론되어 에러가 난다. 좋은 타입 할당 -객체를 한번에 정의 const pt = { x: 3, y: 4, } // OK 이렇게 한번에 정의하면 타입 문제를 해결할 수 있다. -타입 단언문(as) 사용 interface Point { x: number y: number } const pt = {} ..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bJ7kUk/btr2sGZSBZ3/kPgQwknvBRysnDK4AisbI1/img.png)
HTTP(HyperText Transfer Protocol) 현대 http는 1.1 버전에서 나온 기능을 많이 사용한다. 현재 나와있는 http2, http3는 모두 http 1.1 버전 기능의 성능을 높인 것이다. http2까지는 TCP 위에서 동작한다. 하지만 HTTP3는 UDP를 기반으로 개발을 하고 있다. 그 이유는 TCP가 3-way hand-shake를 하기 때문에 속도가 느리고 데이터가 너무 많아서 빠른 메커니즘이 아니기 때문이다. TCP는 이미 많이 설계가 되어 있어 수정이 불가능한데, UDP는 수정이 가능하여 새로 설계하여 http3을 개발하고 있다. HTTP 구조 HTTP 메시지 구조는 위 사진처럼 되어 있다. 3번째에 있는 공백 라인은 데이터가 없어도 무조건 있어야 한다. -HTTP ..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/0ctfB/btr2aIbPant/HspHMk7OIJ503XyduU1GAK/img.jpg)
타입 넓히기 런타임 시 모든 변수는 유일한 값을 가진다. 하지만 타입스크립에서는 코드를 정적 분석하는 시점에서 변수는 가능한 값들의 집합인 타입을 가진다. 즉 타입을 명시하지 않으면 타입 체커는 할당 가능한 값들의 집합을 유추한다. 이러한 과정을 타입 넓히기(widening)이라고 부른다. 타입 넓히기의 문제점 -실행은 되지만 에디터에 오류가 나는 코드 interface Vector3 { x: number y: number z: number } function getComponent(vector: Vector3, axis: 'x' | 'y' | 'z') { return vector[axis] } let x = 'x' let vec = { x: 10, y: 20, z: 30 } getComponent(ve..
-문제 사이트 https://school.programmers.co.kr/learn/courses/30/lessons/72414 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 코드 function solution(play_time, adv_time, logs) { let pt = calSecond(play_time); let at = calSecond(adv_time); let times = Array(pt).fill(0); for (let log of logs) { let temp = log.split("-"); let s = calSecond(temp..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bUTBm4/btr1zl9e7ia/hCdReBI6XTnkwCLdgZer11/img.png)
커널 커널은 운영체제의 핵심 기능을 모아놓은 것이다. 커널은 복잡하게 얽혀 있으며 단일형, 계층형, 마이크로 구조 커널로 구분된다. 커널이 하는 일 1. 프로세스 관리: 프로세스에 CPU를 배분하고 작업에 필요한 환경을 제공 2. 메모리 관리: 프로세스에 작업 공간을 배치하고 실제 메모리보다 큰 가상공간을 제공 3. 파일 시스템 관리: 데이터를 저장하고 접근할 수 있는 인터페이스 제공 4. 입출력 관리: 필요한 입력과 출력 서비스를 제공 5. 프로세스 간 통신 관리: 공동 작업을 위한 프로세스 간 통신 환경을 지원 단일형 구조 커널(monolithic architecture) 단일형 구조 커널은 초창기 OS 구조이다. 그리고 초기에는 기능 구현에 바빠서 커널의 핵심 기능을 구현하는 모듈들이 구분 없이 하..
-문제 사이트 https://school.programmers.co.kr/learn/courses/30/lessons/72413 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 코드 function solution(n, s, a, b, fares) { let answer = Infinity; const INF = Infinity; const graph = Array(n) .fill() .map(() => Array(n).fill(INF)); for (let [a, b, c] of fares) { graph[a - 1][b - 1] = c; graph[b -..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bCySVD/btr0r6sVPcq/kWcRamtgloQyeiF13ZfFdK/img.png)
타입 반복 개발자라면 코드의 반복을 줄이려고 노력한 적이 분명 있을 것이다. 이런 것을 DRY(don't repeat yourself)라고 한다. 이것을 타입에도 적용하여 타입 반복 또한 줄여야 한다. 이 글은 두고두고 많이 봐야 한다고 생각한다. 왜냐하면 평소에 코드 중복을 굉장히 많이 하여 개발했기 때문이다. 그렇기에 개발을 할 때마다 이 글은 자주 챙겨보면서 타입 중복을 피하여 코딩해야겠다. 타입 반복 예시 -문제 코드 interface Person { firstName: string lastName: string } interface PersonWithBirthDate { firstName: string lastName: string birth: Date } 나도 평소에 이렇게 타입이 겹치는 것이..