tw_wt.log https://velog.io/ Mon, 20 Apr 2026 13:29:25 GMT https://validator.w3.org/feed/docs/rss2.html https://github.com/jpmonette/feed tw_wt.log https://velog.velcdn.com/images/tw_wt/profile/5e157d0f-8853-4d05-915a-1e6c5cbb9cfb/image.jpg https://velog.io/ Copyright (C) 2019. tw_wt.log. All rights reserved. <![CDATA[Gmail에서 SMTP사용 세팅법(spring ver.) ]]> https://velog.io/@tw_wt/Gmail%EC%97%90%EC%84%9C-SMTP%EC%82%AC%EC%9A%A9-%EC%84%B8%ED%8C%85%EB%B2%95 https://velog.io/@tw_wt/Gmail%EC%97%90%EC%84%9C-SMTP%EC%82%AC%EC%9A%A9-%EC%84%B8%ED%8C%85%EB%B2%95 Mon, 20 Apr 2026 13:29:25 GMT 내가 만들고 있는 프로젝트에서 회원가입 할 때, 이메일 인증을 해야 회원가입 할 수 있도록 만들어 볼 예정이다.

시작하기 전, IMAP 사용을 해야한다. 그래야 전달이 되기 때문이다. IMAP은 2025년1월 이후로부터 항상 사용 설정되어있기 때문에 설정 해 줄 필요가 없다. 따라서 처음부터 보안을 설정해주면 된다.

Google 계정 관리 -> 보안 및 로그인 -> 2단계 인증을 확인한다.

만약 2단계 인증이 되어있지 않다면 사용 설정일이 나와있지 않다.

2단계 인증이 되어있지 않으면 설정하고 돌아오자.(2단계 인증을 하지 않으면 앱 비밀번호가 검색이 되지 않는다. 꼭 하고 검색하자)

설정이 되어있는 사람들은 바로 앱 비밀번호를 검색해서 들어간다.

이후 내가 사용하고 싶은 앱 이름을 적은 후 비밀번호를 생성한다.

앱 이름을 작성하고나면 16자리 비밀번호가 나오게 된다. 나중에 SMTP를 사용할 때, 이용하면 된다. (이 비밀번호는 실제 구글 아이디 비밀번호와 다르다.)

발급을 받고나면 내가 사용하고 있는 인텔리제이로 넘어가서 세팅해주면 끝난다.

인텔리제이에서 application.yml 파일로 넘어가서 아이디와 비밀번호를 넣어 놓은 후, 아이디와 비밀번호를 환경변수로 넣어놓았다.

마지막으로 환경변수 설정하는곳으로 가서 값을 넣어주면 끄읏

여기서 아까 받은 비밀번호 16자리는 꼭 공백없이 넣어줘야 정상작동한다.

]]> <![CDATA[[WEB] HTML, CSS, JAVASCRIPT, BOOTSTRAP]]> https://velog.io/@tw_wt/WEB-HTML-CSS-JAVASCRIPT-Bootstrap https://velog.io/@tw_wt/WEB-HTML-CSS-JAVASCRIPT-Bootstrap Sun, 27 Apr 2025 02:33:24 GMT HTML에 대해서 시작하기 전, WEB에 대해 간단하게 말해보려고 한다.

WEB

WEB은 전 세계의 컴퓨터와 정보를 연결하는 시스템이다. 그러다보니 사람들은 인터넷과 WEB을 혼동하는 경우가 많은데

  • 인터넷 : 컴퓨터들 간의 물리적인 연결망(네트워크)
  • WEB : 인터넷 위에서 정보(문서, 이미지, 영상 등)를 주고받는 서비스다.

WEB은 주로 3가지로 이루어져 있는데

  1. HTML (HyperText Markup Language): 웹페이지를 구성하는 문서 형식
  2. HTTP (HyperText Transfer Protocol): 정보를 주고받는 통신 규칙
  3. 웹 브라우저 (Browser): 웹페이지를 읽어들이고 보여주는 프로그램 (예: Chrome, Safari)

이 3가지로 이루어져 있다.

✅HTML

HTML은 웹 페이지의 구조를 만드는 언어다.

HTML의 역사를 간단히 알아보자면 -> 1991년 팀 버너스리가 개발했다. -> 최초의 목적은 과학자들이 문서를 공유하기 위한 것 -> 현재는 HTML5 버전이 표준이다. 즉, 웹은 "정보를 연결하는 방식"으로 탄생했고, HTML은 "그 정보를 표현하는 언어"다.

구조

HTML은 태그를 사용해서 구조를 표시한다.

  • 태그(tag)

  • 웹페이지를 구성하는 요소(element)를 정의하는 명령어다.

  • 태그는 항상<로 시작하고 >로 끝난다.

    <p>안녕하세요!</p>

- ```<p>``` : 문단의 시작
- ```</p>``` : 문단의 끝

<br>

- **속성**
-> 태그에 **추가 정보를 제공**한다.

네이버


```href```는 ```<a>``` 태그의 "링크할 주소"를 정해주는 속성이다.

