React50 [React] date-fns 를 이용하여 날짜 형식 변경하기 - 떽떽대는 개발공부 오늘은 date-fns 라이브러리를 이용하여 날짜 형식을 변경을 해보자. 먼저 필요한 라이브러리 설치를 한다. // 버전에 따라 string 사용이 안되는 경우도 있으니 버전 확인 후 install npm i date-fns@1.30.1 npm i -D babel-plugin-date-fns@0.2.1 craco 에서 date-fns 를 설정 해준다. craco.config.js module.exports = function() { return { babel: { plugins: ['date-fns'], } } } dateUtils 라는 파일을 하나 생성하고 작성한다. src/utils/dateUtils.ts import { format } from 'date-fns' export const getFor.. 2021. 4. 21. [React] redux 를 이용하여 popup 창 구현하기 - 떽떽대는 개발공부 2021.01.11 - [React] - [React] ReactDOM 을 사용하여 팝업창 띄우기 - 떽떽대는 개발공부 [React] ReactDOM 을 사용하여 팝업창 띄우기 - 떽떽대는 개발공부 오늘은 react-dom 을 사용하여 팝업창 생성을 해보도록 하자. react 프로젝트가 생성될 때 하나의 돔이 생성되고 그 위에 view 가 그려진다. 따라서 팝업창을 생성하기 위해선 이미 펼져쳐 있는 dom 위 ddeck.tistory.com redux 를 이용하여 react 에서 popup 창 구현하는 포스팅이다. (typescript 사용) redux 를 이용하기 때문에 action, reducer 를 구현해야 한다. src/modules/common/layer.ts import { Action, cr.. 2021. 4. 15. [React] react-router-dom, loadable, history 를 이용한 페이지 이동 - 떽떽대는 개발공부 오늘은 react-typescript 에서 react-router-dom, loadable, history 를 이용하여 페이지 이동을 구현해보자. 먼저 필요한 모듈을 설치한다. npm i -D @types/loadable__component @types/react-router-dom history npm i @loadable/component react-router-dom 페이지 관리를 위하여 historyUtils.ts 파일을 작성한다. src/utils/historyUtils.ts import { createBrowserHistory } from 'history' export enum HISTORY_ACTION_TYPE { POP = 'POP', PUSH = 'PUSH', REPLACE = 'REPL.. 2021. 4. 2. [React] react 에서 다국어 처리 적용하기(4) - 떽떽대는 개발공부 2021.03.04 - [React] - [React] react 에서 다국어 처리 적용하기(3) - 떽떽대는 개발공부 [React] react 에서 다국어 처리 적용하기(3) - 떽떽대는 개발공부 2021/03/02 - [React] - [React] react 에서 다국어 처리 적용하기(2) - 떽떽대는 개발공부 [React] react 에서 다국어 처리 적용하기(2) - 떽떽대는 개발공부 2021/02/19 - [React] - [React] react 에서 다국어.. ddeck.tistory.com 위와 같이 react 에서 다국어 처리 적용하는 법을 포스팅 했었다. 오늘은 typescript 에서 다국어처리를 해보도록 하자. typescript 를 공부하며 많은 부분이 모듈화 되어 폴더 및 디렉.. 2021. 3. 31. 이전 1 2 3 4 ··· 13 다음
