📅 2024-01-12, 25일차

TODO

• sql 고득점키트 ?!
• 웹디자인어워즈 gdweb.co.kr 구경하기
• 코드펜가지고 놀기
• <엘리먼트의 관계, a,br, emmet> 다시보기

---

1~24일 자바 + DB
~20일 HTML, CSS, JS, React
~~ 일 자바 + DB +HTML, CSS, JS

---

DBMS

• LIKE % 로 찾는건 자바로 치면 CONTAINS와 같다
• LIKE는 성능저하의 원인이 된다

데이터 정규화 MySQL

6개의 정규화 과정

• 제 1 정규형(1NF)
• 제 2 정규형(2NF)
• 제 3 정규형(3NF)
• BCNF(Boyce-Codd)
• 제 4 정규형(4NF)
• 제 5 정규형(5NF)

정규화가 필요한 경우

• 데이터를 갱신, 삽입, 삭제하는 등 테이블을 수정할 때 원하는 않게 데이터가 삭제되거나 가공되는 경우가 있다. 이를 이상 현상이라고 한다.

제 1 정규형(1NF)

• 모든 속성 값이 원자값이어야 한다
• 하나의 셀에는 하나의 값만 존재해야 한다
  • 하나의 셀에 여러개의 데이터가 들어있으면 검색이 어렵고 데이터 수정이 어렵다.
• 이 조건(1칸에 1개)을 성립하는 테이블 => 제 1정규형 테이블
  

제 2 정규형(2NF)

• 모든 비주요 속성이 기본키에 대해서 완전 함수 종속성을 가져야 한다
• 테이블이 제 1정규형이어야 하며, 부분 함수 중속성을 없앤다
• 현재 테이블과 주제가 맞지 않는 컬럼은 다른 테이블로 이동
• 두 테이블을 조인하여 사용하면 된다!
• RDBMS (RELATIONAL-DBMS) -> 관계형 데이터베이스 관리 시스템
  

제 3 정규형(3NF)

• 테이블이 제 2정규형이어야 하며, 이행 함수 종속성을 없앤다
• 한 테이블의 모든 컬럼은 기본 키에 대해서 직접 종속되어야 한다
• 일반 컬럼에만 종속 된 다른 컬럼을 다른 테이블로 이동
  

TRANSACTION

• 한꺼번에 수행되어야 할 일명령들의 모음
  하나의 업무단위를 뜻함
  하나의 업무에 사용되는 다수의 쿼리는 모두 성공하거나 모두 실패해야한다는 뜻
  데이터의 무결성을 보장하기 위함 (트랜잭션을 사용하는 이유)

• A가 B에게 계좌이체를 했다,
  그러나 A의 계좌에선 차감되었는데, B의 계좌에는 입금 되지 않았다면?
  이체 과정 중 돈이 증발한 것이다!

💡 계좌이체 라는 행위는 인출과 입금 두 과정으로 이루어져야한다!
계좌이체라는 행위에서 출금과 입금 이 두 과정은 동시에 성공하던지 동시에 실패해야 한다
이 과정을 동시에 묶는 방법이 바로 트랜잭션이다

START TRANSACTION;

ROLLBACK;
# 만일 여기서 문제가 생기면 START TRANSACTION 부분으로 모든 과정을 되돌린다

ERD (Entity Relationship Diagram)

"ERD(이알디)란 "Entity Relationship Diagram"의 약자로서, 계체-관계 다이어그램이라고도 하며 말로 되어 있는 요구사항을 분석하여 그림으로 그려내어 그 관계를 도출한 다이어그램을 말한다. 즉, ERD는 엔티티(entity) 간의 관계(relationship)를 도표(diagram)로 표시한 그림이다."

---

FRONT-END

FRAMEWORK

• 틀!

CSS

헥사코드 16진수 -> 컬러픽커!!!!!!!!!!!!!!!!!!!!!!

웹페이지를 이루는 3요소

HTML (배우)
CSS (스타일리스트)

• display
• block VS inline-block 비교
  • block (div, section, nav, article의 기본값-디폴트)
    • 너비가 최대화가 된다 (최대한 넓어진다)
    • 한줄을 무조건 혼자 써 -> 레고블럭이라고 생각하기 (무조건 옆으로 쌓는다)
  • inline-block (양옆으로 붙여주기)
    • 너비가 최소화 된다 (최대한 좁아진다)
    • 한줄에 최대한 여러개 -> 글자라고 생각하기

JS (감독)

HTML (HIPER TEXT MARKUP LANGUAGE)

> 는 자식이라는 뜻
공백은 후손이라는
~는 형제라는 뜻

section>div {
	color:red;
}
section div {
	color:red;
}
section~div {
	color:red;
}

CSS (Cascading Style Sheets)

• 영역에 대한 이해가 정말 정말 중요!!
• 마우스 올림을 받았을때 div의 색이 바뀌는 로직

div:hover {
  background-color:blue;
}

• 강제 띄어쓰기  

안      뇽

• 꺽새&gt