<br>

- **문법**
-> HTML을 사용할 때 **지켜야하는 규칙**이다. 
-> 문서의 시작은 항상 ```<!DOCTYPE html>```으로 시작한다.
-> HTML은 대, 소문자를 구분 하지 않는다.
-> 태그는 올바르게 중첩해야한다.

안녕하세요 반갑 습니다.

```
  • HTML 기본 구조
    <!DOCTYPE html>
<html lang="ko"> 
<head>
 <meta charset="UTF-8">
<title>문서의 제목</title>
</head>
<body>
</body>
</html>

✅CSS

HTML로 만든 웹페이지를 예쁘게 꾸미는 언어다. 즉, HTML은 웹페이지의 "내용"과 "구조"를 담당 CSS는 그 "내용"에 디자인과 스타일을 입힌다.

CSS의 역사를 간단히 알아보자면 -> 초창기 웹(1990~1994년)은 HTML만 사용했기 때문에 웹페이지는 모두 기본 글꼴, 기본 배경, 단순 텍스트로 이루어져 있었다. -> 1994년, 하콘 위움 리라는 노르웨이 개발자가 개발했다. -> CSS1 표준화 이후, HTML은 구조, CSS는 스타일을 담당하게 되어 웹페이지 디자인이 훨씬 쉬워졌다. -> 현재는 CSS3까지 나온 후 CSS4는 없지만, 모듈별로 발전 중이다.

구조

  • 문법 -> 선택자를 통해 어떤 HTML 요소를 꾸밀지 지정한다. -> {} 중괄호 안에 속성과 값을 쌍으로 작성한다.

    선택자 {
속성: 값;
}

스타일은 위에서 아래로 적용되며, 나중에 정의된 것이 우선이다.

  • CSS 기본 구조
p {
  color: red;
  font-size: 16px;
}
<!--p라는 태그안에 있는 내용을 color는 빨간색, 글씨 크기를 16px로 바꾼다.-->

✅Javascript

Javascript는 웹페이지를 "동적으로" 만들어주는 프로그래밍 언어다. 즉, 움직임과 기능을 추가한다.

Javascript의 역사를 간단히 알아보자면 -> 1990년대 초, 웹은 아직 매우 정적(static)이었다. -> 1995년, 넷스케이프는 한 개발자 브렌던 아이크에게 "브라우저 안에서 작동할 수 있는 스크립트 언어를 만들어달라"고 요청했다. -> 10일만에 만들어 냈고, 처음 이름은 Mocha였고, 이후 Livescript 마지막으로 Javascript라는 이름이 되었다. -> 마지막으로 Javascript라는 이름은 당시 Java 언어가 매우 인기있었다. 그래서 넷스케이프는 마케팅을 위해 Javascript라는 이름을 붙였다고한다.

특징

  • 동적 기능을 추가할 수 있다.

  • 버튼 클릭이나 팝업 창, 슬라이더 등 인터랙션이 가능해진다.

  • 이벤트 처리가 가능하다.

  • 사용자의 입력, 클릭 등에 반응한다.

구조

  • 규칙 -> 변수명, 함수명 등 모두 대소문자를 구분한다. -> 영어 대소문자, 숫자, _ , $ 사용 가능 (단, 숫자로 시작할 수 없다.) -> 코드 블록 사용 조건문, 반복문, 함수 등에서는 반드시 {}로 블록 정의한다.

  • 문법

  • 일반 언어와 같이 변수를 선언하고 조건문, 반복문, 함수 등 여러가지 사용이 가능하다.

  • 변수는 var, let, const가 있다. var : 오래된 방식 (현재는 추천하지 않음.) let : 블록 범위 변수 const : 변하지 않는 상수

 let name = "TW";
const pi = 3.14;

  • Javascript 기본 구조

  • HTML안에 직접 작성하는 것, 외부 파일로 작성 두가지 방법이 있다.

HTML안에 직접 작성

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <title>JavaScript 예제</title>
</head>
<body> // body 부분 안에 직접 작성한다.
  <h1>안녕하세요</h1>
  <button onclick="sayHello()">버튼</button>

  <script>
    function sayHello() {
      alert("안녕하세요!");
    }
  </script>
</body>
</html>

외부 파일로 작성 (권장)

  1. Script.js라는 파일 생성 후 작성한다. 
function sayHello() {
  alert("안녕하세요!");
}
  1. HTML에 연결한다. 
<script src="script.js"></script>
<!--위 내용을 보면 HTML안 스크립트에 작성하면 된다.-->

Script가 길어지면 HTML안에 작성했을 때, 가독성이 떨어질 수 있어 가급적 외부 파일로 작성을 추천한다.

✅Bootstrap

Bootstrap은 웹사이트를 빠르고 쉽게 만들기 위한 CSS + JavaScript 프레임워크다.

-> 2011년 트위터(Twitter) 개발자들이 내부용 툴킷으로 시작했다. -> 점점 인기가 높아져 공개됐다. -> 현재는 전 세계적으로 가장 인기 있는 CSS 프레임워크 중 하나다.


특징

  • 반응형 디자인이 기본이다.
  • 별다른 CSS를 직접 작성하지 않고도, 클래스를 붙이는 것만으로 쉽게 스타일링 가능하다.

사용법

->HTML 문서의 안에 아래 코드를 추가한다.

<!-- Bootstrap CSS 연결해주는 링크 -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">

-> 필요하면 JavaScript 기능(모달창, 드롭다운 등)을 위해 JS 파일도 추가해준다.

<!-- Bootstrap JavaScript 연결 -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>

->이후, Bootstrap에서는 HTML 태그에 "특정 클래스명"을 추가하면 스타일이 자동으로 적용된다.

위 내용을 코드에 적으면 이렇게 확인 이라는 버튼이 생기게 된다.

  • btn : 버튼의 기본 스타일

이렇게 "특정 클래스명" 을 추가하면 바로 적용되는 것을 볼 수 있는데, 그러면 주요 컴포넌트에 대해 알아보자.

특정 클래스명 예시

주로 쓰는것만 가지고 왔다.

주요 클래스 예시 코드 설명
버튼(Button) <button class="btn btn-success">저장</button> 초록색 버튼
그리드 시스템(Grid) <div class="row"><div class="col-6">왼쪽</div><div class="col-6">오른쪽</div></div> 가로 2등분
카드(Card) <div class="card"><div class="card-body">내용</div></div> 박스 스타일 카드
네비게이션바(Navbar) <nav class="navbar navbar-light bg-light">...</nav> 상단 메뉴바
폼(Form) <input type="text" class="form-control"> 입력 폼 스타일링

마지막으로 전체 기본 예시를 보고 마무리하겠다.

Bootstrap 전체 기본 예시

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <title>Bootstrap 예제</title>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>

  <div class="container">
    <h1 class="text-center text-primary my-5">Welcome!</h1>

    <button class="btn btn-success">시작하기</button>

    <div class="row mt-4">
      <div class="col-6 bg-info p-3">왼쪽 박스</div>
      <div class="col-6 bg-warning p-3">오른쪽 박스</div>
    </div>
  </div>

  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>

]]> <![CDATA[[정규 표현식] 정규 표현식(Pattern)]]> https://velog.io/@tw_wt/%EC%A0%95%EA%B7%9C-%ED%91%9C%ED%98%84%EC%8B%9D-%EC%A0%95%EA%B7%9C-%ED%91%9C%ED%98%84%EC%8B%9DPattern https://velog.io/@tw_wt/%EC%A0%95%EA%B7%9C-%ED%91%9C%ED%98%84%EC%8B%9D-%EC%A0%95%EA%B7%9C-%ED%91%9C%ED%98%84%EC%8B%9DPattern Sat, 26 Apr 2025 07:51:41 GMT 정규 표현식

정규 표현식이란 문자열의 일정한 패턴을 표현하는 일종의 형식 언어다. 주로 문자열 검색, 데이터 유효성 검사(이메일, 전화번호 등), 텍스트 치환 등에 사용된다.




정규 표현식 특징

  • 패턴 기반 검색 정규표현식은 단순한 문자열 검색이 아닌, 형태(패턴)를 기준으로 검색한다. ex) 'apple'이라는 단어가 아니라 a[a-z]{4} 같은 규칙으로도 "apple"을 찾을 수 있다.

  • 언어 및 도구 독립적 대부분의 프로그래밍 언어(예: Python, JavaScript, Java 등)와 텍스트 편집기(예: VS Code, Sublime Text)에서 사용 가능하다.




정규 표현식 장/단점

장점

  • 다양한 문자열 조작 가능 문자열을 단순히 찾는 것 뿐만 아니라 검색, 치환, 추출, 분할 등 다양하게 사용한다.
  • 대부분의 언어 지원 특징에서도 얘기한 것 처럼 다양한 프로그래밍 언어에서 사용이 가능하다.

단점

  • 가독성 부족 아무래도 길고 복잡한 코드를 간결하게 쓰다보니 복잡한 표현이 많아 읽기 어렵다.
  • 성능 저하 복잡한 정규식에서는 성능 이슈가 발생할 수 있다. 특히, .* 같은 그리디 패턴이 예상보다 많은 범위를 잡을 수 있어 주의 해야한다.



정규 표현식 기본 문법

그렇다면 어떻게 쓰는지 기본 문법에 대해 알아보자.

기호 의미 예시
. 아무 문자 한 개 a.b → "aab", "acb" 등
* 앞 문자가 0번 이상 반복 a*→ "", "a", "aaa" 등
+ 앞 문자가 1번 이상 반복 a+ → "a", "aa" 등
? 앞 문자가 0번 또는 1번 a? → "", "a"
[] 문자 집합 [abc] → "a", "b", "c" 중 하나
[^] 부정 문자 집합 [^abc] → "a", "b", "c" 제외
\d 숫자 (0~9) \d+ → 숫자 하나 이상
\w 문자 (알파벳+숫자+_) \w+
^ 문자열의 시작 ^a → "a"로 시작
$ 문자열의 끝 z$ → "z"로 끝남
{n} n번 반복 a{3} → "aaa"
{n,m} n~m번 반복 a{2,4} → "aa", "aaa", "aaaa"

그냥 문법만 보기에는 이해하기 힘든 부분이 많다. 그래서 예시를 들어서 설명해보려고 한다.



예시

네이버 회원가입으로 예시를 들어보려고 한다. 우리는 회원가입 할 때 *아이디, 비밀번호, 이름, 생년월일 *등 내 정보를 기입한다. 그 때, 네이버에서 맞춰놓은 형식에 맞지 않으면 가입할 수 없다.

나는 아이디를 111로 지정하고싶었지만, 밑에 5~20자의 영문 소문자, 숫자와 특수기호(_),(-)만 사용 가능하다고 나와있다.

그렇다면 이런 조건은 어떻게 걸어야 할까? 먼저 허용 문자를 지정한다.

  1. [a-z0-9_-]
  • a-z : 영문 소문자 a~z를 말한다.
  • 0-9 : 숫자를 사용.
  • -,_ : 특수문자 _와-만 사용.

그 다음에는 길이를 지정한다.

  1. [a-z0-9_-]{5,20}
  • {5,20} : 5~20까지로 길이를 지정.

마지막으로는 이렇게만 작성하면 '일치하는 부분'만 확인하기 때문에 우리는 문자열 전체를 확인하기 위해 시작과 끝인 ^,$을 넣어줘야 한다.

  1. ^[a-z0-9_-]{5,20}$

마지막은 자바로 예시를 들어보겠다.

import java.util.regex.*;

public class IDValidator {
    public static void main(String[] args) {
        String userId = "gpt_user-1";  // 테스트할 아이디
        String pattern = "^[a-z0-9_-]{5,20}$";

        boolean isValid = Pattern.matches(pattern, userId);

        if (isValid) {
            System.out.println("유효한 아이디입니다.");
        } else {
            System.out.println("유효하지 않은 아이디입니다.");
        }
    }
}

기본 문법 이외 것들도 많고 Matcher class, ReplaceAll class도 있다. 그것들은 다음에 다뤄보도록 하겠다.

]]> <![CDATA[[Database] DB 명령어]]> https://velog.io/@tw_wt/Database-DB-%EB%AA%85%EB%A0%B9%EC%96%B4 https://velog.io/@tw_wt/Database-DB-%EB%AA%85%EB%A0%B9%EC%96%B4 Sat, 19 Apr 2025 07:18:48 GMT 다른 언어도 명령어가 있듯이, DB에도 명령어가 있다. 오늘은 관계형 데이터베이스(DBMS)에서 쓰이는 SQL의 구조와 명령어에 대해서 알아보려고 한다.

SQL

SQL 이란(Structured Query Language)의 약자로 구조화된 쿼리 언어이다. 관계형 데이터베이스에 저장된 데이터를 관리하고 처리하기 위한 프로그래밍 언어라고도 한다.

이 SQL의 구조를 보면 크게 DML, DDL, DCL, TCL 4가지로 볼 수 있다.

오늘은 그 중에서 DML, DDL, DCL 3가지에 대해서 알아보려고 한다.

DDL

DDL이란(DDL: Data Definition Language)의 약자로 데이터베이스의 구조를 정의하는 명령어이다.

데이터베이스의 뼈대를 만드는 명령어로, 테이블을 생성, 수정, 삭제 할 수 있다.

CREATE

  • 테이블 생성 
CREATE TABLE 학생 ( -- 말 그대로 '학생'이라는 테이블을 생성해준다.
    학생ID INT PRIMARY KEY,
    이름 VARCHAR(50),
    나이 INT,
    전공 VARCHAR(50) -- 총 4가지로 학생, 이름, 나이, 전공 순으로 타입에 맞게 생성 해줄수있다.
);

ALTER

  • 테이블 수정 ```sql ALTER TABLE 학생 ADD COLUMN 주소 VARCHAR(100);
  • -'학생' 테이블에 주소라는 열을 추가해줄 수 있다. 타입은 VARCHAR 타입이고 길이는 100이다.
    > 여기서 VARCHAR는
