leeeyez님의 블로그

어제 10월 1일에 리액트 19.2가 npm에 정식 출시되었다.https://react.dev/blog/2025/10/01/react-19-2 React 19.2 – ReactThe library for web and native user interfacesreact.dev새롭게 추가된 부분들을 살펴보자! - 렌더링 우선순위 제어: 앱의 특정 부분을 화면에서 숨기면서도 메모리에는 유지하는 컴포넌트 앱의 일부를 제어하고 우선순위를 지정할 수 있는 새로운 컴포넌트visible/hidden 모드로 화면에 보이지 않는 부분을 미리 렌더링 가능사용자가 다음에 이동할 페이지를 백그라운드에서 로딩하거나, 뒤로가기 시 상태 유지에 활용 공식 블로그에서 보여준 예시.이렇게 하면 currentTab이 profile일..

최근에 교내 캠퍼스타운에서 진행하는 MVP 개발 서포터즈 잇(IT)다 6기에 선정되어, 현재 매칭된 입주기업이 요구하는 개발 작업을 진행하고 있다. 입주기업이 이제 막 아이디어만 갖고 시작하는 스타트업이기도 하고, 개발 관련 내부 인력이 아예 없는 상황이라 혼자 개발을 맡게 되었다. 🥲 막막하기도 했지만, 그동안 사용해보고 싶었는데 사용해보지 못한 기술들을 적용도 해보고 좀 더 폭넓은 경험을 할 수 있지 않을까 싶어 기대가 되기도 했다. K-뷰티를 외국인 대상으로 큐레이션해주는 글로벌 뷰티 매거진/커뮤니티 웹사이트를 개발 중이며, Next.js / TS / Tailwind css / shadcn 을 사용하여 프론트 개발이 한창 진행 중이다. 백엔드도 추후 맡아야할 상황이 올 수 있기 때문에 SSR이 가..

비선형 자료 구조: 일렬로 나열하지 않고 자료 순서나 관계가 복잡한 구조 -> 트리나 그래프 그래프: 정점과 간선으로 이루어진 자료 구조정점과 간선정점으로 나가는 간선 = 해당 정점의 outdegree들어오는 간선 = 해당 정점의 indegree정점 V : outgegree = 3 / indegree = 2정점은 약자로 V, U라고 함정점과 간선으로 이루어진 집합 = 그래프 graph가중치: 간선과 정점 사이에 드는 비용 트리: 그래프 중 하나로 정점, 간선으로 이루어져 있고, 트리 구조로 배열된 일종의 계층적 데이터의 집합루트 노드, 내부 노드, 리프 노드 등으로 구성트리로 이루어진 집합을 숲이라고 한다트리의 특징부모, 자식 계층 구조를 가진다V - 1 = E (간선 수 = 노드 수 - 1)임의의 두..

