전체 글 45

TDD 테스트 주도 개발

1. TDD2. jset3. TDD 로 검증 1. TDD TDD(Test-driven Development)는 테스트 주도 개발을 뜻하는 소프트웨어 개발 방법론입니다. 먼저 테스트를 작성하고, 그 테스트를 통과하는 코드를 작성하는 방식으로, 선 테스트 후 개발 방식이라고도 합니다. TDD특징짧은 개발 사이클을 반복하며, 자동화된 테스트 케이스를 작성합니다코드를 수정하거나 기능을 추가할 때 수시로 빠르게 검증 할 수 있습니다.리팩토링 시에 안정성을 확보할 수 있습니다.개발 및 테스팅에 대한 시간과 비용을 절감할 수 있습니다. 목표버그가 적은 완벽에 가까운 데모를 고객에게 제공합니다적용 분야익스트림 프로그래밍 개발방법론의 실천 방안 중 하나입니다 [ 좋은 테스트의 특징 ] 그렇다고 테스트를 무작정 작..

카테고리 없음 2025.04.22

TypeScript

1. TypeScript2. 컴파일, ts-node 3. Interface,Assertion,Generic 1. TypeScripttypescript란?JavaScript 은 웹 개발의 표준이지만 규모가 커질수록 타입에 대한 안정성이 부족하고 코드 예측이 어려웠습니다.이를 해결하기 위하여 Microsoft는 정적 타입을 지원하는 TypeScript를 2012년에 출시했습니다.. TypeScript는 JavaScript의 상위 확장(superset)으로, 코드 실행 전에 오류를 잡아내고, 프로젝트시 유지보수를 쉽게 해주는 장점이 있습니다. type원시타입 값 자체를 저장하며, 메모리에 직접 할당된다. 변경이 불가능 한 특성을 가집니다.const [변수명]: [타입] = [타입에맞는값];const a: ..

카테고리 없음 2025.04.21

AWS NGINX

통신규약NGINX는 왜 필요할까?NGINX 사용법 1. 통신규약 인터넷에서 데이터를 주고받을 때는 HTTP 또는 HTTPS라는 약속된 규칙을 따라야 해요.이걸 **통신규약(Protocol)**이라고 부르죠.예: 브라우저가 서버에게 페이지를 요청할 때vbnet복사편집GET / HTTP/1.1 Host: example.com 서버는 이 요청을 읽고 HTML, 이미지, 데이터를 응답해줍니다.2. NGINX가 필요한 이유우리가 React, Node.js, Flask, Spring 같은 서버 애플리케이션을 직접 띄우면 보통 3000번, 3005번, 8080번 같은 비표준 포트를 사용해요.예:bash복사편집http://mydomain.com:3005 하지만 이런 주소는 몇 가지 문제가 있습니다. 1. 포트번호 ..

카테고리 없음 2025.04.21

Blckchain

1. Blockchain 1-2 Blockchain 의 블럭2. hash,previousHash 3. merkRoot 1. Blockchain Blockchain 이란‘블록체인(Block Chain)’은 블록에 데이터를 담아 체인 형태로 연결한 뒤, 수많은 컴퓨터에 이를 동시에 복제•저장하는 분산형 데이터 저장기술입니다.거래 데이터가 담긴 ‘블록’들이 사슬 구조로 연결되어 있는 공공 거래 장부라고 표현!블록체인 기술과 비트코인은 ‘사토시 나카모토’라는 개발자에 의해 세상에 알려졌는데.블록체인 기술의 등장은 전세계 가상화폐 시장에 새로운 바람을 불러 일으키게 됩니다. 은행 같은 중앙 기관의 개입 없이도 안전하게 개인간 거래가 가능했기 때문이죠. => 탈 중앙화 이는 블록체인이 데이터를 하나의 중앙 컴퓨..

카테고리 없음 2025.04.14

AWS PM2

1. 포그라운드 백그라운드1-2 프로그램 프로세스2. PM2 1. 포그라운드 백그라운드포그라운드포그라운드는 사용자가 직접 실행하고, 사용자와 상호작용하는 프로세스를 말해. 터미널에서 실행하면 바로 실행되고, 그 터미널을 닫으면 프로세스도 같이 종료됩니다. 백그라운드눈에 보이지 않으며 사용자와 직접적으로 상호작용 하지 않고, 보이지 않는 곳에서 동작하는 프로세스터미널을 닫아도 실행이 지속되며, 서버 유지와 같은 목적으로 주로 사용됩니다. EX) 윈도우 자동 소프트웨어 업데이트 프로세스 안에서 실행되는 작업의 최소 단위 1-2 프로그램 프로세스프로그램은 실제로 컴퓨터에서 실행되는 코드나 소프트웨어를 말하고, 프로세스는 그 코드가 실행되어 동작하는 상태를 말합니다. 프로그램이 실행될 때마다 프로세스가 생기고..