가변 길이 문자열을 뜻함. 문자와 숫자를 저장할 수 있는 데이터 타입이다.

DROP

  • 테이블 삭제 ```sql DROP TABLE 학생;
    • 학생이라는 테이블을 삭제한다. 테이블을 삭제하는 것이기에 안에 있는 데이터도 같이 삭제된다.

DML

DML은(DML: Data Manipulation Language)의 약자로 데이터를 조작하는 명령어 이다.

데이터를 조회, 추가, 수정, 삭제 할 수 있다.

SELECT

  • 데이터 조회
    SELECT * FROM 학생; --학생 테이블의 전체 데이터를 조회 할 수 있다.

INSERT

  • 데이터 추가 ```sql INSERT INTO 학생 (학생ID, 이름, 나이, 전공) VALUES (4, '박지민', 23, '화학공학');
  • -학생 테이블에 학생ID, 이름, 나이, 전공 순으로 4, '박지민', 23, '화학공학' 값이 추가됨.

UPDATE

  • 데이터 수정
UPDATE 학생 SET 나이 = 22 WHERE 학생ID = 1;
--학생 테이블에 학생ID가 1인 데이터 중 나이를 22로 수정한다.

DELETE

  • 데이터 삭제
DELETE FROM 학생 WHERE 학생ID = 2;
--학생 테이블에 학생ID가 2인 데이터를 전체 삭제한다.
--DROP과는 다르게 WHERE 조건을 걸어 테이블 안에 있는 일정 데이터 삭제가 가능하다.

