개발하는 기획자. 기획하는 개발자. - mysetting

3:55 5/30

blog.naver.com

mobile screenshot relative

3:55

blog.naver.com

mobile screenshot

개발하는 기획자. 기획하는 개발자.
https://blog.naver.com/gi_balja

개발하는 기획자. 기획하는 개발자. 에어서플라이 프론트-엔드 개발자 웹프로그래밍 강사 HTML, CSS, JavaScript, jQuery, Angular, React, Ionic, Hybrid, Java, Android, 자바스크립트, 제이쿼리, 앵귤러, 리액트, 자바, 안드로이드 페이스북 : inkweon7269 페북 페이지 : TryToGaebal 유튜브 채널 : INKWEON7269 연락처 : 010-3442-5303

저작도구: naver blog

최종 피드 수집: 2025-03-09 23:45

전체 (187)

5M

yarn upgrade와 package.json, yarn.lock 동기화 방법

yarn upgrade를 사용하면 package.json, yarn.lock가 동기화되지 않는 문제가 있습니다. 이 문제는 syncyarnlock 패키지를 사용하면 간단하게 해결할 수 있습니다. 다음 명령어로 syncyarnloc

Etc

000

5M

[트러블슈팅] Parsing error: ESLint was configured to run on ...... parserOptions.project

Nest.js 프로젝트에서 새로운 테스트 코드를 실행할 때 다음과 같은 오류가 발생했습니다: "Parsing error: ESLint was configured to run on <tsconfigRootDir>/src/resour

Etc

000

5M

[트러블슈팅] remote: Repository not found

가끔 git pull을 실행할 때 다음과 같은 에러가 발생할 수 있습니다. 특히, 회사에서 만든 레포지토리를 EC2 환경에서 git pull을 받을 때 자주 일어나는 문제입니다. 예를 들어, A라는 조직에 속한 홍길동 팀장이 만든

Etc

000

6M

크로마틱(Chromatic)을 사용한 UI 테스트

크로마틱 소개 크로마틱(Chromatic)은 UI 컴포넌트 라이브러리의 시각적 테스트와 리뷰를 자동화하는 도구입니다. 이는 스토리북(Storybook)과 밀접하게 통합되어 있으며, UI 컴포넌트의 변경 사항을 시각적으로 추적하고,

React / Next

002

6M

스토리북 소개

스토리북 스토리북(Storybook)은 UI 컴포넌트 개발을 위한 오픈 소스 도구입니다. 웹 애플리케이션이나 모바일 애플리케이션을 개발할 때, 각각의 UI 컴포넌트를 독립적으로 개발, 테스트, 문서화하는데 매우 유용합니다. 주로

React / Next

000

6M

Vitest 스냅샷 테스트

스냅샷 테스트는 컴포넌트의 렌더링 결과를 테스트하기 위한 기법으로, 특정 시점에서 컴포넌트의 UI 출력이 예상된 형태와 일치하는지를 검증합니다. 참고로 스냅샷이란 특정 시점에서의 상태나 데이터를 기록한 일종의 '사진'과 같은 것을

React / Next

000

7M

Vitest TDD

테스트 주도 개발(Test-Driven Development, TDD)은 소프트웨어 개발 방법론 중 하나로, 테스트를 먼저 작성하고 그 테스트를 통과하는 코드를 작성하는 방식으로 개발을 진행합니다. TDD는 코드 품질을 높이고,

React / Next

000

7M

Vitest GitHub Actions 배포

