웹 풀사이클 데브코스 TIL 8일차

데이터베이스란(DB)?

데이터를 통합하여 효율적으로 관리하기 위한 데이터 집합체를 데이터베이스라고 한다.

데이터를 구조화하여 관리함으로써 데이터 중복을 막고, 효율적이고 빠른 데이터 연산을 가능하게 한다.

DBMS란?

데이터베이스를 운영하고 관리하기 위한 DBMS를 통해 데이터베이스를 사용한다. 즉, 데이터베이스를 관리하고 운영하는 소프트웨어를 DBMS(Database Management System)

다양한 브랜드가 있다. ex) oracle, Mysql, mariaDB

SQL

SQL은 데이터 베이스에 연산을 요청하기 위해 사용되는 언어로 데이터를 생성, 조회, 수정, 삭제 등과 같은 기능을 수행할 수 있습니다.

데이터 삽입: INSERT

데이터 삭제: SELECT

데이터 수정: UPDATE

데이터 삭제: DELETE

DOCKER

도커는 리눅스의 응용 프로그램들을 프로세스 격리 기술들을 사용해 컨테이너로 실행하고 관리하는 오픈 소스 프로젝트이다. 도커 웹 페이지의 기능을 인용하면 다음과 같다: 도커 컨테이너는 일종의 소프트웨어를 소프트웨어의 실행에 필요한 모든 것을 포함하는 완전한 파일 시스템 안에 감싼다

host operating system: 운영체제

원래는 운영체제와 호환하며 설치를 하는데 그 위에 docker를 한겹 깐다. docker는 컨테이너를 가지고 다님. 컨테이너 안에 설치를 한다. -> os가 빠르고 가벼워짐, 어플리케이션도 독립적으로 유연하게 움직일 수 있다.

컨테이너는 코드와 종속성을 함께 패키지하는 앱 계층의 추상화입니다. 여러 컨테이너가 동일한 시스템에서 실행될 수 있으며 OS 커널을 다른 컨테이너와 공유할 수 있으며, 각 컨테이너는 사용자 공간에서 격리된 프로세스로 실행됩니다. 컨테이너는 VM보다 공간을 덜 차지하며(컨테이너 이미지의 크기는 일반적으로 수십 MB임) 더 많은 애플리케이션을 처리할 수 있으며 더 적은 수의 VM 및 운영 체제가 필요합니다.

표준: Docker는 컨테이너에 대한 업계 표준을 만들었으므로 어디에서나 휴대할 수 있습니다.
경량: 컨테이너는 시스템의 OS 시스템 커널을 공유하므로 애플리케이션당 OS가 필요하지 않아 서버 효율성이 향상되고 서버 및 라이선스 비용이 절감됩니다.
보안: 애플리케이션은 컨테이너에서 더 안전하며 Docker는 업계에서 가장 강력한 기본 격리 기능을 제공합니다.

mariadb 설치하기

1. mariadb 설치

docker를 실행하고 cmd에서 명령어 입력

docker pull mariadb

2. mariadb 실행

docker run --name mariadb -d -p 3306:3306 --restart=always -e MYSQL_ROOT_PASSWORD=root mariadb

3306: 내려져오는 default port번호
restart는 항상 할 것임
MYSQL_ROOT_PASSWORD의 비밀번호는 root이다.

접속하기

docker exec -it mariadb /bin/bash

mariadb라는 컨테이너
mariadb안에 모든 환경을 구축해 놓은 것, 사용할 준비가 되어있음

mariadb -u root -p

mariadb컨테이너를 실행시켜달라는 명령어
user 이름은 root, password는 ? 이라는 명령어

위에서 MYSQL_ROOT_PASSWORD에 설정해주었던 비밀번호 root를 입력하면 된다.

아래처럼 나오면 실행이 된 것이다.

다음에 접속할 때는

docker exec -it mariadb /bin/bash

mariadb -u root -p

SQL : CREATE

방 확인: SHOW DATABASES;
방 만들기: CREATE DATABASES Tennis
방 들어가기: USE Tennis

DataBases를 보여준다. 처음 상태이다.

Tennis라는 데이터베이스 생성 후 확인해보기

Tennis 데이터베이스로 이동

-> 테이블 생성, 테이블에 속성 생성

데이터 테이블 조회: SELECT 컬럼명 FROM 테이블명

테이블 데이터 삽입: INSERT 칼럼명1,컬럼명2,.. INTO 테이블명 VALUE()

