Archive: 2022

0

node-gyp 설치 오류 해결 방법

node-gyp 설치 과정 중 오류가 발생하였을 때 해결 방법입니다. npm 버전 확인 npm 버전을 확인하고 버전에 맞게 수행합니다. 1$ npm --version Windows PowerShell 또는 명령 프롬프트(cmd.exe)를 "관리자 권한으로 실행"으로 실행합니다. 먼저 node 가 설치된 디렉토리로 이동합니다. 1$ cd

0

npm install 시 gyp ERR! 해결 방법

npm install 시 **gyp ERR!**로 시작하는 설치 에러가 발생할 경우 해결 방법을 정리하였습니다. 첫 번째 방법 Microsoft 의 windows-build-tools 설치합니다. 관리자 권한으로 PowerShell 또는 터미널을 열고 다음 명령어를 실행하여 설치합니다. npm 버전이 8 이상 설치가 되어 있어야 합니다. 1$ npm in

0

[React] Animations 사용 방법

Framer Motion을 사용하여 애니메이션을 간편하고 쉽게 만드는 방법을 알아보겠습니다. Framer Motion Framer는 디자이너들을 위해 프로토타입 등을 만들어 주는 회사입니다. Framer Motion은 React 용 production-ready 모션 라이브러리입니다. 설치 1$ npm install framer-motion 사용 A

0

[CentOS] alias 등록 방법

alias 란 alias는 별칭이라는 뜻으로 리눅스에서 alias는 사용자가 명령어를 다른 이름으로 바꿔서 사용할 수 있는 쉘 내부 명령어를 말합니다. 이 alias를 통해서 일일이 입력하기 번거로운. 길이가 긴 명령어를 간단한 이름으로 바꿔서 등록하여 업무 효율을 높일 수 있습니다. alias 확인 현재 등록된 alias 리스트를 확인할 수 있습니

0

[CentOS] Tomcat 다중 설치 및 운영 방법

리눅스 환경에서 Tomcat을 다중 설치하고 운영하는 방법에 대해 알아보겠습니다. 1. Tomcat 설치 이전 글 [CentOS] 아파치 톰캣(Tomcat) 설치 및 사용 방법 을 보면서 Tomcat 을 설치합니다. 설치된 Tomcat 폴더를 서로 다른 이름의 폴더로 복사합니다. 12- tomcat1 : /usr/local/tomcat_1- tomcat2

0

[React] reference 사용 방법

reference는 react 코드를 이용해 HTML 요소를 지정하고 가져올 수 있는 방법입니다. 다시 말해서 자바스크립트로부터 HTML 요소를 가져오고 수정할 수 있도록 해줍니다. 사용 useRef를 사용하여 HTML 요소를 가져옵니다. 다음 코드는 button 클릭 시 input을 포커싱하고 해제하는 예제입니다. 123456789101112131415

0

[Spring] Swagger Header 설정 방법

Spring에서 Swagger Header 설정 방법에 대해 알아보겠습니다. API 마다 설정 각 API 마다 @ApiImplicitParam을 통해 인증 정보(토큰)를 입력하도록 설정합니다. 1234567@ApiImplicitParams({@ApiImplicitParam(name = "Authorization", value = "JWT Toke

0

[Angular] 기능 구현 방식

Angular 프레임워크로 특정 기능을 구현할 때 어떤 방식으로 사용하는지에 대해 알아보겠습니다. UI Component 구현 클래스에 @Component Annotation을 붙여서 생성합니다. HTML 템플릿 정의 인라인 HTML 코드를 사용할 때는 @Component 어노테이션 template 항목을 사용하고, 외부 파일에서 불러올 때는 templ

0

[React] memo 사용 방법

React에서 memo 사용 방법에 대해 알아보겠습니다. 컴포넌트가 동일한 props로 동일한 결과를 렌더링 해낸다면, React.memo를 호출하고 결과를 메모이징(Memoizing)하도록 래핑 하여 경우에 따라 성능 향상을 누릴 수 있습니다. 즉, React는 컴포넌트를 렌더링 하지 않고 마지막으로 렌더링 된 결과를 재사용합니다. 1234567imp

0

[React] Drag and Drop 사용 방법

react-beautiful-dnd을 사용하여 React에서 깔끔하고 사용하기 쉬운 드래그, 드롭, 애니메이션을 적용하는 방법에 대해 알아보겠습니다. 설치 1$ npm i react-beautiful-dnd TypeScript 사용 시 추가로 설치합니다. 1$ npm i --save-dev @types/react-beautiful-dnd 사용 임시 데이