웹 프로젝트 === 수업 정보 === 가입 --- * [프로그래머스](https://programmers.co.kr/) * [github](https://github.com/) 다운로드 --- * [IntelliJ IDEA](https://www.jetbrains.com/ko-kr/idea/) - 개발 환경 * 스크롤을 내려서 IntelliJ IDEA Community Edition을 다운 * [xampp](https://www.apachefriends.org/) * 서버 환경, xampp는 mysql을 위해 사용합니다. * XAMPP는 다음과 같은 기능을 제공합니다: * Apache: 널리 사용되는 웹 서버 소프트웨어입니다. * MariaDB/MySQL: 관계형 데이터베이스 관리 시스템입니다. * PHP: 서버 측 스크립트 언어로 웹 애플리케이션 개발에 사용됩니다. * Perl: 범용 프로그래밍 언어로, 텍스트 처리에 강력합니다. * [sqlyog](https://github.com/webyog/sqlyog-community/wiki/Downloads) * DB(데이터베이스) * SQLyog는 Windows용 GUI 기반 MySQL 관리자 및 관리 도구 * [자바 JDK - 17 버전 다운해 주세요.](https://www.oracle.com/kr/java/technologies/downloads/#jdk22-windows) * Java 애플리케이션을 개발하고 실행하는 데 필요한 도구 모음 * [git](https://git-scm.com/) * [d2coding](https://github.com/naver/d2codingfont/releases) - 코드 최적화 폰트 링크 --- * [점프 투 스프링부트](https://wikidocs.net/book/7601) - 2장부터 진행 * [spring initializr](https://start.spring.io/) - 스프링 파일 생성 * [codePen](https://codepen.io/trending) - HTML 제작 * [프로그래머스 자바 입문](https://school.programmers.co.kr/learn/courses/5/5-%EB%AC%B4%EB%A3%8C-%EC%9E%90%EB%B0%94-%EC%9E%85%EB%AC%B8) * [프로그래머스 레벨 0, 자바](https://school.programmers.co.kr/learn/challenges?order=acceptance_desc&levels=0&languages=java) * [프로그래머스 레벨 1, 자바](https://school.programmers.co.kr/learn/challenges?order=acceptance_desc&levels=1&languages=java) * [프로그래머스 레벨 2, 자바](https://school.programmers.co.kr/learn/challenges?order=acceptance_desc&levels=2&languages=java) * [GIT 인터렉티브](https://learngitbranching.js.org/?locale=ko) * [우아한 테크 - 스프링과 스프링부트](https://www.youtube.com/watch?v=6h9qmKWK6Io) 세팅 === 인텔리제이 --- **인텔리제이 세팅, 설치 직후 한번만 해도 되는 세팅** * 메뉴 => Help => Edit Custom VM Options * ```-Dfile.encoding=UTF-8``` * 파일 인코딩을 UTF-8로 설정 * 메뉴 => File => Settings => Advanced Settings * Allow auto-make to start even if developed application is currently running : 체크 * 개발 중인 애플리케이션이 실행 중이더라도 자동 빌드(자동 컴파일)를 허용 * 메뉴 => File => Settings => Editor => Font * Font : D2Coding * Size : 본인 시력에 맞게 조정 * 소스 코드의 폰트를 조정 * 메뉴 => File => Settings => Keymap * Keymap : Eclipse * 검색 : Rename * Rename File : Alt + Shift + R * Keep * 검색 : Find * Find : Ctrl + F * Keep * 검색 : Replace * Replace : Alt + Shift + F * Ctrl + F 는 제거 **인텔리제이 세팅, 프로젝트 생성 마다 해야 하는 세팅** * 메뉴 => Build, Execution, Deployment => Compiler * Build project automatically : 체크 * 이 설정은 스프링부트 프로젝트에서만 하면 됩니다. * 일반 자바프로젝트에서는 필요없음 * 메뉴 => Build, Execution, Deployment => Build Tools => Gradle * Build and run using : IntelliJ IDEA * Run tests using : IntelliJ IDEA * Gradle JVM : Project SDK correctto-17 spring initializr 세팅 === [![image.png](https://i.postimg.cc/DzF652zg/image.png)](https://postimg.cc/cv9fLGwg) 웹(Web)이란? === **웹(Web)**은 전 세계의 인터넷 사용자들이 접근할 수 있는 정보 공간입니다. HTML(하이퍼텍스트 마크업 언어)로 작성된 웹 페이지를 기반으로 하며, 사용자가 웹 브라우저를 통해 접근할 수 있습니다. 웹의 주요 구성 요소는 다음과 같습니다: * 웹 브라우저: 사용자가 웹 페이지를 볼 수 있게 해주는 소프트웨어 (예: Chrome, Firefox, Safari). * 웹 서버: 클라이언트(사용자)의 요청을 처리하고 웹 페이지를 제공하는 서버. * HTTP/HTTPS: 웹 브라우저와 웹 서버 간의 통신을 위한 프로토콜. 웹 프로젝트(Web Project)란? === 웹 프로젝트는 웹 애플리케이션을 개발하기 위한 프로젝트입니다. 이는 다양한 언어와 프레임워크를 사용하여 클라이언트와 서버 간의 상호작용을 구현합니다. 웹 프로젝트는 보통 프론트엔드와 백엔드로 나뉩니다: * 프론트엔드: 사용자 인터페이스(UI)를 담당하며, HTML, CSS, JavaScript를 사용. * 백엔드: 서버 측 로직과 데이터베이스 상호작용을 담당하며, Java, Python, PHP 등을 사용. 스프링부트(Spring Boot)란? === **스프링부트(Spring Boot)**는 스프링 프레임워크를 쉽게 설정하고 사용할 수 있도록 도와주는 프레임워크입니다. 스프링부트를 사용하면 복잡한 설정 없이 빠르게 스프링 기반 애플리케이션을 개발할 수 있습니다. 주요 특징은 다음과 같습니다: * 자동 설정: 기본적인 설정을 자동으로 구성. * 독립 실행 가능: 내장된 웹 서버(Tomcat, Jetty)를 포함하여 실행 가능. * 의존성 관리: 필요한 라이브러리 의존성을 쉽게 관리. 스프링부트 기본 구조 --- 스프링부트 애플리케이션은 다음과 같은 기본 구조를 가집니다: * Application 클래스: 애플리케이션 진입점으로, @SpringBootApplication 어노테이션이 붙음. * Controller: 클라이언트의 요청을 처리. * Service: 비즈니스 로직을 처리. * Repository: 데이터베이스와 상호작용. ```java @SpringBootApplication public class MyApplication { public static void main(String[] args) { SpringApplication.run(MyApplication.class, args); } } ``` MVC 패턴: 컨트롤러, 서비스, 레포지토리 개념 --- MVC 패턴은 Model-View-Controller 패턴을 의미하며, 애플리케이션의 구조를 세 가지 주요 컴포넌트로 나눕니다: * Model: 애플리케이션의 데이터와 비즈니스 로직을 관리. * View: 사용자 인터페이스를 담당. * Controller: 사용자 입력을 처리하고, 모델과 뷰를 연결. 스프링부트에서 각 역할은 다음과 같습니다: * Controller: @Controller 또는 @RestController 어노테이션을 사용. * Service: @Service 어노테이션을 사용. * Repository: @Repository 어노테이션을 사용하며, 보통 JPA를 통해 구현. JPA와 Hibernate --- **JPA(Java Persistence API)**는 자바 애플리케이션에서 관계형 데이터베이스를 사용하는 방식을 정의한 표준입니다. Hibernate는 JPA의 구현체 중 하나로, 객체-관계 매핑(ORM) 프레임워크입니다. 주요 개념: * 엔티티(Entity): 데이터베이스 테이블에 매핑되는 클래스. * 엔티티 매니저(EntityManager): 엔티티의 생명 주기를 관리. 예시 엔티티 클래스: ```java @Entity public class User { @Id @GeneratedValue(strategy = GenerationType.IDENTITY) private Long id; private String name; private String email; // getters and setters } ``` H2 데이터베이스 설정 및 사용법 --- H2 데이터베이스는 자바 기반의 경량형 데이터베이스로, 주로 테스트 용도로 사용됩니다. 스프링부트와 함께 사용하기 위해서는 다음과 같은 설정이 필요합니다: pom.xml에 H2 의존성 추가: ```java com.h2database h2 runtime ``` application.properties 파일에 설정 추가: ```java spring.datasource.url=jdbc:h2:mem:testdb spring.datasource.driverClassName=org.h2.Driver spring.datasource.username=sa spring.datasource.password=password spring.h2.console.enabled=true ``` H2 콘솔에 접근: 브라우저에서 http://localhost:8080/h2-console로 접근. HTML/CSS/JavaScript --- HTML(HyperText Markup Language): 웹 페이지의 구조를 정의하는 마크업 언어입니다. ```java My Web Page

Hello, World!

``` CSS(Cascading Style Sheets): 웹 페이지의 스타일을 정의하는 언어입니다. ```java body { background-color: #f0f0f0; font-family: Arial, sans-serif; } h1 { color: #333; } ``` JavaScript: 웹 페이지에 동적인 기능을 추가하는 프로그래밍 언어입니다. ```java document.addEventListener('DOMContentLoaded', (event) => { document.querySelector('h1').textContent = 'Hello, JavaScript!'; }); ``` 점프 투 스프링부트 === * H2 DB * jdbc:h2:~/local 로 연결 * DB 파일이 만들어지지 않을 경우 빈 메모장 파일 생성 후 local.mv.db로 바꿔주세요. * [JDK 17 적용](https://velog.io/@cher_blair/IntelliJ-JDK17%EB%A5%BC-%EC%84%A4%EC%B9%98%ED%95%B4%EB%B3%B4%EC%9E%90) * 포트 * 예시 : 8081로 사용 ```java # DATABASE spring.h2.console.enabled=true spring.h2.console.path=/h2-console spring.datasource.url=jdbc:h2:~/local spring.datasource.driverClassName=org.h2.Driver spring.datasource.username=sa spring.datasource.password= # SERVER PORT server.port=8081 ``` * http://localhost:8081/h2-console 로 접속 스프링(Spring)과 스프링 부트(Spring Boot)의 차이점 === 스프링(Spring): --- 스프링은 자바 플랫폼을 위한 강력한 애플리케이션 프레임워크 주요 기능 : 종속성 주입, 트랜잭션 관리, 웹 애플리케이션 개발 지원 등 스프링 프레임워크는 모듈화되어 있으며, 다양한 프로젝트에서 필요에 따라 모듈을 선택적으로 사용할 수 있다. 스프링을 사용하면 설정이 복잡하고 초기 설정 시간이 많이 걸릴 수 있다. 스프링 부트(Spring Boot): --- 스프링 부트는 스프링 프레임워크를 기반으로 한 확장 프레임워크 스프링 부트는 설정을 간소화하고 빠르게 애플리케이션을 개발할 수 있도록 도와줌 Spring Boot는 자동 설정, 내장 서버(예: Tomcat), 의존성 관리 등을 통해 개발자가 설정에 신경 쓸 필요 없이 코드를 작성하는 데 집중할 수 있다. Spring Boot Starter 패키지를 사용하여 특정 기능을 쉽게 추가할 수 있습니다. 예를 들어, spring-boot-starter-web을 추가하면 웹 애플리케이션 개발에 필요한 모든 의존성을 자동으로 가져옴 스프링과 스프링 부트의 구분 === 스프링(Spring): --- 스프링 프레임워크는 다양한 기능을 가진 모듈들의 모음으로, 애플리케이션 개발에 필요한 많은 도구와 기능을 제공 예를 들어, Spring Core, Spring Web, Spring Data, Spring Security 등 스프링 부트(Spring Boot): --- 스프링 부트는 스프링 프레임워크를 기반으로 하며, 설정을 자동화하고 빠르게 애플리케이션을 개발할 수 있게 돕는 확장 프레임워크 스프링 부트는 다양한 스타터 패키지를 제공하여, 특정 기능을 쉽게 추가하고 설정할 수 있다. Spring Boot DevTools, Spring Boot Starter Web, Spring Boot Starter Data JPA 등 인텔리제이에 롬복 플러그인 추가 === * File -> Settings -> Plugins -> lombok 검색 -> 플러그인 설치 * 해당 플러그인 설치 후 SbbApplicationTests 에러 해결 [![1.png](https://i.postimg.cc/3NscCX0Y/1.png)](https://postimg.cc/bSRgq2RB) * @RequiredArgsConstructor 어노테이션을 사용하지 않으면 questionRepository 변수가 초기화되지 않아서 발생하는 에러. * Lombok을 사용하지 않고 해결하려면 직접 생성자를 추가해 주어야 함 SbbApplicationTests === * LazyInitializationException 에러 * 데이터베이스에서 데이터를 가져올 때, 모든 데이터를 한꺼번에 가져오지 않고, 필요한 순간까지 기다렸다가 가져오는 방식을 사용하고 있었다. 이걸 "지연 로딩"이라고 함 * 문제 상황: 테스트 코드가 데이터를 가져옴: 테스트 코드에서 데이터베이스의 데이터를 사용 연결이 끊어진 상태: 데이터를 사용하려고 할 때, 데이터베이스와의 연결이 끊어져 있음 오류 발생: 데이터베이스와 연결이 되어 있지 않아서 데이터를 가져올 수 없었고, 그래서 오류가 발생 * 해결 방법: 이 문제를 해결하려면, 데이터를 가져오는 동안 데이터베이스와의 연결을 유지해야 함. Spring이라는 프레임워크에서 이 연결을 자동으로 관리해주는 방법을 제공. @Transactional이라는 어노테이션. 테스트 클래스에서 트랜잭션 적용 --- * 테스트 클래스에서 @Transactional 어노테이션을 사용하여 트랜잭션을 활성화 * 이렇게 하면 테스트 메소드가 실행되는 동안 데이터베이스와의 연결이 유지됨 ```java package com.mysite.sbb; import static org.junit.jupiter.api.Assertions.assertEquals; import static org.junit.jupiter.api.Assertions.assertTrue; import java.util.List; import java.util.Optional; import org.junit.jupiter.api.Test; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.boot.test.context.SpringBootTest; import org.springframework.transaction.annotation.Transactional; @SpringBootTest class SbbApplicationTests { @Autowired private QuestionRepository questionRepository; @Test @Transactional void testJpa() { Optional oq = this.questionRepository.findById(2); assertTrue(oq.isPresent()); Question q = oq.get(); List answerList = q.getAnswerList(); assertEquals(1, answerList.size()); assertEquals("네 자동으로 생성됩니다.", answerList.get(0).getContent()); } } ``` * [2-05 리포지터리로 데이터베이스 관리하기] 마지막 부분에 설명이 있음 yml로 변경 === ```java # build.gradle dependencies { runtimeOnly 'org.mariadb.jdbc:mariadb-java-client' implementation 'org.springframework.boot:spring-boot-starter-data-jpa' } ``` ```java # properties -> yml 변경 server: port: 8080 spring: datasource: driver-class-name: org.mariadb.jdbc.Driver url: jdbc:mariadb://localhost:3306/sbb_test username: root password: jpa: hibernate: ddl-auto: update show-sql: true logging: level: org.hibernate.orm.jdbc.bind: TRACE org.hibernate.orm.jdbc.extract: TRACE ```