DCL

DCL이란(DCL: Data Contral Language)의 약자로 데이터를 제어하는 명령어이다.

데이터베이스에 대한 접근 권한을 제어할 수 있다.

GRANT

  • 데이터 권한 부여 ```sql GRANT SELECT, INSERT ON 학생 TO 사용자1;
  • -사용자1에게 학생테이블의 SELECT, INSERT 권한을 부여한다.

REVOKE

  • 데이터 권한 취소 ```sql REVOKE INSERT ON 학생 FROM 사용자1;
  • -사용자1에게 학생테이블의 INSERT 권한을 취소한다.

<출처>

사진

]]> <![CDATA[[Database] DB의 정의와 종류 ]]> https://velog.io/@tw_wt/Database-DB%EC%9D%98-%EC%A0%95%EC%9D%98%EC%99%80-%EC%A2%85%EB%A5%98 https://velog.io/@tw_wt/Database-DB%EC%9D%98-%EC%A0%95%EC%9D%98%EC%99%80-%EC%A2%85%EB%A5%98 Sat, 19 Apr 2025 06:52:01 GMT 데이터베이스

데이터베이스

데이터를 체계적으로 저장하고, 관리하며, 필요할 때 쉽게 꺼내 쓸 수 있도록 만든 정보의 집합 "데이터의 집합" 이라고 볼 수 있다.

