본문 바로가기

js35

immer에 대해 알려보자! https://immerjs.github.io/immer/ Introduction to Immer | ImmerImmer (German for: always) is a tiny package that allows you to work with immutable state in a more convenient way.immerjs.github.ioImmer란? 공식문서를 처음 읽어보면 "Immer는 불변 상태를 더 편리하게 다룰 수 있게 해주는 작은 패키지입니다." 라고 설명이 뜬다. 그럼 생각하게 된다 불변 상태가 뭘까? 이걸 알아야 우리느 Immer를 사용할 수 있다.  불변 상태란? 불변 상태란 한 번 생성된 데이터가 변경되지 않는 상태를 의미한다. 즉, 기존 객체나 배열을 직접 수정하는 것이 아니라.. 2025. 2. 9.
JS 모듈 : Default Export와 Named Export의 차이점 default export와 named export는 JavaScript 모듈 시스템에서 모듈을 내보내는 두 가지 방법으로,  그 동안 큰 문제를 겪진 않았지만 코드를 꼼꼼히 보는 습관을 가지려고 노력하는 과정에서 정리하게 되었다. Default Export'Default', 즉 기본값 이라는 뜻으로 주된 기능이나 객체를 대표값 으로 설정한다는 의미에서 붙여진 export 방식으로, 가장 흔히 사용되는 값(예: 주요 클래스나 함수)을 모듈의 기본값으로 설정할 때 적합하다.한 모듈당 하나의 default export만 허용되는 특징이 있다. 그렇기에 임의의 이름으로 모듈을 가져올 수 있다.// module.jsconst add = (a, b) => a + b;export default add;// main.. 2025. 1. 29.
TypeScipt - zod 라이브러리 zod 라이브러리란?Zod는 TypeScript 및 JavaScript 프로젝트에서 입력 데이터를 *스키마로 정의한 후 이를 기반으로 유효성 검사를 가능하게 도와주는 라이브러리이다. Zod를 사용하면 간단한 문법을 통해 데이터 검증과 변환을 동시에 작동할 수 있다. 주로 API 요청과 서버 응답, 폼 데이터 등의 데이터를 안정적으로 검증할 때 사용할 수 있다. 그렇다면 사용 방법에 대해 알아보자 *스키마란 데이터를 구조화하고 해당 데이터에 대한 규칙과 제약을 정의한 것이다. 기본 스키마 정의 및 유효성 검사기본 타입 스키마 정의Zod를 통해 여러 기본 타입을 검증할 수 있는 스키마를 정의할 수 있다.  또한 예시와 같이 기본 타입에 추가적인 검증 규칙을 정의할 수 있다.import { z } from '.. 2024. 10. 17.
FLUX 아키텍쳐에 대해 알아보자 Flux 아키텍쳐Flux는 Facebook이 만든 애플리케이션 아키텍처 패턴으로, 데이터 흐름과 상태 관리를 단방향으로 구성한 것이 특징이다. 이렇게 아키텍쳐를 한 줄로 요약하면 이해가 잘 가지 않으니 더 깊게 알아보자. 등장 배경 Facebook은 서비스가 성장하고, 더 많은 기능들이 추가되면서 상태 관리의 어려움이 점점 커졌다. 기존에 Facebook 서비스는  MVC(Model-View-Controller) 패턴을 사용하였는데, MVC 패턴은 여러 컴포넌트가 상호작용하면서 각자의 상태를 변화시키는 양방향 데이터 바인딩을 사용하게 된다. 하지만 이렇게 될 경우 하나의 컴포넌트에서 발생한 상태 변화가 다른 컴포넌트에 영향을 미치고, 이는 다시 또 다른 컴포넌트에 영향을 미치면서, 복잡한 상호작용 구조가.. 2024. 10. 14.