선형 자료 구조 = 요소가 일렬로 나열되어 있는 자료 구조연결 리스트데이터를 감싼 노드를 포인터로 연결해서 공간적인 효율성을 극대화시킨 자료 구조삽입 삭제 : O(1)탐색 : O(n) prev 포인터와 next 포인터로 앞과 뒤의 노드를 연결시킨 것이 연결 리스트맨 앞에 있는 노드를 헤드(head)라고 한다싱글 연결 리스트 : next 포인터만 가진다이중 연결 리스트 : next 포인터와 prev 포인터를 가진다원형 이중 연결 리스트 : 이중 연결 리스트와 같지만 마지막 노드의 next 포인터가 헤드 노드를 가리키는 것을 말함 배열: 같은 타입의 변수들로 이루어져 있고, 크기가 정해져 있으며, 인접한 메모리 위치에 있는 데이터를 모아놓은 집합중복을 허용하고 순서가 있다 (정적 배열을 기반으로 설명)접근(..

시간 복잡도빅오 표기법시간 복잡도 = 입력 크기에 대해 어떠한 알고리즘이 실행되는 데 걸리는 시간-> 주로 로직의 반복 횟수를 중심으로 측정 - 빅오 표기법for (int i = 0; i => 입력 크기 n의 모든 입력에 대한 알고리즘에 필요한 시간 : 10n² + n -> O(n²) 빅오 표기법: 입력 범위 n을 기준으로 로직이 몇 번 반복되는지 나타내는 것= '가장 영향을 많이 끼치는' 항의 상수 인자를 빼고 나머지 항을 없앤 것 시간 복잡도의 존재 이유효율적인 코드로 개선하는 데 쓰이는 척도가 되기 때문ex. 버튼을 누르고 화면이 나타나는데 이 로직이 O(n²)의 시간 복잡도를 가지고 9초가 걸린다면O(n)의 시간복잡도를 가지는 알고리즘으로 개선한다면 3초가 걸린다 시간 복잡도의 속도 비교 공간 ..

중첩 루프 조인NLJ, Nested Loop Join : 중첩 for 문과 같은 원리로 조건에 맞는 조인을 하는 방법-> 랜덤 접근에 대한 비용이 많이 증가하므로 대용량의 테이블에서는 사용하지 X ex. "t1, t2 테이블을 조인한다" 라고 했을 때 첫 번째 테이블에서 행을 한 번에 하나씩 읽고 그다음 테이블에서도 행을 하나씩 읽어 조건에 맞는 레코드를 찾아 결괏값 반환 *참고블록 중첩 루프 조인(BNL, Block Nested Loop) : 조인할 테이블을 작은 블록으로 나눠서 블록 하나씩 조인 (중첩 루프 조인에서 발전) 정렬 병합 조인: 각각의 테이블을 조인할 필드 기준으로 정렬하고 정렬이 끝난 이후에 조인 작업을 수행하는 조인-> 조인할 때 쓸 적절한 인덱스가 없고 대용ㄹㅇ의 테이블들을 조인하고..

인덱스의 필요성인덱스 = 데이터를 빠르게 찾을 수 있는 하나의 장치 B-트리인덱스는 보통 B-트리라는 자료 구조로 이루어짐루트 노드, 리프 노드, 루트노드와 리프노드 사이에 있는 브랜치 노드로 나뉨ex. E를 찾는다고 하면 ㅈㄴ체 테이블을 탐색하는 것이 아니라 E가 있을 법한 리프 노드로 들어가서 E를 탐색자료 구조 없이 E를 탐색하고자 함 -> A,B,C,D,E 다섯 번 탐색 해야함but 이렇게 노드들도 나누면 2번만에 리프 노드 찾을 수 있다 57을 찾을 때맨 위 루트 노드부터 탐색이 일어나며 브랜치 노드를 거쳐 리프 노드까지 내려옴57보다 같거나 클 때까지 46, 53, 57 등 정렬된 값을 기반으로 탐색하는 것을 볼 수 있다루트 노드부터 시작하여 마지막 리프 노드에 도달 -> 57이 가리키는 데이..

관계형 데이터베이스RDBMS : 행과 열을 가지는 표 형식 데이터를 저장하는 형태의 데이터베이스, SQL이라는 언어 조작 MySQL대부분의 운영체제와 호환되며 가장 많이 사용하는 데이터베이스C, C++로 만들어졌으며 MyISAM 인덱스 압출 기술, B-트리 기반의 인덱스, 스레즈 디반의 메모리 할당 시스템, 매우 빠른 조인, 최대 64개의 인덱스 제공대용량 DB를 위해 설계롤백, 커밋, 이중 암호 지원 보안 등의 기능을 제공MySQL의 스토리지 엔진 아키텍처스토리지 엔진 : 모듈식 아키텍처로 쉽게 스토리지 엔진을 바꿀 수 있으며 데이터 웨어하우징, 트랜잭션 처리, 고가용성 처리에 강점스토리지 엔진 위에는 커넥터 API 및 서비스 계층을 통해 MySQL 데이터베이스와 쉽게 상호 작용 가능쿼리 캐시를 지원해..

트랜잭션트랜잭션 : 데이터베이스에서 하나의 논리적 기능을 수행하기 위한 작업의 단위데이터베이스에 접근하는 방법 : 쿼리 -> 트랜잭션 = 여러 쿼리들을 하나로 묶는 단위원자성, 일관성, 독립성, 지속성 - ACID 특징원자성all or nothingatomicity : 트랜잭션과 관련된 일이 모두 수행되었거나 되지 않았거나를 보장하는 특징 커밋과 롤백커밋 = 여러 쿼리가 성공적으로 처리되었다고 확정하는 명령, 트랜잭션 단위로 수행되며 변경된 내용이 모두 영구적으로 저장롤백 = 트랜잭션으로 처리한 하나의 묶음 과정을 일어나기 전으로 돌리는 일-> 커밋과 롤백 덕에 데이터 무결성이 보장, 변경 사항 쉽게 확인, 해당 작업 그룹화 트랜잭션 전파: 커넥션 단위로 수행하기 때문에 커넥션 객체를 넘겨서 수행해야함 ..

Entity Relationship Diagram: 데이터베이스를 구축할 때 가장 기초적인 뼈대 역할, 릴레이션 간의 관계들을 정의한 것 ERD의 중요성시스템 요구사항 기반으로 작성 -> 데이터베이스 구축의 기반디커빙 또는 비즈니스 프로세스 재설계가 필요한 경우 설계도 역할 담당관계형 구조로 표현할 수 있는 데이터를 구성하는 데 유용할 수 있음비정형 데이터를 충분히 표현할 수 없음 예제로 배우는 ERD승원 영업부서의 ERD요구사항영업사원은 0~n명의 고객을 관리고객은 0~n개의 주문을 넣을 수 있다주문에는 1~n개의 상품이 들어간다무무오브레전드의 ERD요구사항선수들은 1명의 챔피언을 고를 수 있다챔피언은 한 개 이상의 스킬을 갖는다스킬은 한 개 이상의 특성을 갖는다 정규화 과정: 릴레이션 간의 잘못된 ..