데이터베이스 특징

실시간 접근(realtime access) 데이터베이스를 조회하는 사용자 질의에 대한 처리 시간이 몇 초를 넘지 않아야 한다는 것을 의미한다.

*지속적인 변화(continuous changes) * 데이터베이스에도 추가, 삭제, 수정과 같은 작업을 통해 현실 세계의 변화를 지속적으로 반영한다.

동시 공유(concurrent sharing) 서로 다른 응용 업무에서 다수의 사용자가 동일한 데이터를 공유할 수 있는 환경을 제공한다.

*내용에 의한 참조(reference by content) * 데이터베이스에서 데이터를 검색하는 방식은 데이터의 일부 내용에 의해 참조되는 방식이다.

이러한 데이터를 관리하고 운영하려면 소프트웨어가 필요하다. 그래서 나온것이 바로 DBMS이다.

DBMS

DBMS는(Database Management System)의 약자로 "데이터베이스를 관리하고 운영하는 소프트웨어"이다.

아래의 예시 사진을 보도록 하자.

주인, 직원, 인터넷 뱅킹, Atm 기기 여러가지의 데이터가 있을 것이다. 그런데 이 데이터를 어떻게 관리해야할까? 바로 DBMS를 이용해서 동시 접속이 가능하고 데이터를 공유해서 관리한다. 그러다 보니 DBMS는 데이터 중복 최소화, 중복 처리 지원이 가능하다.
초반에는 사용하기 편리하고 좋았지만 점점 갈수록 데이터는 많아지고 복잡해져 어떻게하면 더 효율적으로 관리 할 수 있을지 생각했다. 그래서 나온 것이 RDBMS이다.

RDBMS

RDBMS는(Relational Database Management System)의 약자로 "정형 데이터를 테이블 구조로 관리하고 운영하는 소프트웨어"이다.

그래서 데이터는 테이블 구조로 관리하고 저장한다. 테이블 구조로 저장하다보니 복잡한 데이터도 표현이 가능해져 JOIN연산 등을 통해 테이블 관계를 쉽게 다룬다. 그러다보니 RDBMS에서는 Mysql이나 oracle DB를 많이 사용하고 있다. 하지만 수평 확장이 어렵고 빅데이터 처리에는 여전히 한계가 있다. 또한 테이블 구조로는 비정형 데이터(사진, 동영상 등)를 담기에 어려움이 있었다. 그래서 나온 것이 NoSQL이다.

NoSQL

NoSQL은(Not Only SQL)의 약자로 "관계형 데이터베이스가 아닌 모든 종류의 데이터베이스", 비관계형 데이터베이스를 뜻한다.

모든 종류의 데이터베이스이다 보니 열형, 키-값형, 문서형, 그래프형도 NoSQL에 속한다. 그래서

  • 엄격한 스키마를 따르지 않는다.
  • 수평 확장에 유리하다.
  • 다양한 형태의 데이터를 유연하게 저장한다.

