yceffort

15 posts tagged with "typescript"

자바스크립트의 private

Posted on May, 2020

이 글은 은닉을 향한 자바스크립트의 여정을 요약한 글입니다. History 자바스크립트에서는 객체에 private 한 속성을 만들 수가 없었다. 그래서 보통 자바스크립트 개발자는 private한 것이다 라는 약속으로 prefix…

Read full post

리덕스 공부해보기 (3) - 용어

Posted on April, 2020

https://redux.js.org/glossary#state 용어 모음 State (상태) State (State tree라고 도 불리운다)는 Redux API…

Read full post

타입스크립트로 koa 미들웨어 만들기

Posted on April, 2020

이런 미들웨어를 활용해서 logger를 만들 수도 있다. expressjs의 경우 https://github.com/expressjs/morgan 가 있고, koa를 활용할 경우 https://github.com/koa-modules/morgan 를 활용하면 된다.

Read full post

Socket.IO 공부하기 (1)

Posted on March, 2020

WebSocket 웹은 전형적으로 HTTP 요청에 대한 HTTP…

Read full post

NextJS 1. Page & Route

Posted on March, 2020

요즘 리액트를 쓰는 많은 프로젝트에서, SSR을 지원하기 위해 nextjs를 쓰고 있다. 초기 로딩 속도나, SEO 지원 이슈 등 등 때문에 아무래도 SPA는 요즘 트렌드에서 많이 밀린 기분이다. 물론 razzle 을 쓰거나 custom server 로 맨 바닥에 해딩하는 방법도 있지만 여기저기 컨퍼런스나 주변 사람들의 말을 들어보면 nextjs…

Read full post

NextJS 2. Data Fetching

Posted on March, 2020

nextjs의 공식 문서를 보고 요약한 내용입니다. 1. getInitialProps 2. getStaticProps 3. getStaticPaths 4. getServerSideProps 1. getInitialProps Nextjs 9.3 이전에는 밖에 존재하지 않는다. 최신 버전인 9.…

Read full post

자바스크립트에서 http 요청하기 - fetch에 대한 고찰

Posted on January, 2020

1. 서론 2. XMLHttpRequest 3. JQuery Ajax 3. async await & fetch 4. fetch polyfill 5. deep dive to fetch 5-1. 에러 처리 5-2. Abortable Fetch 5-3. fetch in react 6. 결론 1. 서론 자바스크립트에서 http…

Read full post

React count down에서 배운 event-emitter 와 requestAnimationFrame

Posted on January, 2020

리액트에서 카운트 다운을 만들며 배운 것들 리액트에서 카운트 다운을 만든다고 가정해보자. 가장 먼저 생각나는대로, 빠르게 구현한다면 아래와 같은 느낌이 될 것이다. 하지만 이 코드는 한가지 문제를 가지고 있다. setInterval, setTimeout…

Read full post

리액트 텍스트 하이라이트 만들기

Posted on October, 2019

요구사항 한 엘리먼트안에서 특정한 키워드를 다른 색싱으로 바꿔서 출력하는 것이다. 아래 예시를 살펴보자 before after 의식의 흐름 특정 키워드가 포함되어 있는지, 그리고 그것을 따로 뽑아 낼 수 있는 가장 간단한 방법은 무엇일까? 바로 split 일 것이다. 그러나 여기서 두 가지 몰랐던 사실을 알게 된다. 첫 문자에 seperator…

Read full post

typescript debounce

Posted on October, 2019

Creates a debounced function that delays invoking func until after wait milliseconds have elapsed since the last time the debounced function was invoked. The debounced function comes with a cancel…

Read full post

타입스크립트 제네릭

Posted on September, 2019

제네릭이란 제네릭은 클래스 내부에서 사용하는 데이터의 타입을 외부에서 지정하는 것을 의미한다. 어떤 타입의 데이터를 쓸지를, 클래스 선언부가 아니라 외부에서 결정하는 것이다. 일단 자바 코드로 한번 살펴보자. 라는 데이터 타입은 존재하지 않는다. 는 name의 타입으로, 아래 처럼 Person…

Read full post

Typescript, React, NextJs, Koa, Styled Component 로 프론트엔드 환경 만들기

Posted on June, 2019

이 문서는 더 이상 업데이트 하지 않을 생각이다. 대신 https://github.com/yceffort/koa-nextjs-react-typescript-boilerplate 여기에서 계속 해서 만들어 가고 있다. 사용한 오픈소스 React 자세한 설명은 생략 한다 Nextjs NextJs…

Read full post

Typescript Type, Enum, Partial, Record로 글로벌 변수 관리하기

Posted on June, 2019

고민지점 Global 로 관리하는 Colorset Red, Blue, Green, Black이 있다. 이 색들은 각각 지정된 칼라코드가 있다 그러나 때로는 그 컬러코드에 맞게 안쓰는 경우도 있다 그러나 때로는 저 네개를 다 안쓰고 1~3개만 쓰는 경우가 있다. Union types Union Type 어떤 라이브러리에서 받는 파라미터의 값을 number…

Read full post