sundori Dev

목차1: Vue Router 설정 (페이지 연결)📁 src/router/index.js 수정import { createRouter, createWebHistory } from 'vue-router';// 각 페이지 컴포넌트 importimport HomeView from '../views/HomeView.vue';import NoticeView from '../views/NoticeView.vue';import TranscriptView from '../views/TranscriptView.vue';import TuitionView from '../views/TuitionView.vue';import ScheduleView from '../views/ScheduleView.vue';const route..

목차목표이 글에서는 Vue.js (프론트엔드), Node.js (백엔드), MySQL (데이터베이스) 기반으로 풀스택 개발 환경을 구축하고, 폴더 구조를 나누는 작업까지 진행한다.이 프로젝트는 과거 JSP 기반의 학사정보 시스템을 최신 SPA 구조로 재구성하는 학습 및 포트폴리오 목적이다.💻 1. 개발 환경 사양macOS (Apple M1 MacBook Pro)VSCode (주 IDE)Node.js 20+MySQL 8.xnpm, npx💻 2. 프로젝트 폴더 구조 설계# 원하는 위치로 이동cd /Volumes/SN850X/Study# 루트 폴더 생성mkdir haksa-infocd haksa-info ✅ 프론트엔드(Vue 3 + Vite)npm create vue@latest frontend# 옵션은 ..

목차 1. 프로젝트 개요이 프로젝트는 과거 JSP 기반의 MVC2 구조로 개발했던 학사정보 시스템을 최신 기술 스택을 활용하여 SPA(Single Page Application) 기반으로 재구성하는 작업이다.기존 시스템은 기능적으로는 작동했지만, 다음과 같은 한계가 있었다:프론트엔드와 백엔드가 강하게 결합되어 있어 유지보수가 어려움서버 템플릿(JSP)을 사용하는 구조로, 사용자 경험이 제한적RESTful API 미흡으로 데이터 분리 및 재사용 어려움반응형 미지원, UX 개선 여지 부족이를 개선하기 위해 Vue.js + Node.js + MySQL 조합으로 기술을 전환하며, 더 나은 유지보수성, 사용자 경험, 개발 구조의 유연성을 확보하고자 한다.2. 기획 배경기존의 JSP 기반 시스템은 다음과 같은 구조..

목차DCL(Data Control Language) - 데이터 제어어DCL은 사용자에게 데이터베이스에 대한 권한을 부여하거나 회수하는 SQL 명령어다.즉, 누가 어떤 테이블을 보고, 수정하고, 삭제할 수 있는지를 제어하는 명령어들이며, DB 보안과 접근 권한 관리에서 중요하다. 실무에서는 DBA나 보안 담당자가 자주 사용하는 영역이며, DML/DDL을 누가 할 수 있는지 설정하는 것이라고 이해하면 쉽다.회사로 따지면,CREATE USER는 직원 채용GRANT는 사무실 출입카드 부여REVOKE는 퇴사 시 출입카드 회수이런 개념이다.CREATE USER - 사용자 생성CREATE USER ugi IDENTIFIED BY pw01234; 설명: 새 사용자를 생성하고 로그인 비밀번호를 설정기본적으로 아무 권한도..

목차✅ DDL (Data Definition Language) – 데이터 정의어DDL은 테이블, 컬럼, 인덱스, 제약조건 등 데이터 구조 자체를 정의하거나 변경하는 SQL 명령어 모음이다.명령어설명예시CREATE테이블, 뷰, 인덱스, 사용자 등을 생성CREATE TABLE, CREATE VIEW 등ALTER기존 객체(테이블 등)의 구조 변경컬럼 추가, 수정, 삭제 등DROP객체 삭제 (테이블, 뷰, 인덱스 등)DROP TABLE students;TRUNCATE데이터만 전부 삭제하고 구조는 유지TRUNCATE TABLE students;RENAME객체 이름 변경RENAME old_name TO new_name;COMMENT테이블이나 컬럼에 설명 주석 추가COMMENT ON COLUMN students.na..