다양한 형태의 데이터를 유연하게 저장해서 좋지만, SQL 표준을 지원하지 않아 각 유형마다 쓰이는 언어가 DB마다 다르다. 각 유형마다 쓰이는 제품을 보자.

마지막으로 RDBMS 와 NoSQL에 대해 비교해보려고 한다.

RDBMS VS NoSQL

항목 RDBMS NoSQL
구조 테이블(정형 데이터) 기반 문서, 키-값, 그래프 등 다양한 구조
스키마 고정 스키마 (엄격함) 유연한 스키마 또는 무스키마
언어 표준 SQL 사용 DB마다 쿼리 언어 다름 (예: MongoQL, CQL 등)
확장성 수직 확장(서버 성능 업그레이드) 수평 확장(서버를 여러 대로 분산)
성능 복잡한 JOIN, 트랜잭션에 강함 대량 데이터 처리, 캐시, 실시간 로그에 강함
사용 은행, 회계 시스템, ERP,고객관리 시스템 실시간 채팅, SNS 피드, IoT 센서, 빅데이터 로그 분석

처음에 DBMS로 시작해 계층형  ->  망형  -> 관계형 -> 객체지향 -> NoSQL 순서로 발전해오면서 데이터베이스는 끊임없이 발전하고 있다. 앞으로도 많은 발전을 했으면 좋겠다.



<출처>

사진, NoSQL사진

]]> <![CDATA[[UML] Use Case Diagram ]]> https://velog.io/@tw_wt/UML-Use-Case-Diagram https://velog.io/@tw_wt/UML-Use-Case-Diagram Sun, 30 Mar 2025 14:30:33 GMT UML (Unified Modeling Language)

UML이란 Unified Modeling Language의 약자로 1997년 OMG에서 표준으로 채택한 통합모델링언어 이다.

즉, 어떠한 모델을 만드는 표준언어로서, 모델이란 것은 제품을 미리 검증하고, 설계하는 과정에서 필요하다.

크게 구조 / 행위 다이어그램으로 나뉜다.

  • 구조 다이어그램은 시스템을 구성하는 구성 요소와 이들 간의 관계를 시각화하여 시스템의 정적인 측면을 보여준다.
  • 행위 다이어그램은 실시간으로 발생하는 변화와 흐름을 표현하여 시스템의 동작을 보여준다.

개발하는 시스템의 유형과 규모에 따라서 필요한 다이어그램을 선택하여 사용한다.

Use Case Diagram (행위 다이어그램)

-- 시스템의 기능과 사용자 간의 상호작용을 시각적으로 표현하는 UML(통합 모델링 언어) 다이어그램의 한 종류이다.

유스 케이스 모델을 식당에서 볼 수 있는 메뉴판과 같은 개념으로 생각하면 된다. 메뉴를 보면 어떤 메뉴를 이용할 수 있는지, 개별 요리가 무엇인지, 가격은 얼마인지 알 수 있다. 또한 레스토랑에서 어떤 종류의 요리(이탈리안, 멕시칸, 한식...)를 제공하는지도 알 수 있다. 메뉴를 보면 해당 레스토랑에서 제공 받을 수 있는 식사 경험에 대한 전반적인 서비스를 예상할 수 있다. 메뉴는 사실상 레스토랑의 행동을 "모델링"하는 것이다. 유스 케이스 모델은 매우 강력한 계획 도구이기 때문에 일반적으로 모든 팀원이 시스템 및 소프트웨어 개발 주기의 모든 단계에서 사용한다.

구성요소

  1. 액터(Actor)
  • 시스템과 상호작용하는 외부 엔티티로, 사용자, 다른 시스템, 또는 하드웨어 장치 등을 나타냄
  • 액터는 시스템의 기능을 사용하는 주체
  1. 유스케이스(Use Case)
  • 시스템이 제공하는 기능이나 서비스를 나타냄
  • 액터가 시스템과 상호작용하는 특정 작업을 설명
  1. 관계(Relationship):
  • 액터와 유스케이스 간의 관계를 나타냄.
    • 연관(Association): 액터와 유스케이스 간의 기본적인 관계를 나타냄.

장단점

장점

이해 용이: 유스케이스 다이어그램은 시스템의 기능을 직관적으로 이해할 수 있도록 도와줍니다.

단점

세부사항 부족: 유스케이스 다이어그램은 기능의 흐름이나 세부적인 동작을 설명하지 않기 때문에, 추가적인 문서가 필요할 수 있다.

사용예제

1. 소프트웨어 개발

온라인 쇼핑몰: 고객이 상품을 검색하고, 장바구니에 추가하고, 결제하는 과정 등을 유스케이스로 표현할 수 있다.


2. 은행 시스템

ATM 시스템: 고객이 ATM을 통해 계좌 조회, 현금 인출, 입금 등을 수행하는 과정을 유스케이스로 나타낼 수 있다.


3.교육 관리 시스템

학생 관리 시스템: 학생이 수업 등록, 성적 조회, 과제 제출 등을 하는 과정을 유스케이스로 표현할 수 있다.

