React Query는 데이터 Fetching, 캐싱, 동기화, 업데이트, 에러핸들링 등 비동기 과정을 쉽게 만들어 주는 React 라이브러리입니다. React Query를 사용하면 기존의 서버 데이터를 가져오거나 업데이트하는 코드를 축약할 수 있고 캐싱 처리가 간단해졌습니다. 간단하게 useQuery를 사용하여 코인들의 정보를 조회하는 코드를 통해 Rea
Nested Routes는 route 안에 있는 또 다른 route입니다. React Router 가 v6로 바뀌면서 Nested Routes 만 아니라 Route 사용하는 방법이 바뀌었습니다. 전 5 버전과 현재 6 버전 사용법을 비교하였습니다. React Router v5 nested routes 구현하는 방법은 자식 route를 부모 route의
React에서 TypeScript를 적용하고 사용 방법에 대해 알아보겠습니다. 설치 create-react-app 명령어에 typescript 옵션을 추가합니다. 1$ npx create-react-app typescript --template typescript Typescript를 추가하지 않은 기존 프로젝트가 있다면 다음 명령어를 실행하여 설치합니다
React에서 Styled Components를 사용하는 방법에 대해 알아보겠습니다. 설치 Visual Studio Code를 사용 시 Styled-Component 자동 완성을 위해 vscode-styled-components 플러그인을 설치합니다. 1$ npm i styled-components https://styled-components.com/
FFmpeg Build 다운로드하기 https://ffmpeg.org/download.html#build-windows 사이트에서 Windows EXE Files 항목의 원하는 형식으로 다운로드를 합니다. 다운로드한 후 압축해제 합니다. 프로젝트의 ffmpeg 폴더를 생성 후 실행에 사용되는 exe, dll 파일들을 복사합니다. Bitmap들을 동영상으
사각형, 타원, 삼각형으로 이미지를 자르기 위해 다음처럼 정의합니다. 123456public enum ShapeType{ Rectangle, Ellipse, Triangle,} 이미지 자르기 기존 비트맵 이미지에서 주어진 위치과 크기, 도형을 통해 이미지를 자릅니다. 123456789101112131415161718192
이미지 로드 이미지 파일 경로를 통해 이미지를 로드합니다. 123456789using System.Drawing.Imaging;public Bitmap LoadImage(string path){ using (Bitmap bitmap = new Bitmap(path)) { return bitmap.Clone(new
Devexpress GridControl의 TableView에서 행이 추가될 때마다 컬럼의 숫자가 자동 증가하도록 구현한 코드입니다. Converter 생성 IValueConverter 인터페이스를 상속받아 IndexFromOneConverter 클래스를 생성합니다. 12345678910111213141516171819202122232425using Sy
Vue 쓰는 이유 Web app(Single Page Application) 만들 때 사용합니다. 코드 작성할 때 방법이 정해져 있습니다. React는 방법이 다양한 방면 Vue는 v-for, v-if, v-else 등 방법이 하나로 정해져 있어 개발 초보에게도 쉽습니다. 물론 Vue 도 React처럼 자유도 높은 개발도 가능합니다. HTML 렌더
WPF 기본 Slider Stlye에서 Thumb을 드래그할 때마다 박스 안에 숫자가 표시되도록 Style 을 하였습니다. Slider 모양 Style 추가 App.xaml 에 추가하거나 Resource.xaml 파일을 생성하여 Style 을 추가합니다. 123456789101112131415161718192021222324252627282930313