프코

Redux toolkit 사용법

Redux-toolkit 사용 이유 ( Redux 라이브러리 더 쉽게 )Redux(리덕스)란 JavaScript 상태관리 라이브러리이다.Redux의 본질은 Node.js 모듈이다.✅ 상태란 무엇인가?React 에서 state(변수)는 component안에서 관리되는 것.부모 컴포넌트에서 -> 자식 컴포넌트로 props 를통해 state값을 넘겨 자식 컴포넌트는 props로 넘겨온 값을 넘겨받아 사용.부모기준 형제 컴포넌트 사이에서는 데이터를 주고 받을 수 없는 구조. ( 단방향 기준으로 데이터 전달 === 부모에서 -> 자식 )간단한 구조에서 데이터를 주고 받기에는 무리가 없지만 부모에서 가장 막내자식 컴포넌트가 100번 넘게 계속 바통 터치하듯 넘겨받는다고 생각해보자....(어질어질...🤣)😒 그럼..

🧩 3티어 Docker Compose 구성# Docker Compose 버전을 지정합니다. 3.8은 최신 기능과 호환되는 안정적인 버전입니다.version: "3.8"services: # 1. PostgreSQL 데이터베이스 서비스 정의 db: image: postgres:17 # 공식 PostgreSQL 17 이미지를 사용합니다. container_name: hello-db # 생성될 컨테이너의 이름을 hello-db로 지정합니다. networks: - hello-net # frontend, backend와 동일한 네트워크로 연결 environment: POSTGRES_DB: hello_db # 생성할 데이터베이스 이름 POSTGRES..

🔥 3티어 Docker 배포 가이드📌 1. Database (PostgreSQL)✅ 준비 파일: init.sql-- 1. 테이블 생성CREATE TABLE greetings ( id SERIAL PRIMARY KEY, lang VARCHAR(10) UNIQUE NOT NULL, message TEXT NOT NULL);-- 2. 초기 데이터 삽입INSERT INTO greetings (lang, message) VALUES('kr', '안녕하세요'),('en', 'hello world'),('jp', '곤니찌와');application.yml 예시spring: datasource: url: jdbc:postgresql://hello-db:5432/hello_db usern..

[인덱스(index)란]데이터베이스 검색 속도를 높이는데 사용되는 자료구조 이다.인덱스(index)는 책 뒤에 있는 색인 같은 것이다.찾아야 할 내용이 있을 때 색인을 보고 해당 페이지로 가서 원하는 정보를 얻을 수 있다.만약 색인이 없다면 책 첫 페이지부터 마지막 페이지까지 모두 넘겨봐야 한다. 예시 테이블[인덱스 설정에 따른 실행 계획]인덱스가 설정 되어 있지 않는 경우인덱스가 없는 상태에서 데이터를 조회하게 되면 Full Table Scan을 하게 된다. 인덱스가 설정 되어 있는 경우 [인덱스의 관리]인덱스는 항상 최신의 정렬 상태를 유지해야 원하는 값을 빠르게 탐색 할 수 있다.따라서 인덱스가 적용된 컬럼에 변경 작업이 있다면 연산을 추가적으로 해주어야 하므로 이에 따른 오버해드가 발생한다.IN..

트랜잭션(Transaction)이란?트랜잭션은 하나의 데이터 교환 또는 변경을 안전하게 처리하도록 보장해 주는 것을 의미한다. 한 번의 애플리케이션 로직으로 인해 두 개 이상의 데이터가 영향을 받는 경우, 각각의 데이터에 대한 변경이 완전하게 끝난 후 데이터베이스에 정상적으로 반영하는 것이다. 만약 데이터 처리 중 문제가 발생 시 로직 실행 전으로 되돌리는 기능을 지원한다.데이터베이스에 정상적으로 반영하는 것을 커밋(Commit) , 되돌리는 것을 롤백(Rollback)이라고 한다. 트랜잭션 ACID 속성ACID는 트랜잭션을 정의하는 4가지 중대한 속성을 가리키는 약어입니다.즉 원자성, 일관성, 신뢰성, 격리 그리고 영속성을 의미합니다.원자성(Atomicity)트랜잭션 내에서 실행한 작업들은 마치 하나의..

