콘텐츠로 건너뛰기

react

MacBook onboarding for development

MacBook 을 구입하고, 계속 작업을 할 수 있게 환경을 구성하면서, 진행한 내용을 기록합니다. 혹시나 비슷하게 구성하시는 분이 참조하실 수 있기 바랍니다. For General use Homebrew Macos 패키지 관리자 Homebrew 를 설치합니다. v3.0.0 이후부터 애플실리콘(M1)을 지원합니다. Git MacOS 에 설치되어 있는 git 은 보통 최신 빌드가… 더 보기 »MacBook onboarding for development

NPM @bbon/react-calendar package

타입스크립트로 작성된 리액트 달력 컴포넌트입니다. peer dependencies react NPM GitHub react-dom NPM GitHub dayjs NPM GitHub 설치 $ npm install –save @bbon/react-calendar 사용 import React, { useCallback } from ‘react’; import { Calendar } from ‘@bbon/react-calendar’; import ‘@bbon/react-calendar/dist/calendar.css’; const MyComponent = () => { const… 더 보기 »NPM @bbon/react-calendar package

다국어 지원 next.js 웹 응용프로그램

next.js 웹 응용프로그램이 다국어를 지원하기 위해 next-i18next 를 사용하는 예제에 대한 설명입니다. baseURL 하위 경로를 사용해서 언어별 라우트가 구현됩니다. http://myapp.com <- 기본 언어 http://myapp.com/en <- 영어 http://myapp.com/ru <- 러시아어 의존 패키지 관련 의존 패키지는 아래와 같습니다. next 12.0.4 next-i18next 9.1.0 react 17.0.2 react-dom 17.0.2 $… 더 보기 »다국어 지원 next.js 웹 응용프로그램

GitHub Actions Sample #1

최근 작성하는 프로젝트들이 비슷한 형식으로 구성되어 CI/CD 를 GitHub Actions 를 활용하고 있습니다. 간단한 단계는 기본적으로 제공되는 GitHub Actions 패키지를 활용하고, 필요로 하는 특정 기능은 검색해보니 대부분 공개된 패키지가 존재합니다. 몇몇 시행착오를 거쳐 .NET 5 백엔드 응용프로그램과 React 프론트엔드 응용프로그램을 빌드하고, 태그한 후 GitHub Release… 더 보기 »GitHub Actions Sample #1

Bing Today Images Collector

bing.com 은 마이크로소프트에서 서비스하는 검색서비스입니다. 이 사이트는 매우 아름다운 배경 이미지를 제공합니다. 여기서 제공되는 배경 이미지를 데스크톱 배경으로 사용하고 싶어서 어떻게 얻을 수 있나 찾아보니 이미지 정보를 제공하는 API 가 있습니다. API 를 사용해서 특정시간에 새로운 이미지가 있으면 이미지 파일을 수집하고, 수집된 파일을 배경화면으로 사용하고자… 더 보기 »Bing Today Images Collector

How to resolve regeneratorRuntime is not defined

개요 React 를 사용해서 작성된 잘 동작하던 웹 응용프로그램이 아래와 같은 메시지를 출력하고, 멈춰버렸습니다. regeneratorRuntime is not defined 환경 개발환경 node.js v14.16.0 npm v.7.6.3 패키지 @babel/core v7.13.15 해결 babel-plugin-transform-runtime#why 페이지에서 이유와 어떻게 해야되는지 설명하고 있습니다. babel-plugin-transform-runtime#technical-details 페이지에서 자세한 기술적 설명을 제공합니다. 패키지 설치 $ npm… 더 보기 »How to resolve regeneratorRuntime is not defined