출처

종류, use case diagram

]]> <![CDATA[[UML] Deployment Diagram]]> https://velog.io/@tw_wt/UML-Deployment-Diagram https://velog.io/@tw_wt/UML-Deployment-Diagram Sun, 30 Mar 2025 14:07:50 GMT UML(Unified Modeling Language)
UML이란 Unified Modeling Language의 약자로 1997년 OMG에서 표준으로 채택한 통합모델링언어 이다.

즉, 어떠한 모델을 만드는 표준언어로서, 모델이란 것은 제품을 미리 검증하고, 설계하는 과정에서 필요하다.

크게 구조 / 행위 다이어그램으로 나뉜다.

  • 구조 다이어그램은 시스템을 구성하는 구성 요소와 이들 간의 관계를 시각화하여 시스템의 정적인 측면을 보여준다.
  • 행위 다이어그램은 실시간으로 발생하는 변화와 흐름을 표현하여 시스템의 동작을 보여준다.

개발하는 시스템의 유형과 규모에 따라서 필요한 다이어그램을 선택하여 사용한다.

Deployment Diagram (구조 다이어그램)

-- 소프트웨어 아키텍처에서 하드웨어와 소프트웨어 요소 간의 물리적인 관계를 표시하는 UML(통합 모델링 언어) 다이어그램이다.

-- 시스템의 물리적인 구조를 보여주며, 어떤 소프트웨어가 어떤 하드웨어에서 동작하고 있는지를 보여준다.

-- 무엇이 어디에 배치되는지를 보여준다. ('배치 다이어그램' 이라고도 한다.)

-- 시스템 설계 단계의 마지막에 작성한다.

구성요소

1) 노드(node)

  • 소프트웨어를 실행할 수 있는 어떤 것

  • 장치(device)와 하드웨어 두 가지의 형태로 존재

2) 실행 환경(execution environment)

  • 스스로 실행하거나 다른 소프트웨어를 포함하는 소프트웨어

  • 운영체제, 컨테이너 프로세스 등이 해당한다.

3) 아티팩트(artifact)

  • 노드에 포함되며, 소프트웨어의 물리적인 모습을 뜻한다.

  • 클래스 상자로 보여주거나 이름을 나열하여 표현하는데 문서 아이콘 상자나 <> 키워드를 붙여 표시한다.

  • .exe, .bin,DLL, JAR, 어셈블리, 스크립트, 데이터파일, 환경설정 파일, HTML 문서 등이 이에 해당한다.

4) 통신경로

  • 여러 노드가 어떻게 통신하는지를 보여준다.

  • 해당 경로에 프로토콜에 대한 정보를 표시하기도 한다.

장단점

장점

시각적 표현: 배포 다이어그램은 시스템의 물리적 구조를 시각적으로 표현하여 이해하기 쉽게 만듭니다. 이를 통해 개발자와 이해관계자 간의 의사소통이 원활해진다.

단점

기술적 세부사항 부족: 배포 다이어그램은 하드웨어와 소프트웨어의 관계를 나타내지만, 각 구성 요소의 내부 동작이나 세부 사항은 포함하지 않기 때문에 추가적인 문서가 필요할 수 있다.

사용 예제

1. IT 인프라 설계 및 관리에 용이

다양한 하드웨어 및 소프트웨어 구성 요소로 구성 이런 복잡한 시스템에서, 배치 다이어그램은 구성 요소 간의 물리적 연결을 명확하게 표시하여, 전체 아키텍처의 이해를 돕는다.


2. 소프트웨어 개발

소프트웨어 개발 프로젝트에서 배치 다이어그램은 어플리케이션과 그에 관련된 데이터베이스, 서비스 등이 서버에서 어떻게 배포되는지를 보여줍니다. 이러한 다이어그램을 통해, 개발자들은 배포 전략을 계획하고, 테스트 환경을 구성하며, 성능 문제를 사전에 파악하는 데 도움이 된다.


출처

UML 종류, 예제, 요소

]]> <![CDATA[[정렬] 정렬 알고리즘 (1. 병렬 정렬)]]> https://velog.io/@tw_wt/%EC%A0%95%EB%A0%AC%EC%95%8C%EA%B3%A0%EB%A6%AC%EC%A6%98-%EB%B3%91%EB%A0%AC%EC%A0%95%EB%A0%AC https://velog.io/@tw_wt/%EC%A0%95%EB%A0%AC%EC%95%8C%EA%B3%A0%EB%A6%AC%EC%A6%98-%EB%B3%91%EB%A0%AC%EC%A0%95%EB%A0%AC Sun, 23 Mar 2025 13:25:52 GMT 정렬
정렬은 주어진 항목들을 체계적으로 정리하는 과정, 데이터를 정해진 기준에 따라 순서를 재배열하는 작업이다.


정렬은 왜 하는가?