정규화란? 데이터베이스 정규화는 데이터베이스 내의 데이터 구조를 조직화하고 최적화하는 과정이다.정규화를 하는 목적은 데이터 중복을 제거하고, 효율성을 향상시키며, 데이터 무결성을 보장하기 위함이다. 데이터 정규화에는 다음과 같이 여러 단계가 있다.제1 정규화 (1NF)제2 정규화 (2NF)제3 정규화 (3NF) 이상 종류이상 종류란 정규화를 거치지 않은 데이터에서 발생할 수 있는 현상을 말한다.삽입 이상 (Insertion Anomaly) : 데이터 삽입 시 의도와 다른 값들도 삽입삭제 이상 (Delete Anomaly) : 데이터 삭제 시 의도와 다른 값들도 연쇄 삭제갱신 이상 (Update Anomaly) : 속성값 갱신 시 일부 튜플만 갱신되어 모순 발생제1 정규화 (1NF)데이터베이스의 각 컬럼..

✅ OSI 7계층 모델 정리OSI(Open Systems Interconnection) 7계층 모델은 네트워크 통신을 7단계로 나누어 각 단계의 역할을 명확히 한 이론적 모델입니다. 실제 구현보다 개념적으로 많이 사용됩니다.🧱 OSI 7계층 구조계층 번호계층 이름주요 역할예시7계층응용 계층 (Application)사용자에게 네트워크 서비스 제공HTTP, FTP, SMTP, DNS6계층표현 계층 (Presentation)데이터 형식 변환, 암호화/복호화JPEG, MPEG, SSL/TLS5계층세션 계층 (Session)통신 세션 관리, 연결 설정/유지/종료NetBIOS, RPC4계층전송 계층 (Transport)신뢰성 있는 데이터 전송TCP, UDP3계층네트워크 계층 (Network)경로 설정, 논리 주소..

✅ TCP/IP 4계층 모델 정리TCP/IP 모델은 네트워크 통신을 위한 4단계 계층 구조로, 실제 인터넷에서 널리 사용됩니다.🧱 TCP/IP 4계층 구조계층이름주요 역할대표 프로토콜4계층응용 계층 (Application Layer)사용자에게 서비스를 제공HTTP, FTP, DNS, SMTP, SSH 등3계층전송 계층 (Transport Layer)송수신 간 데이터의 신뢰성 있는 전송TCP, UDP2계층인터넷 계층 (Internet Layer)IP 주소 기반으로 라우팅 및 패킷 전달IP, ICMP, ARP 등1계층네트워크 인터페이스 계층 (Network Interface Layer)또는 링크 계층실제 장치 간 데이터 전송 (물리 전송 포함)Ethernet, Wi-Fi, MAC 등📌 각 계층 설명 요약..

tailwind-css 설치 및 환경 설정 방법테일윈드는 최신 업데이트에 따라 설정 방법이 많이 달라졌다.일단 vite로 프로젝트를 먼저 설치 하는 방법부터 알아보자npm i -D tailwindcss@3 postcss autoprefixery를 누른 후 프로젝트 이름을 설정 후 어떤 기술 스택을 사용할지 정하면 된다.그 후 프로젝트 폴더로 경로 변경을 한 후 npm i 를 한다.npx tailwindcss init 테일윈드를 설치했으니 환경설정을 할수 있는 파일을 생성한다.tailwind.config.js 라는 폴더 생성테일윈드 환경설정 폴더에 아래처럼 코드를 작성한다. /** @type {import('tailwindcss').Config} */ export default { content: ["..

경쟁상태를 해결하는 대표적인 방법으로는 뮤텍스, 세마포어, 모니터 3가지가 있다.이들은 상호배제, 한정대기, 진행의 융통성의 조건을 만족시키며 경쟁상태를 해결한다.상호 배제(mutual exclusion) : 한 프로세스가 임계 영역에 들어갔을 때 다른 프로세스는 들어갈 수 없음한정 대기(bounded wating) : 특정 프로세스가 임계영역 진입을 요청한 후 해당 요청이 승인되기 전까지 다른 프로세스가 임계 영역에 진입하는 횟수를 제한하는 것을 말하며 이를 통해 특정 프로세스가 영원히 임계 영역에 들어가지 못하게 하는 것을 방지함.진행의 융통성(progress) : 만약 어떠한 프로세스도 임계영역을 사용하지 않는다면 임계영역 외부의 어떠한 프로세스도 들어갈 수 있으며 이 때 프로세스끼리 서로 방해하지..