독일개발자초록이

UML 활동 다이어그램(Activity Diagram)이란? 순서도와 뭐가 다를까안녕하세요! 오늘은 UML다이어그램 시리즈, 이번에는 활동 다이어그램(Activity Diagram)에 대해 알아보려고 합니다.활동 다이어그램이란 무엇인가?핵심 구성 요소회원가입 예제로 살펴보기Fork/Join 병렬 처리 표현하기순서도(Flowchart)와 뭐가 다를까?언에 유용할까?활동 다이어그램은 "업무 흐름 전체", 즉 여러 간계를 순서대로(때로는 동시에) 처리하는 과정에 초첨을 맞춥니다. 1. 핵심 구성 요소 2. 회원가입 예제로 살펴보기회원가입 프로세스를 예로 들어보겠습니다. 흐름은 대략 이렇게 진행됩니다.사용자가 입력한 값을 검증합니다.유효하지 않다면 에러 메시지를 표시하고 종료합니다.유효하다면 회원을 생성합니다...

REST API vs GraphQL, 우리 프로젝트엔 뭐가 맞을까? 안녕하세요! 오늘은 API를 설계하거나 새로운 프로젝트를 시작할 때 한 번쯤 고민해 보셨을 주제, REST API와 GraphQL 중 뭘 써야 할까에 대해 가볍게 비교해 보려고 합니다.REST API란?GraphQL이란?요청 방식 비교Over-fetching / Under-fetching이란?각각의 장단점언제 무엇을 선택해야 할까?두 개념 모두 결국 "클라이언트가 서버에서 데이터를 가져오는 방식"인데, 접근 방식 자체가 완전히 다릅니다. 하나씩 짚어보겠습니다. 1.REST API란?REST는 자원을 URL로 표현하고, Http메서드 (GET, POST, PUT DELETE)로 행위를 표현하는 방식입니다.GET /users/1GET /us..

fetch vs axios, 아직도 axios 써야 할까?안녕하세요! 오늘은 프런트엔드 개발을 하시다 보면 한 번쯤 고민해 보셨을 주제, fetch와 axios중 뭘 써야 할까? 에 대해 가볍게 알아보려고 합니다.새 프로젝트를 시작할 때마다 "이번엔 axios 설치할까, 아니면 그냥 fetch 쓸까" 고민해 보신 적 있으신가요?둘 다 결국 데이터를 요청하는 도구인데, 왜 굳이 나눠서 이야기하는지 하나씩 짚어보겠습니다. fetch는 뭐고, axios는 뭘까?fetch는 브라우저에 기본으로 내장된 API입니다.별도의 설치 없이 바로 사용할 수 있고, Node.js환경에서도 최신 버전이라면 기본적으로 지원됩니다.반면 axios는 npm으로 따로 설치해야 하는 외부 라이브러리입니다.npm install axio..

React Hook Form이란? 사용법부터 Zod 연동까지 총정리안녕하세요! 오늘은 React로 폼을 다뤄보신 분이라면 한 번쯤 들어보셨을 React Hook Form에 대해 소개해드리려고 합니다. 폼 상태 관리 라이브러리를 찾고 계셨다면 이 글로 개념부터 실전 예시까지 한 번에 정리해 보실 수 있습니다. 목차React Hook Form이란 무엇인가?기본 사용법 (register, handleSubmit)formState로 폼 상태 다루기Controller로 커스텀 UI 컴포넌트 연동하기Zod와 함께 사용하기 (zodResolver)Formik과의 차이점Next.js Server Actions와 함께 쓸 수 있을까?자주 묻는 질문 (FAQ)폼을 직접 useState로 관리해보신 적 있으신가요?인풋이 몇..

Next.js Server Actions란? 사용법부터 예제까지 총정리안녕하세요!오늘은 Next.js Server Actions에 관해 알아보려고 합니다. Next.js로 폼을 처리해 보신 분이라면 한 번쯤은 들어보셨을 개념인데요, 오늘 이 글 하나로 개념부터 실전 예제까지 정리해 보겠습니다.이 글에서 다루는 내용Server Actions란 무엇인가?폼 제출 예제로 배우는 사용법Server Actions가 유용한 이유캐시 갱신하기 (revalidatePath)로딩 상태 처리하기 (useFormStatus)에러 처리하기 (useActionState)서버 컴포넌트에서 호출하기자주 묻는 질문(FAQ)기존에 클라이언트에서 서버로 데이터를 보내려면, 대부분 API Route를 따로 만들고 fetch로 그 주소를 ..

Next.JS Streaming이란?안녕하세요!오랜만에 인사드립니다.그 사이 Next.JS에 수많은 업데이트가 있었고 오늘은 오랜만에 글을 작성해보려고 합니다. 서버 컴포넌트를 사용한다는 것은 여러 가지 장점이 존재합니다.그중 한 가지는 클라이언트가 다운로드해야 하는 Javascript가 줄어든다는 것입니다.하지만 서버 컴포넌트를 적절히 활용할 줄 알아야지 그 장점이 부각된다는 것입니다.모든 정보들을 서버에서 한 번에 보여주려 하다 보면, 오히려 서버가 처리해야 하는 일이 너무 많아지게 되는 경우가 생기고 모든 작업이 끝날 때까지 클라이언트는 로딩화면만 보게 되는 경우도 있게 됩니다.당연히 요즘 인터넷이야 워낙에 빠르다 보니, 유저가 답답하다고 느끼기도 전에 해결되는 경우다 다반사 일 것이지만,그렇지 않..