[ 17주차 - 1211 ] 금일 커리큘럼 ├ 09:00 ~ 12:00 FrontEnd (React 복습, cusor AI 사용법,프롬프트) └ 13:00 ~ 18:00 FrontEnd (UseRef, UseEffect, 간단한 게시판 실습)1. React - useRef 이해1.1 useRef 란?React Hook 중 하나로, 함수형 컴포넌트에서 참조를 생성하고 관리하는 데 사용DOM 요소나 값에 대한 참조를 유지할 수 있으며, 컴포넌트가 다시 렌더링되어도 해당 참조는 유지DOM 조작 (= querySelector) 과 동일한 역할을 함대상요소에 ref 속성으로 참조를 연결사용시 current 프로퍼티로 접근import { useRef } from 'react';cons..

[ 17주차 - 1210 ] 금일 커리큘럼 ├ 09:00 ~ 12:00 FrontEnd (React Children props) └ 13:00 ~ 18:00 FrontEnd (React 조건부/리스트 렌더링, 컴포넌트 실습)1. 컴포넌트 Props의 Children 활용법1.1 Children props컴포넌트의 열고 닫는 태그 사이에 들어가는 내용을 props로 전달하는 방식import React from 'react';const Child = ({ children }) => { return ( 자식 컴포넌트 {children} {/* 여기의 부모가 전달한 슬롯이 렌더링됨 */} ..

[ 17주차 - 1209 ] 금일 커리큘럼 ├ 09:00 ~ 12:00 FrontEnd (React 기초, 컴포넌트 개념) └ 13:00 ~ 18:00 FrontEnd (React props, useState 기초)1. React 기초React : 사용자 인터페이스(UI)를 구축하기 위한 프론트엔드 프레임워크1.1 프론트 프레임워크에서 React의 위치state of javascript 2024 조사 결과 : React(67%), Vue(31%)React가 가장 인기 있는 프론트엔드 프레임워크로 자리잡고 있음1.2 React의 주요 특징컴포넌트 기반 아키텍처UI를 독립적이고 재사용 가능한 컴포넌트로 분할하여 개발가상 DOM (Virtual DOM)실제 DOM 조작 대신 가상..

[ 17주차 - 1208 ] 금일 커리큘럼 ├ 09:00 ~ 12:00 FrontEnd (js 복습, arrow 함수 심화) └ 13:00 ~ 18:00 FrontEnd (구조분해할당, 나머지 매개변수, 스프레드 문법)1. js - arrow 함수 심화React에서 화살표 함수(arrow function)를 자주 사용1.1 arrow 함수 선언 방식// 기본형태// 네임 = (매개변수) => { 함수 본문 }const add = (a, b) => { return a + b;};// 축약 1 : 리턴 생략const add = (a, b) => a + b;// 축약 2 : 매개변수 1개일 때 소괄호 생략const square = x => x * x;// 축약 3 : 매개변..

[ 16주차 - 1205 ] 금일 커리큘럼 ├ 09:00 ~ 12:00 Devops (Kubernetes Volume) └ 13:00 ~ 18:00 Devops (Kubernetes 프론트-백엔드 실습, 스케일링과 롤링 업데이트)1. kubernetes - Volume1.1 볼륨 종류종류설명예시emptyDir파드 안에서만 공유 / 파드 삭제 시 데이터 삭제임시 CachehostPath노드 Host OS 파일 시스템 사용개발 테스트nfs외부 NFS 스토리지 연결사내 파일서버PVC저장소 요청(Persistent Volume Claim)동적 할당PV스토리지 자체(Persistent Volume)관리자 제공pod는 기본적으로 휘발성 저장소를 사용하게됨 (일시적임)volume을 사용..

[ 16주차 - 1204 ] 금일 커리큘럼 ├ 09:00 ~ 12:00 Devops (Kubernetes, 환경 구성, pod와 deployment) └ 13:00 ~ 18:00 Devops (Service Networking, ConfigMap와 Secret)1. Kubernetes 이해컨테이너(도커 등)를 대규모로 배포하고 운영하는 오케스트레이션 플랫폼1.1 쿠버네티스의 주요 목적자동화된 배포컨테이너로 패키징된 애플리케이션을 원하는 상태로 정의하고, 쿠버네티스가 이를 자동으로 배포 및 관리확장성애플리케이션 트래픽에 따라 자동으로 컨테이너(pod)의 수를 조절하여 성능 유지셀프 힐링장애가 발생한 컨테이너를 자동으로 재시작하거나, 노드 장애 시 다른 노드로 컨테이너 재배치설..

[ 16주차 - 1203 ] 금일 커리큘럼 ├ 09:00 ~ 12:00 Devops (CI/CD 이해 및 Jenkins CI/CD) └ 13:00 ~ 18:00 Devops (Jenkins SSH EC2, Github Actions CI/CD)1. CI/CD 이해CI/CD는 개발의 최종 목표인 '빠르고 안정적인 소프트웨어 배포'를 달성하기 위한 핵심 방법1.1 CI (Continuous Integration - 지속적 통합)개발자들이 작성한 코드를 중앙 저장소에 자주 통합하는 프로세스코드 변경 사항을 자동으로 빌드하고 테스트하여 문제를 조기에 발견하고 해결1.2 CD (Continuous Deployment - 지속적 배포)CI 이후의 단계로, 코드 변경 사항을 자동으로 프..

[ 16주차 - 1202 ] 금일 커리큘럼 ├ 09:00 ~ 12:00 Devops (Grafana 대시보드 구성) └ 13:00 ~ 18:00 Devops (Grafana JVM 패널에 대한 이해, heapdump (hprof) 분석)1. Grafana 대시보드 구성Grafana : 오픈소스 기반의 데이터 시각화 툴prometheus와 같은 시계열 데이터베이스와 연동하여 데이터를 시각화 모니터링1.1 Grafana 컨테이너 실행docker run -d \ --name grafana \ --network bit-net \ -p 3000:3000 \ grafana/grafana-ossGrafana 설치오류시만약 아래와 같이 오류가 뜬 경우 Error response ..

[ 16주차 - 1201 ] 금일 커리큘럼 ├ 09:00 ~ 12:00 Devops (모니터링, Spring Boot Actuator) └ 13:00 ~ 18:00 Devops (Prometheus 메트릭)1. 모니터링 배경 지식1.1 모니터링 이해애플리케이션이 운영 환경에서 잘 동작하는지 확인하기 위해서는 모니터링이 필요모니터링을 통해 애플리케이션의 상태, 성능, 리소스 사용량 등을 실시간으로 파악 가능1.2 모니터링 주요 목적장애 조기 감지시스템 장애를 조기에 감지하여 신속한 대응 가능장애 : 메모리 부족, CPU 과부하, 네트워크 지연 등성능 최적화애플리케이션의 성능 병목 지점을 파악하여 최적화 가능예: 응답 시간, 느린 API 엔드포인트 식별, 데이터베이스 쿼리 성능..

[ 15주차 - 1126 ] 금일 커리큘럼 ├ 09:00 ~ 12:00 Devops (Nginx 이해, 로드밸런싱 이해) └ 13:00 ~ 18:00 Devops (nginx 로드밸런싱 환경 구성 실습)1. Nginx 이해Nginx : 웹서버 & 리버스 프록시 서버주요특징이벤트 기반 아키텍처 : 비동기 I/O 처리낮은 메모리 사용량 : 적은 리소스로 많은 연결 처리높은 성능 : C10K 문제 해결 (C10K : 1만개의 동시 접속 처리 문제)다양한 기능 : 로드 밸런싱, 캐싱, SSL 종료 등Apache 랑 Nginx 비교특징ApacheNginx아키텍처프로세스/스레드 기반이벤트 기반동시연결제한적매우 높음리소스 사용량높음낮음정적파일느림빠름동적컨텐츠모듈 통해 처리Reverse ..

[ 15주차 - 1125 ] 금일 커리큘럼 ├ 09:00 ~ 12:00 Devops (Docker 이미지와 레이어, Dockerfile) └ 13:00 ~ 18:00 Devops (Docker 이미지 빌드/관리, Docker 레지스트리, Docker Compose)1. Docker 이미지와 레이어1.1 Docker 이미지 레이어Docker 이미지는 여러 레이어(layer)로 구성된 파일 시스템각 레이어는 변경 사항을 포함하며, 불변(immutable) 특성을 가짐레이어는 캐시되어, 동일한 레이어를 사용하는 이미지 간에 저장 공간을 절약이미지 빌드 시, 변경된 레이어만 새로 생성되어 빌드 속도가 향상레이어 = 읽기 전용 파일 시스템 스냅샷1.2 Docker 레이어 구조예시 D..

[ 15주차 - 1124 ] 금일 커리큘럼 ├ 09:00 ~ 12:00 Devops (Docker 심화, ubuntu, nginx) └ 13:00 ~ 18:00 Devops (Docker 명령어 정리, Docker 네트워크)1. Docker 개념 심화1.1 가상머신(VM)과 컨테이너의 차이가상머신 아키텍처하이퍼바이저 위에 여러 개의 OS가 올라감각 OS마다 별도의 커널과 라이브러리를 가짐VM 간의 자원 낭비가 큼flowchart TD A["물리 서버 (Hardware)"] --> B["Hypervisor(VMware / Hyper-V / KVM)"] B --> C1["Guest OS 1(Windows /Linux)"] B --> C2["Guest OS 2(W..