조건 붙이기 where

SQL : UPDATE,DELETE

데이터 수정하기: UPDATE 테이블명 SET 컬럼명 = 수정할 값 WHERE 조건;

id가 bsu0404인 행의 pwd가 zzzz로 바뀌는 것을 볼 수 있다.

where를 쓰지 않고 update하는 경우

모든 행의 pwd가 1234로 바뀐 것을 확인할 수 있다.

SQL: DELETE

테이블 데이터 삭제: DELETE FROM 테이블명 WHERE 조건;

삭제된 것을 볼 수 있다.

where가 없이 delete하는 경우

모든 행이 삭제된다.

NODE.JS와 데이터베이스 연동

만들어둔 데이터베이스

그리고 vscode로 돌아가 다음명령어를 입력해준다.

$ npm install mysql --save install mysql --save

이때, 설치는 성공한 것 같으나 파일에 node_modules와 package.json파일이 생기지 않았다면

$ npm init

를 입력후 모두 엔터, yes를 입력해준 뒤 다시 npm install mysql --save install mysql --save 명령어를 입력해준다.

database\connect\mariadb.js 폴더를 만들어서

const mariadb = require("mysql");

const conn = mariadb.createConnection({
  host: "localhost",
  port: 3306,
  user: "root",
  password: "root",
  database: "Tennis",
});

module.exports = conn;

requestHandler.js

const fs = require("fs"); //file sync약자

const main_view = fs.readFileSync("./main.html", "utf-8");

const mariadb = require("./database/connect/mariadb");

function main(response) {
  console.log("main");

  mariadb.query("SELECT * FROM product", function (err, rows) {
    console.log(rows);
  });

  response.writeHead(200, { "Content-Type": "text/html" });
  response.write(main_view);
  response.end();
}
function redRacket(response) {
  fs.readFile(".img/redRacket.png", function (err, data) {
    response.writeHead(200, { "Content-Type": "text/html" });
    response.write(data);
    response.end();
  });
}
let handle = {};
handle["/"] = main;
handle["/img/redRacket.png"] = redRacket;
handle["/img/blueRacket.png"] = blueRacket;
handle["/img/blackRacket.png"] = blackRacket;

exports.handle = handle;

이 때, 메인 페이지일 때 main.html를 보여줘보자

const fs = require("fs"); //file sync약자

const main_view = fs.readFileSync("./main.html", "utf-8");

function main(response) {

response.writeHead(200, { "Content-Type": "text/html" });

response.write(main_view);

response.end();

}

response.write(main_view);

이 부분을 통해 main일 때 main.html을 보여준다.

하지만 확인해보면 img를 url로 읽으며 보여주지 못하고 있다.

하지만 다음을 추가하여 이미지를 읽어올 수 있다.

function redRacket(response) {

fs.readFile(".img/redRacket.png", function (err, data) {

response.writeHead(200, { "Content-Type": "text/html" });

response.write(data);

response.end();

});

}

function blueRacket(response) {

fs.readFile(".img/blueRacket.png", function (err, data) {

response.writeHead(200, { "Content-Type": "text/html" });

response.write(data);

response.end();

});

}

function blackRacket(response) {

fs.readFile(".img/blackRacket.png", function (err, data) {

response.writeHead(200, { "Content-Type": "text/html" });

response.write(data);

response.end();

});

}

let handle = {};

handle["/"] = main;

handle["/img/redRacket.png"] = redRacket;

handle["/img/blueRacket.png"] = blueRacket;

handle["/img/blackRacket.png"] = blackRacket;

requestHandler 전체코드

const fs = require("fs"); //file sync약자

const main_view = fs.readFileSync("./main.html", "utf-8");

const mariadb = require("./database/connect/mariadb");

function main(response) {
  console.log("main");

  mariadb.query("SELECT * FROM product", function (err, rows) {
    console.log(rows);
  });

  response.writeHead(200, { "Content-Type": "text/html" });
  response.write(main_view);
  response.end();
}
function redRacket(response) {
  fs.readFile(".img/redRacket.png", function (err, data) {
    response.writeHead(200, { "Content-Type": "text/html" });
    response.write(data);
    response.end();
  });
}
function blueRacket(response) {
  fs.readFile(".img/blueRacket.png", function (err, data) {
    response.writeHead(200, { "Content-Type": "text/html" });
    response.write(data);
    response.end();
  });
}
function blackRacket(response) {
  fs.readFile(".img/blackRacket.png", function (err, data) {
    response.writeHead(200, { "Content-Type": "text/html" });
    response.write(data);
    response.end();
  });
}
let handle = {};
handle["/"] = main;
handle["/img/redRacket.png"] = redRacket;
handle["/img/blueRacket.png"] = blueRacket;
handle["/img/blackRacket.png"] = blackRacket;

