[프로젝트] 6일차 - 테스트 웹 (일단) 작성 완료

Fast API와 React를 이용한 테스트 웹 사이트의 코드를 일단 완성하였다. 또한, DB와의 연결을 위해 준비하고 Deployment만 하면 되도록 쿠버네티스의 구성요소들을 세팅하였다.

Front

import React, { useState, useEffect } from "react";

function App() {
  const [users, setUsers] = useState([]);

  useEffect(() => {
    fetch("/users")
      .then((response) => response.json())
      .then((data) => setUsers(data));
  }, []);

  return (
    <div>
      <h1>Users</h1>
      <ul>
        {users.map((user) => (
          <li key={user.id}>{user.name}</li>
        ))}
      </ul>
    </div>
  );
}

export default App;

Back

from fastapi import FastAPI
from fastapi.middleware.cors import CORSMiddleware
import mysql.connector
import os

app = FastAPI()

origins = [
    "http://localhost"
    "http://localhost:3000"
]

app.add_middleware(
    CORSMiddleware,
    allow_origins=origins,
    allow_credentials=True,
    allow_methods=["*"],
    allow_headers=["*"],
)

db_address = os.environ['DB_ADDRESS']
db_port = os.environ['DB_PORT']
db_name = os.environ['DB_NAME']
db_password = os.environ['DB_PASSWORD']
db_dbname = os.environ['DB_DBNAME']


@app.get("/")
def read_root():
    return {"Hello": "World"}


@app.get("/users")
def read_users():
    mydb = mysql.connector.connect(
        host=db_address,
        port=db_port,
        user=db_name,
        password=db_password,
        database=db_dbname
    )

    cursor = mydb.cursor()
    cursor.excute("SELECT * FROM users")
    result = cursor.fetchall()
    return result

FROM python:3.9-slim-buster

WORKDIR /app

COPY requirements.txt .

RUN pip install --no-cache-dir -r requirements.txt

COPY . .

EXPOSE 8000

CMD uvicorn --host=0.0.0.0 --port 8080 main:app

apiVersion: apps/v1
kind: Deployment
metadata:
  name: book-deploy
spec:
  selector:
    matchLabels:
      tier: back
  replicas: 2
  template:
    metadata:
      labels:
        tier: back
    spec:
      containers:
      - name: book-back
        image: <Image>
        resources:
          requests:
            memory: "128Mi"
            cpu: "500m"            
          limits:
            memory: "128Mi"
            cpu: "500m"
        ports:
        - containerPort: 8080
        env:
          - name: DB_ADDRESS
            valueFrom:
              secretKeyRef:
                name: web-rds-secret
                key: address
          - name: DB_PORT
            valueFrom:
              secretKeyRef:
                name: web-rds-secret
                key: port
          - name: DB_NAME
            valueFrom:
              secretKeyRef:
                name: web-rds-secret
                key: name
          - name: DB_PASSWORD
            valueFrom:
              secretKeyRef:
                name: web-rds-secret
                key: password
          - name: DB_DBNAME
            valueFrom:
              secretKeyRef:
                name: web-rds-secret
                key: dbname
        volumeMounts:
          - mountPath: /book_db
            name: efs-volume
            resources:
              requests:
                cpu: "250m"
                memory: "64Mi"
              limits:
                cpu: "250m"
                memory: "64Mi"
        volumes:
          - name: efs-volume
            persistentVolumeClaim:
              claimName: efs-pvc