본문 바로가기

분류 전체보기64

[DBMS] RDBMS에서 트랜잭션의 ACID 규칙 1. RDBMS에서 트랜잭션이란 무엇인가?데이터베이스에서 데이터에 대한 하나의 논리적인 작업 단위를 의미한다.논리적인 이유로 여러 SQL문들을 단일 작업으로 묶어서 나누어질 수 없도록 만든 것트랜잭션 내 SQL문들은 모두 성공하는 경우 commit되고, 하나라도 실패하는 경우에는 전체가 rollback된다.트랜잭션 내 SQL문 중에 일부만 성공해서 DB에 반영되는 일은 일어나지 않는다.트랜잭션의 하나의 예로 은행 어플에서 계좌이체를 한다고 가정해보자.계좌이체라는 하나의 작업을 위해서 은행 어플에서는 내부적으로 여러 단계의 업무를 거쳐야 할 수 있다.간단하게 업무를 요약하면 [송신자 계좌 금액 감소], [수신자 계좌 금액 증가]이 있을 것이다.이렇게 두 단계에 대한 데이터를 처리하는 논리적 행위를 트랜잭.. 2024. 3. 13.
[AWS] AWS VPC 및 서브넷 설정하기 & Public EC2 생성 후 외부 접근 허용 AWS에 대해서 공부한 내용을 바탕으로 AWS VPC와 Subnet을 설정하고 Public EC2를 생성하여 인터넷 게이트웨이를 통한 외부 접근 허용이 가능한 상태까지 만드는 실습을 진행해보려고 한다. 먼저 AWS의 VPC, Subnet, Route Table, IGW 등 다양한 개념에 대해서 이해하기 위해 개념을 잘 모르는 사람들은 아래의 이전 포스팅을 확인하자. [ASAC_04/AWS] AWS 개념 - VPC / Subnet / Route Table / Internet Gateway1. VPC (Virtual Private Cloud) VPC는 약자 그대로 AWS 클라우드에서 제공하는 사용자의 AWS 계정 전용 가상 네트워크다. 사용자는 AWS에서 제공하는 VPC 내에서 서브넷, 라우팅 테이블, 인.. 2024. 3. 7.
[AWS] AWS 개념 - VPC / Subnet / Route Table / Internet Gateway 1. VPC (Virtual Private Cloud)VPC는 약자 그대로 AWS 클라우드에서 제공하는 사용자의 AWS 계정 전용 가상 네트워크다.사용자는 AWS에서 제공하는 VPC 내에서 서브넷, 라우팅 테이블, 인터넷 게이트웨이 등을 생성하고 제어할 수 있다.EC2 인스턴스와 같은 AWS 리소스는 VPC 내에 있는 특정 서브넷에서 생성할 수 있다.VPC는 리전 단위이다.VPC 범위를 설정하고 가용 영역(AZ)내에  서브넷을 추가하고 보안 그룹을 연결한 뒤, 라우팅 테이블을 구성하는 것이 보통 AWS를 사용하는 순서이다.따라서 VPC의 생성은 AWS 사용 할 때 첫 순서이다.1-1. VPC를 이해하기 위한 사전 지식Region (리전) : AWS의 물리적 서버가 위치하고 있는 국가 단위의 위치 (ex.. 2024. 3. 5.
[React] Next.js Error (Waring: Expected server HTML to contain a matching <header> in <html> next js에서 프로젝트를 진행하고 있는데 npm run dev를 통해 페이지를 출력하는데 위의 사진과 같은 에러가 발생했다.이 에러는 페이지는 출력되지만 따로 에러만 발생해서 확인할 수 있다에러가 왜 발생했는지 자세하게 확인하기 위해 맨 밑 줄에 "See more info here: https://nextjs.org.docs.message/react-hydration-error" 부분을 확인해보자. 페이지를 확인해보면 아래와 같은 화면을 볼 수 있다. Common Causes를 확인해보며 다양한 구글링을 통해 문제를 해결해보려 했다.결론적으로 말하면 내가 발생한 에러는 1번에 해당하는 HTML 태그가 잘못 중첩된 경우에 해당되었다.다른 사람들이 쓴 포스팅을 확인해보면 2번의 문제로도 발생할 수 있는 .. 2024. 2. 27.
[React] React Hooks 1. React Hooks 란? 리액트 컴포넌트는 함수형 컴포넌트(Functional Component)와 클래스형 컴포넌트(Class Component)로 나뉜다.리액트 초기에는 일반적으로 함수형 컴포넌트를 사용하였으나, 값의 상태를 관리하거나 Life Cycle Method를 사용해야 할 때 클래스형 컴포넌트를 사용하였다. 하지만 클래스형 컴포넌트의 경우 아래와 같은 단점이 있었다. 컴포넌트 사이에서 상태 로직을 재사용하기 어렵다.복잡한 컴포넌트들을 이해하기 어렵다.Class는 사람과 기계를 혼동시킨다(this 키워드 등)이와 같은 문제를 해결하기 위해 리액트는 Hook을 도입하여 class를 작성하지 않고 State와 다양한 React의 기능들을 함수형 컴포넌트에서도 사용 가능하게 만든 기능이다.즉.. 2024. 2. 14.
[React] React의 특징 V-DOM(Virtual DOM) 1. DOM 이란?DOM은 Document Object Model(문서 객체 모델)의 약자로, 웹 브라우저 안에서 HTML 문서에  "html 태그"들을 JavaScript가 접근과 조작할 수 있도록 메모리에 보관할 수 있는 객체로 만든 것이다.  즉 웹 페이지를 이루는 태그들을 자바스크립트가 이용할 수 있게끔 브라우저가 트리구조로 만든 객체 모델을 의미하며 DOM은 HTML과 자바스크립트를 서로 이어주는 역할을 하고 있다.2. 기존 웹 브라우저 렌더링 방식과 발생할 수 있는 문제점2-1. 기존 브라우저 렌더링 방식DOM Tree 형성 : 서버에서 보낸 HTML 파일을 브라우저가 해석(Parsing)하여 DOM 트리를 만든다.CSSOM Tree 형성 : 서버에서 보낸 CSS 파일을 브라우저가 해석(Par.. 2024. 2. 6.
[JavaScript] 자바스크립트 기본, 심화 문법 및 엔진 동작 원리 1. 함수형 프로그래밍 패러다임자바스크립트는 함수형 프로그래밍 패러다임을 추구하며, 추가로 객체지향 프로그래밍 패러다임도 지원한다.자바스크립트의 핵심은 함수(함수형 프로그래밍 패러다임)와 객체(객체지향 프로그래밍 패러다임)이다. 객체의 경우 객체지향 프로그래밍 패러다임의 여러 패턴들을 적용하고 싶다면, 클래스를 활용할 수 있다.그 중 함수형 프로그래밍 패러다임에 대해 알아볼 것인데 함수형 프로그래밍은 아래의 2개 조건을 만족하는 것을 의미한다.일급함수 : 함수 변수 할당 + 함수 파라미터 + 함수 반환함수 변수 할당 = 함수 표현식(Expression)함수 파라미터함수 반환순수 함수 : No-Side-Effects (참조 투명성) = Thread-Safe = 함수 정의할 때 완전한 문장을 만들어야한다.기.. 2024. 2. 5.
[JavaScript] 우테코 로또 게임 만들기 본 과제는 우테코에서 프리코스에서 진행한 자바스크립트를 활용한 로또 게임 제작하는 프로그래밍 과제를 기반으로 진행하였습니다.1. 과제 내용 과제는 우테코에서 진행한 자바스크립트를 활용하여 간단한 로또 게임을 만드는 프로그래밍 과제로 기능 자체는 간단했지만 아래의 요구사항을 따르며 프로그래밍을 진행해야 했다. 특히 기능을 구현하기 전 기능 목록을 작성하고 기능 단위로 커밋을 하는 방식으로 진행해야 했다.1-1. 기능 요구사항로또 게임 기능을 구현해야 한다. 로또 게임은 아래와 같은 규칙으로 진행된다. - 로또 번호의 숫자 범위는 1~45까지이다.- 1개의 로또를 발행할 때 중복되지 않는 6개의 숫자를 뽑는다.- 당첨 번호 추첨 시 중복되지 않는 숫자 6개와 보너스 번호 1개를 뽑는다.- 당첨은 1등부터 5.. 2024. 1. 31.
[JavaScript] map / set / trim / includes / filter / reduce 1. map 활용map() 메서드는 배열 각 요소에 대하여 주어진 함수를 수행한 결과를 모아 새로운 배열을 반환하는 메서드로 어떤 배열에 있는 모든 요소들의 값을 콜백 함수를 활용해 변경하여 만든 값들을 모은 배열이 필요할 때 사용한다. map() 메서드의 사용 방법은 매개변수로 배열의 인자를 받고, 해당 인자에 어떤 변화를 준 뒤 반환하는 식으로 사용한다.map은 3개의 매개변수를 가지고 있다.value : 현재 요소index : 요소의 인덱스array : map()을 호출한 원본 배열그렇다면 map의 다양한 사용 예시를 통해 map에 대해서 조금 더 자세히 이해해보자 간단한 배열에서 map을 통해 배열 값을 조작하기let arr = [1, 2, 3, 4];let modifiedArr = arr.map.. 2024. 1. 30.

티스토리툴바