React, MySQL 풀스택 1일차(DB 연결, Table 생성하기)

PedroTech님의 풀스택 강의를 참고한 포스팅입니다.

 

📌 DB 연결 준비

// ./server/config/config.json
{
  "development": {
    "username": "root",
    "password": "password",
    "database": "springdb",
    "host": "localhost",
    "dialect": "mysql"
  },
  "test": {
    "username": "root",
    "password": null,
    "database": "database_test",
    "host": "127.0.0.1",
    "dialect": "mysql"
  },
  "production": {
    "username": "root",
    "password": null,
    "database": "database_production",
    "host": "127.0.0.1",
    "dialect": "mysql"
  }
}

"development"에 연결할 DB의 정보를 적어줍니다.

1. username: DB 관리 시스템의 username을 작성합니다.
2. password: 본인이 지정한 password를 문자열 형태로 작성합니다.
3. database: DB명을 작성합니다. 이 안에 table을 만들어줄 것입니다.
4. host: 127.0.0.1 또는 localhost로 작성해 줍니다.
5. dialect: 사용하는 DB 관리 시스템명을 작성합니다. 저는 MySQL을 사용하기 때문에 mysql로 적어줍니다.

 

 

📌 Table에 데이터 생성 준비

// ./server/models/Posts.js
module.exports = (sequelize, DataTypes) => {
  const Posts = sequelize.define("Posts", {
    title: {
      type: DataTypes.STRING,
      allowNull: false,
    },
    postText: {
      type: DataTypes.STRING,
      allowNull: false,
    },
    username: {
      type: DataTypes.STRING,
      allowNull: false,
    },
  });

  return Posts;
};

sequelize.define("테이블명", 데이터) 이런 형식을 가지고 있는 것 같습니다.

데이터에는 아래와 같은 형식을 갖추어야 합니다.
칼럼명: { type: 데이터타입, allowNull: Null 허용하는지(허용: true, 비허용: false) }

 

 

📌 DB 연결과 Table 생성 실행

// ./server/index.js
// 라이브러리를 불러옵니다.
const express = require("express");
const app = express();

const db = require("./models");

db.sequelize.sync().then(() => {
  // (portNum, function)
  app.listen(3001, () => {
    console.log("Server running on port 3001");
  });
});

./models 안에는 DB에 테이블을 생성할 코드들이 들어있습니다.
이것을 실행함으로써 DB에 Posts라는 테이블이 생성되어 있을 것입니다.

app.listen(포트번호, 함수) 같은 형식을 가지고 있는데
3001번 포트에 서버를 실행할 때 화면에 표시할 문자를 함수에 정의하였습니다.

 

 

📌 결과

정상적으로 DB에 posts라는 테이블이 생성되었습니다.
칼럼들도 잘 들어가 있는 걸 확인할 수 있습니다.(id, createdAt, updatedAt는 자동으로 들어가집니다.)

 

 

📌 느낀 점

DB와 연결을 해본 적은 이번이 처음인데 굉장히 새로웠고 생각보다 복잡하지 않아서 빠르게 배울 수 있던 것 같습니다.

팀프로젝트를 진행할 예정인데 DB를 연결할 일이 생긴다면 이렇게 잘 연결할 수 있을 것 같습니다.