목차✅ TCL (Transaction Control Language) – 트랜잭션 제어어TCL은 말 그대로 트랜잭션을 제어하는 SQL 명령어 모음이다.즉, 데이터 조작 작업(INSERT, UPDATE, DELETE 등)을 확정(commit)하거나 취소(rollback)하거나, 중간 저장점(savepoint)을 관리할 수 있다.✅트랜잭션이란?데이터베이스에서 하나의 논리적 작업 단위로 묶인 연산들을 의미한다.예를들어 "A 계좌에서 10만 원 출금 → B 계좌로 입금"은 하나의 트랜잭션이다.출금만 되고 입금이 안되거나 출금은 되지 않았는데 입금이 된다면 상상만해도 끔찍하다..즉, 출금 → 입금은 반드시 모두 성공하거나, 전부 실패해야 하는 하나의 묶음인 것. 원자성트랜잭션으로 묶인 작업은 모두 성공하거나 모두..

목차DML(Data Manipulation Language)DML은 데이터를 "조회하고, 추가하고, 수정하고, 삭제"하는 데 사용하는 SQL 명령어야.즉, 테이블 안의 데이터를 조작하는 모든 작업을 담당한다. 📌 DML 종류명령어설명SELECT테이블에서 데이터 조회INSERT새 데이터 삽입UPDATE기존 데이터를 수정DELETE기존 데이터를 삭제MERGE존재하면 UPDATE, 없으면 INSERT (조건부 조작)사실 DML에 CALL, EXPLAIN PLAN, LOCK TABLE도 있다...SELECT - 데이터 조회모두가 처음 DB를 배울 때 가장 쉽게 이해가 가능한 DML이다..SELECT: 조회할 컬럼 지정FROM: 테이블 지정WHERE: 조건ORDER BY: 정렬 기준INSERT - 데이터 삽입..

목차계층 쿼리란계층 쿼리는 자기 자신을 부모/자식으로 참조하는 트리 구조를 탐색할 때 사용하는 쿼리다.예를 들어 회사의 조직도(CEO → 팀장 → 사원), 댓글의 답글 구조, 분류체계 등**"상위-하위 관계를 가진 데이터"**에서 필수적으로 사용됨. employeesidnamepositionmanager_id1철수CEONULL2영희CTO13민수팀장24지수대리35나리사원4 manager_id가 NULL이면 최상위 (CEO)각 직원은 manager_id를 통해 상사를 참조함LEVEL현재의 DEPTH를 반환한다. 루트 노드는 1이 된다.SYS_CONNECT_BY_PATH (컬럼, 구분자)루트 노드부터 현재 노드까지의 경로를 출력해주는 함수이다.START WITH경로가 시작되는 루트 노드를 생성해주는 절이다.C..

목차Self Join셀프 조인은 말 그대로 나 자신과의 조인이다라고 할 수 있다. 조금 더 다르게 말하면...**셀프 조인(Self Join)**은 하나의 테이블을 자기 자신과 조인하는 방식이다.같은 테이블 내에서 행들끼리의 관계(예: 부모-자식, 멘토-멘티, 선배-후배 등)를 표현할 때 사용한다. students 테이블idnameclassmentor_id1철수1NULL2영희113민수214지수225나리33mentor_id는 멘토의 id를 가리킴학생과 학생(같은 테이블) 간의 관계를 나타냄멘토-멘티 관계 구하기SELECT mentee.name AS 멘티, mentor.name AS 멘토FROM students menteeJOIN students mentor ON mentee.mentor_id ..

목차정해진 개수의 상위 N개 행만 조회하는 쿼리로, 실무에서 매우 자주 사용이 된다. (예: 상위 5위, 최신 10건, 점수 Top 3 등).Top-N 쿼리Top-N 쿼리는 정렬된 결과 중 일정 개수(N개)만 추출하고 싶을 때 사용한다.DBMS마다 문법 차이는 있지만, 정렬 + 제한이라는 구조는 동일하다.-- 예제 쿼리 MySQL / PostgreSQLSELECT name, scoreFROM studentsORDER BY score DESCLIMIT 3;-- Oracle 구버전SELECT name, scoreFROM ( SELECT name, score FROM students ORDER BY score DESC)WHERE ROWNUM ✅ 기타 DBMS별 방식DBMS사용 문법 예시MySQLLIMI..