깃허브 액션으로 테스트 코드를 배포하는 방법을 알아보겠습니다. 깃허브 액션은 깃허브에서 제공하는 자동화 도구입니다. 이를 통해 개발자들은 소프트웨어 개발 워크플로우를 자동화할 수 있습니다. 깃허브 액션은 다양한 이벤트(예: 코드

React / Next

000

7M

Vitest react-hook-form 적용

이번 글에서는 Vitest에 react-hook-form을 적용하는 방법을 알아보겠습니다. 간단한 작업이니 빠르게 지나가 볼게요. 먼저 react-hook-form 관련 패키지를 설치합니다. 이제 useForm, useFormCo

React / Next

000

7M

Vitest RTK & RTK Query 테스트 환경 세팅

RTK 적용 Next.js 환경에서 RTK를 모킹하는 방법에 대해 간단히 알아보겠습니다. Next.js 프로젝트에서 RTK를 설치합니다. 실습을 위해 authState를 변경하는 간단한 상태 관리를 적용해 보겠습니다. authSl

React / Next

000

7M

단위 테스트 (Unit Test)

단위 테스트 단위 테스트는 소프트웨어 개발 과정에서 코드의 특정 기능이 올바르게 작동하는지 확인하는 테스트입니다. 보통 하나의 함수 또는 단일 컴포넌트(클래스)와 같은 작은 단위의 코드를 테스트하는데 집중합니다. 단위 테스트는 다

React / Next

000

7M

Vitest 세팅

Vitest 소개 및 설치 Vitest는 프론트엔드 개발 환경을 위한 테스트 러너이자 테스트 프레임워크입니다. Jest를 대체할 수 있는 도구로, Vite의 생태계를 사용하여 테스트를 수행합니다. Vitest 주요 특징은 다음과

React / Next

000

7M

Apple Silicon 개발환경 세팅

Homebrew Homebrew는 macOS와 Linux에서 소프트웨어를 쉽게 설치하고 관리할 수 있도록 도와주는 패키지 관리자입니다. Homebrew를 사용하면 복잡한 빌드 및 설치 과정을 자동화할 수 있어, 개발 환경 설정이

Etc

000

8M

Nest.js 보고서 프로젝트 페이지네이션

이번 글에서는 Nest.js에서 페이지네이션을 적용하는 방법에 대해 알아보겠습니다. 다음 링크에서 파일을 다운로드받아 실습을 진행하면 됩니다. 그럼 간단하게 page, limit 쿼리스트링을 적용해 보겠습니다. 이미 많이 다뤘던

백엔드

002

8M

Nest.js - 보고서 프로젝트 커스텀 데코레이터

커스텀 데코레이터는 NestJS에서 코드를 더 깔끔하고 재사용 가능하게 만드는 중요한 도구입니다. 이를 통해 요청 객체에서 특정 데이터를 추출하거나, 특정 메타데이터를 설정하여 이를 기반으로 동작을 제어할 수 있습니다. 커스텀 데

백엔드

000

8M

Nest.js - 보고서 프로젝트 리프레시 토큰

리프레시 토큰(Refresh Token)은 인증 시스템에서 사용되는 보안 토큰 중 하나로, 주로 액세스 토큰(Access Token)의 유효 기간이 만료된 후에도 사용자가 지속적으로 인증된 상태를 유지할 수 있도록 해줍니다. 리프

백엔드

000

9M

Nest.js - 보고서 프로젝트 인증과 인가

인증(Authentication)과 인가(Authorization) 인증(Authentication)과 인가(Authorization)는 보안의 중요한 두 축입니다. 이 두 용어를 이해하기 쉽도록 공항 보안 검사에 비유해 보겠습니

백엔드

000

9M

Nest.js - 보고서 프로젝트 응답값 설정

사용자 응답 DTO 생성 이번 글에는 각 API 응답을 DTO로 설정해 보겠습니다. 다른 글에 비해 비교적 간단한 작업이니 빠르게 훑어 보겠습니다. 먼저 사용자 응답 DTO를 생성합니다. DTO 내부에는 static of 정적 메

백엔드

002

9M

Nest.js - 보고서 프로젝트 Facade 패턴 적용

퍼사드(Facade) 패턴 소개 퍼사드는 원래 프랑스어에서 유래한 단어로 영어로는 건출물의 '외관' 또는 '정면'을 의미합니다. 즉, 사람들이 처음 보게 되는 건물의 외관을 말하며 이는 건물의 첫 인상을 결정짓고, 디자인의 핵심

백엔드

002

9M

Nest.js - 보고서 프로젝트 사용자 정보 생성

사용자 엔티티 생성 이번 글에서는 사용자 정보를 저장하고 사용자와 보고서 간의 relation을 적용해 보겠습니다. 사용자 인증과 인가에 대해서는 추후에 다룰 예정입니다. 먼저 이메일과 비밀번호 정보를 갖고 있는 UserEnti

백엔드

000