카테고리 없음 2025.04.14

AWS

1. AWS2. EC2 설정 1. AWSAWS ( Amazon Web Services) 아마존닷컴이 운영하는 클라우드 컴퓨팅 서비스로 세계적으로 가장 많이 사용되는 클라우드 플렛폼입니다.1. **초기 아마존 (전자상거래 중심)** - 아마존은 원래 온라인 서점에서 출발했고, 이후 전자상거래 플랫폼으로 성장함. - 물리적인 재고 관리, 결제 시스템, 물류 운영 등 다양한 IT 인프라가 필요해짐. 2. **사업 확장 → 내부 인프라 구축 필요** - 쇼핑몰뿐만 아니라, 전자책(Kindle), 동영상 스트리밍(Prime Video), 음악 스트리밍(Amazon Music) 등 서비스 확장. - 이런 다양한 서비스를 운영하기 위해 안정적인 서버, 데이터베이스, 스토리지 관리가 필요..

카테고리 없음 2025.04.14

AJAX

1. AJAX2. AJAX 동작방식3. 비동기 요청의 try catch1. AJAX (Asynchronous JavaScript and XML)란?AJAX(에이잭스)는 Asynchronous JavaScript and XML의 약자로, 웹 페이지를 새로고침하지 않고도 서버와 데이터를 주고받을 수 있도록 해주는 기술입니다. AJAX를 사용하면 웹 애플리케이션이 더 빠르고 반응성이 좋아지며, 동적인 콘텐츠를 쉽게 구현할 수 있습니다. 1. 비동기적으로 동작하며 페이지를 세로고침 하지안고도데이터를 서버와 교환하거나 일부 콘텐츠만 업데이트 할 수 있습니다. 2. JSON , XML , HTML 등 일반 텍스트 등 다양한 데이터 형식을 지원합니다 3. XMLHttpRequest 객체를 사용하여 서버 요청 처리4..

카테고리 없음 2025.04.14

Node.js 프론트 와 백 영역분류

1. 프론트엔드와 백엔드의 역할2. 각 서버 간의 통신 API3. 영역의 관리 1. 프론트엔드와 백엔드의 역할프론트엔드프론트엔드는 사용자와 직접 상호작용하는 부분을 담당합니다. 웹사이트의 UI/UX를 구성하며, 브라우저에서 실행되는 코드로 이루어져 있습니다.주요 기술 스택:HTML, CSS, JavaScriptReact, Vue.js, Angular 등의 프레임워크상태 관리 라이브러리 (Redux, Zustand 등)백엔드백엔드는 데이터를 처리하고 비즈니스 로직을 수행하는 서버 측의 역할을 합니다. 프론트엔드와 데이터베이스 사이의 중간 역할을 하며, API를 통해 데이터를 주고받습니다.주요 기술 스택:Node.js (Express, NestJS)Python (Django, Flask)Java (Spr..

카테고리 없음 2025.04.14

react 리렌더링

1. 함수형 컴포넌트의 리렌더링2. memo 와 usemamo,usecallback 3. React 의 모토 1. 함수형 컴포넌트의 리렌더링함수형컴포넌트는 함수형으로 만들어진 컴포넌트 이기 때문에 함수내부에서 평가와 실행이 실시됩니다. React에서 함수형 컴포넌트는 상태(state)나 props가 변경될 때마다 다시 실행(리렌더링) 됩니다. 이는 React의 핵심적인 동작 방식으로, UI를 항상 최신 상태로 유지하기 위함입니다. 리렌더링이 발생하는 주요 원인은 다음과 같습니다:State 변경 - useState로 관리하는 값이 변하면 해당 컴포넌트가 다시 실행됩니다.Props 변경 - 부모 컴포넌트에서 받은 props 값이 변경되면 해당 컴포넌트가 리렌더링됩니다.부모 컴포넌트 리렌더링 - 부모가 리..

카테고리 없음 2025.04.14

react customHook

1. react 프레임워크 2. react 라우팅3. customhook 1. react 프레임워크 CAR CAR 리액트에서 공식으로 만들어준 프레임워크가 있는데 개발자들이 개발을 편하게 하라고 만들어준 프레임워크입니다. 리액트 프로젝트를 쉽게 생성하고 초기 설정을 자동화해주는 도구 명령어 한 줄(npx create-react-app 프로젝트명)로 Webpack, Babel, ESLint 등 필수 설정이 포함된 환경을 바로 구성할 수 있습니다. 리액트 프레임워크 공식 사이트 `https://create-react-app.dev/` 사용법 npx create-react-app [프로젝트명] 이렇게 쓰면 우리가 원하는 프로젝트 명을 가진 CAR 가 생성됩니다. 생성된 디렉토리 구조 ├─ no..

카테고리 없음 2025.04.14