exports.handle = handle;

클릭하면 url로 파라미터를 보내고 데이터베이스에 변화를 줘보자!

main.html의 버튼으로 경로, 쿼리데이터 지정

<input
          class="card_button"
          type="button"
          value="order"
          onclick="location.href='/order?productId=1'"
        />

server.js에서 queryData 추출

function start(route, handle) {
  function onRequest(request, response) {
    if (!request.url.includes("favicon.ico")) {
      let pathName = url.parse(request.url).pathname;
      let queryData = url.parse(request.url, true).query;
      route(pathName, handle, response, queryData.productId);
    }
  }
  http.createServer(onRequest).listen(8888);
}

let queryData = url.parse(request.url, true).query;

이 쿼리 데이타에서 productId를 뽑아서 넘겨준다. queryData.productId

requestHandler.js에서 쿼리데이터에 따라 테이블에 추가하기

function order(response, productId) {
  mariadb.query(
    "INSERT INTO orderlist VALUES(" +
      productId +
      ", '" +
      new Date().toLocaleDateString() +
      "');",
    function (err, rows) {
      console.log(rows);
    }
  );

  response.writeHead(200, { "Content-Type": "text/html" });
  response.write("Order Page");
  response.end();
}



handle["/order"] = order;

받아온 데이터를 뿌려보기

main.js에서 경로 설정

<a href="./orderList">order list</a>

requestHandler.js에서 데이터를 받아오고 화면에 보여주기

const fs = require("fs"); //file sync약자
const orderlist_view = fs.readFileSync("./orderList.html", "utf-8");

const mariadb = require("./database/connect/mariadb");

function orderlist(response, productId) {
  mariadb.query("SELECT * FROM orderlist", function (err, rows) {
    response.writeHead(200, { "Content-Type": "text/html" });

    rows.forEach((element) => {
      response.write(
        "<tr>" +
          "<td>" +
          element.product_id +
          "<td>" +
          "<td>" +
          element.order_date +
          "<td>" +
          "</tr>"
      );
    });
    response.write("</table>");
    response.end();
  });
}

handle["/orderList"] = orderlist;

출처: 데브코스 강의, https://db-engines.com/en/ranking_trend, https://docker.com/resources/what-container/

'타입스크립트로 함께하는 웹 풀 사이클 개발(React, Node.js) > TIL' 카테고리의 다른 글

웹 풀사이클 데브코스 TIL 10일차 - REST API, url (2)	2023.12.05
웹풀사이클 11일차 (1)	2023.12.05
웹 풀사이클 데브코스 TIL 6일차 - css, js 작성하고 연결하기 (1)	2023.11.24
웹 풀사이클 데브코스 TIL 6일차 - 웹의 이해,구조,직무 (1)	2023.11.21
웹 풀사이클 데브코스 TIL 5일차 - branch, 깃 플로우, merge (0)	2023.11.21

개발 기억저장소

웹 풀사이클 데브코스 TIL 8일차

데이터베이스란(DB)?

DBMS란?

SQL

mariadb 설치하기

1. mariadb 설치

2. mariadb 실행

다음에 접속할 때는

SQL : CREATE

SQL : UPDATE,DELETE

where를 쓰지 않고 update하는 경우

SQL: DELETE

where가 없이 delete하는 경우

NODE.JS와 데이터베이스 연동

'타입스크립트로 함께하는 웹 풀 사이클 개발(React, Node.js) > TIL' 카테고리의 다른 글

티스토리툴바

웹 풀사이클 데브코스 TIL 8일차

데이터베이스란(DB)?

DBMS란?

SQL

mariadb 설치하기

1. mariadb 설치

2. mariadb 실행

다음에 접속할 때는

SQL : CREATE

SQL : UPDATE,DELETE

where를 쓰지 않고 update하는 경우

SQL: DELETE

where가 없이 delete하는 경우

NODE.JS와 데이터베이스 연동

'타입스크립트로 함께하는 웹 풀 사이클 개발(React, Node.js) > TIL' 카테고리의 다른 글

관련글

티스토리툴바