데이터를 정렬해야 하는 이유는 탐색을 위해서이다. 사람은 수십에서 수백 개의 데이터를 다루는 데 그치지만 컴퓨터가 다뤄야 할 데이터는 보통이 백만 개 단위이며 데이터베이스 같은 경우 이론상 무한 개의 데이터를 다룰 수 있어야 한다.
탐색할 대상 데이터가 정렬되어 있지 않다면 순차 탐색 이외에 다른 알고리즘을 사용할 수 없지만 데이터가 정렬되어 있다면 이진 탐색이라는 강력한 알고리즘을 사용할 수 있다.

이진 탐색 : 컴퓨터 과학, 수학 등에서 오름차순으로 정렬된 정수의 리스트를 같은 크기의 두 부분 리스트로 나누고 필요한 부분에서만 탐색하도록 제한하여 원하는 원소를 찾는 알고리즘



정렬의 종류

1. 버블 정렬(Bubble sort) : 인접한 두 요소를 비교하여 정렬하는 방식
2. 선택 정렬(Selection Sort) : 주어진 리스트에서 가장 작은(또는 큰) 요소를 찾아서 맨 앞의 요소와 교환하는 방식
3. 삽입 정렬(Insertion Sort) : 리스트를 두 부분으로 나누고, 정렬된 부분에 새로운 요소를 삽입하는 방식
4. 병합(합병) 정렬(Merge Sort) : 분할 정복 알고리즘으로, 리스트를 반으로 나누고 각각을 정렬한 후 다시 합치는 방식
5. 퀵 정렬(Quick Sort) : 분할 정복 알고리즘으로, 피벗을 선택하여 리스트를 피벗보다 작은 요소와 큰 요소로 나누고, 재귀적으로 정렬하는 방식
6. 힙 정렬(Heap Sort) : 힙 자료구조를 이용한 정렬 알고리즘으로, 최대 힙 또는 최소 힙을 구성한 후, 힙의 루트 요소를 제거하고 정렬하는 방식

다른 정렬이 더 있지만, 비교적 간단하고 다양한 상황에서의 성능을 비교하기에 적합한 6개만 설명하겠다.



버블 정렬(Bubble sort)

버블 정렬이란, 가장 간단한 정렬 알고리즘 중 하나로, 인접한 두 요소를 비교하여 정렬하는 방식이다. 원소를 정렬하는 모습이 마침 "버블"이 올라오는 모습같다고 해서 붙여진 이름이다. 그렇다면 어떤식으로 작동하는지 알아보자.

작동 방식

  1. 비교 및 교환 : 리스트의 첫 번째 요소부터 시작하여 인접한 두 요소를 비교한다. 만약 첫 번째 요소가 두 번째 요소보다 크면 두 요소의 위치를 교환한다.
  2. 반복: 리스트의 끝까지 이 과정을 반복한다. 이 과정을 한 번 수행하고나면 가장 큰 요소가 리스트의 마지막으로 이동하게 된다.
  3. 다시 시작: 리스트의 처음부터 다시 시작하여 위의 과정을 반복한다. 이 과정을 리스트가 정렬될 때까지 계속한다.

특징

구현이 간단해서 교육용으로 사용하긴 하지만 더 효율적인 데이터를 다루는 알고리즘들이 많아, 대규모 데이터 정렬에는 어울리지 않다.

구현

 public static void sortByBubbleSort(int[] arr) {
    for (int i = 0; i < arr.length - 1; i++) {
        for (int j = 0; j < arr.length - i - 1; j++) {
            if (arr[j] > arr[j + 1]) {
                swap(arr, j, j + 1);
            }
        }
    }
}

 ![버블 정렬.png](https://velog.velcdn.com/images/tw_wt/post/82de4629-0f78-49b1-b05d-8b63caac17bb/image.png)
 ![버블 정렬.gif](https://velog.velcdn.com/images/tw_wt/post/43c0285b-e991-4f26-992b-718c0afe93b3/image.gif)

> 예전 영상이지만, 직접 사람들이 번호 달린 옷을 입고 연극처럼 설명해주는 유튜브인데 이해하기 더 쉽다.
[알고리즘 유튜브 링크](https://www.youtube.com/@AlgoRythmics/featured)  

!youtube[lyZQPjUT5B4]

<br>

## 시간 복잡도 비교
<hr>

![](https://velog.velcdn.com/images/tw_wt/post/3c35d659-0601-4367-93db-cc630de2eece/image.png)


- 단순하지만 비효율적인 방법 - 삽입 정렬, 선택 정렬, 버블 정렬 
- 복잡하지만 효율적인 방법 - 퀵 정렬, 힙 정렬, 병합(합병) 정렬 

<br>
<hr>

<출처> [버블 정렬](https://sfida.tistory.com/30), [시간 복잡도](https://velog.io/@jinh2352/%EC%A0%95%EB%A0%AC-%EA%B8%B0%EB%B3%B8), [CODE](https://velog.io/@pppp0722/%EC%A0%95%EB%A0%AC-%EC%95%8C%EA%B3%A0%EB%A6%AC%EC%A6%98-7%EA%B0%9C-%EC%A0%95%EB%A6%AC-Java), 나무위키
]]>