본문 바로가기

전체 글108

HTTP의 구조와 Method HTTP (HyperText Transfer Protocol)란?Http란 웹에서 클라이언트와 서버 간의 데이터 전송을 위한 프로토콜, 즉 규약이다. http의 약자를 분석해보면 더 자세히 알 수 있는데, 해석해보자면 아래와 같다. HyperText : 단순한 텍스트를 넘어서 링크(참조)를 통해 다른 문서나 웹 페이지로 이동할 수 있는 동적인 텍스트를 의미한다.Transfer: 데이터를 전송한다는 의미로, HTTP는 클라이언트와 서버 간의 데이터 전송을 말한다.Protocol: 컴퓨터 간의 통신 규약을 말한다.HTTP의 구조그렇다면 http를 예시를 통해 어떤 구조를 가지고 있는지 자세히 알아보자.  Method: 클라이언트가 서버에 수행하고자 하는 작업의 종류를 말한다.Path : 요청 대상 리소스의.. 2024. 11. 9.
TypeScipt - zod 라이브러리 zod 라이브러리란?Zod는 TypeScript 및 JavaScript 프로젝트에서 입력 데이터를 *스키마로 정의한 후 이를 기반으로 유효성 검사를 가능하게 도와주는 라이브러리이다. Zod를 사용하면 간단한 문법을 통해 데이터 검증과 변환을 동시에 작동할 수 있다. 주로 API 요청과 서버 응답, 폼 데이터 등의 데이터를 안정적으로 검증할 때 사용할 수 있다. 그렇다면 사용 방법에 대해 알아보자 *스키마란 데이터를 구조화하고 해당 데이터에 대한 규칙과 제약을 정의한 것이다. 기본 스키마 정의 및 유효성 검사기본 타입 스키마 정의Zod를 통해 여러 기본 타입을 검증할 수 있는 스키마를 정의할 수 있다.  또한 예시와 같이 기본 타입에 추가적인 검증 규칙을 정의할 수 있다.import { z } from '.. 2024. 10. 17.
인터프리터(interpreter)와 컴파일러(compiler)에 대한 이야기 인터프리터(interpreter)와 컴파일러(compiler) 인터프리터(interpreter)와 컴파일러(compiler)는 프로그램을 실행하기 위해 소스 코드를 처리하는 두 가지 방식을 말한다. 컴퓨터는 사람이 작성한 프로그래밍 언어를 직접 이해하지 못하기 때문에 코드를 컴퓨터가 이해할 수 있는 형태로 변환하는 과정이 필요하다. 이때, 인터프리터와 컴파일러는 소스 코드를 기계가 처리할 수 있는 형태로 변환하는 서로 다른 방법을 사용하여 프로그램을 실행한다. 이제 두 실행 방법에 대해 알아보자 인터프리터(interpreter) 인터프리터는 소스 코드를 한 줄씩 읽고, 그때그때 실행하는 프로그램이다. 코드의 일부를 고치고 바로 실행할 수 있기 때문에 빠르게 테스트하고 디버깅 할 수 있는 장점이 있지만, .. 2024. 10. 16.
FLUX 아키텍쳐에 대해 알아보자 Flux 아키텍쳐Flux는 Facebook이 만든 애플리케이션 아키텍처 패턴으로, 데이터 흐름과 상태 관리를 단방향으로 구성한 것이 특징이다. 이렇게 아키텍쳐를 한 줄로 요약하면 이해가 잘 가지 않으니 더 깊게 알아보자. 등장 배경 Facebook은 서비스가 성장하고, 더 많은 기능들이 추가되면서 상태 관리의 어려움이 점점 커졌다. 기존에 Facebook 서비스는  MVC(Model-View-Controller) 패턴을 사용하였는데, MVC 패턴은 여러 컴포넌트가 상호작용하면서 각자의 상태를 변화시키는 양방향 데이터 바인딩을 사용하게 된다. 하지만 이렇게 될 경우 하나의 컴포넌트에서 발생한 상태 변화가 다른 컴포넌트에 영향을 미치고, 이는 다시 또 다른 컴포넌트에 영향을 미치면서, 복잡한 상호작용 구조가.. 2024. 10. 14.
React useCallback과 useMemo 차이 성능 최적화란?useCallback과 useMemo는 성능 최적화를 위해 고민하면서 접하게 되었다. 그렇다면 성능 최적화란 무엇일까?성능 최적화란 컴포넌트가 불필요하게 재렌더링되거나 시간이 많이 걸리는 연산이 반복되는 것을 방지하여 리소스를 효율적으로 관리하는 것을 말한다. 이를 위해 메모이제이션이라는 기법을 사용하게 되는데, 메모이제이션은 이전에 계산한 값을 기억해 두었다가 동일한 입력이 들어왔을 때 다시 계산하지 않고 저장된 값을 재사용하는 방법이다.  이제 메모이제이션을 사용하는 useCallback과 useMemo에 대해 알아보자useCallback란?useCallback은 함수를 메모이제이션하는 데 사용된다. useCallback을 통해 함수가 불필요하게 다시 생성되는 것을 방지하고, 특정 함수.. 2024. 10. 13.