자가진단 설문은 사용자가 시스템을 등록하고 그 시스템을 자가진단 설문을 하는 기능입니다.코드는 다음과 같습니다.  import express from "express";import pool from "../db/connection.js"; // DB 연결 파일const router = express.Router();// Self-assessment 저장const handleSelfAssessmentSave = async (req, res) => { const { organization, userGroup, personalInfoSystem, memberInfoHomepage, externalDataProvision = "없음", cctvOperation, taskO..

다음은 시스템 백엔드 코드를 먼저 보여드리겠습니다.import pool from "../db/connection.js";// 시스템 등록const postsystem = async (req, res) => { const { name, min_subjects, max_subjects, purpose, is_private, is_unique, is_resident, reason, } = req.body; const user_id = req.session.user?.id; if (!user_id) { console.error("❌ [AUTH] 사용자 세션이 없습니다."); return res.status(401).json({ message: "로그인..

우선 백엔드는 프론트쪽에서 CRUD 작업을 하기위해서 필요한 코드입니다. 그걸 하기 위해서 mysql언어가 필요해서 테이블과 백엔드를 연결하여 사용하면 됩니다. 연결은 이런식으로 하면 됩니다.import mysql from "mysql2/promise";import dotenv from "dotenv";dotenv.config(); // .env 파일에서 환경 변수 로드const pool = mysql.createPool({ host: process.env.DB_HOST || "localhost", user: process.env.DB_USER || "root", password: process.env.DB_PASSWORD, database: process.env.DB_NAME, waitForC..

우선 프론트는  react-vite를 설치후 테일윈드로 디자인을 하면서 개발을 할 것 입니다.npm create vite@latestnpm install npm run dev 설치 후 실행을 해보면 됩니다. react-router-dom을 설치하여 라우터 처리를 통해 페이지 이동처리를 하도록 하고 recoil 을 통해서 상태관리를 해보도록 하겠습니다.리코일이란https://codingbasics.tistory.com/314 리코일이란1. Atom의 본질Recoil의 핵심은 Atom입니다. Atom은 Recoil 상태 관리 시스템에서 가장 기본적인 단위로, React 애플리케이션 내에서 전역 상태를 관리하는 컨테이너 역할을 합니다.Atom의 특징초기값:Atomcodingbasics.tistory.com 우..

저번 시간에 대략적인 구조에 대해 살펴보았습니다. 이제 백엔드와 연결해서 api를 만들려면 우선 DB를 만들어서 백엔드 코드와 연결하여 사용해야합니다. 우리는 이러한 테이블을 만들기위해 ERD를 만들어 테이블 구조를 정의를 해줍니다.https://www.erdcloud.com/ ERDCloudDraw ERD with your team members. All states are shared in real time. And it's FREE. Database modeling tool.www.erdcloud.comerd-cloud를 이용하면 쉽게 mysql로 변환해줄수 있습니다.https://www.erdcloud.com/d/rLQvxCj9KSFxgTP8j 개인정보 컴플Draw ERD with your tea..

오늘은 대학교 교수님이 내주신 과제를 진행하기 위해서 우선 전체적인 사이트내용을 설명을 듣고 피그마를 통해 전체적인 흐름을 보도록 하겠습니다.https://www.figma.com/design/26nIZOuZoQsWwZSwggus0h/%EA%B0%9C%EC%9D%B8%EC%A0%95%EB%B3%B4-%EC%BB%B4%ED%94%8C%EB%9D%BC%EC%9D%B4%EC%96%B8%EC%8A%A4-%EC%9B%B9%EC%95%A0%ED%94%8C%EB%A6%AC%EC%BC%80%EC%9D%B4%EC%85%98?node-id=0-1&p=f&t=zxcEfRy8pmffy2no-0 FigmaCreated with Figmawww.figma.com우선 사이트를 보면 크게 회원가입 기능, 자가진단 기능, 관리자 기능..