롬복을 활용해 늘어진 코드를 간소화하고 printIn() 문을 로깅으로 변환한다. 🤍 롬복 추가하기 롬복 : 코드를 간소화해주는 라이브러리, 여러 필수 코드가 반복되는 것을 최소화할 수 있고 println()문을 로깅 기능을 대체 할 수 있다. 로깅 : 프로그램의 수행 과정을 기록으로 남기는 것. build.gradle 파일에 롬복을 추가한다. compileOnly 'org.projectlombok:lombok' annotationProcessor 'org.projectlombok:lombok' dependencies {} 블록 안에는 프로젝트를 생성할 때 추가한 도구들이 적혀 있다. 웹 서비스를 만들기 위한 web mustache,jpa,h2database를 확인할 수 있다. 롬복도 여기에 추가한다. ..
앞에서 폼 데이터를 DB에 저장했다. 폼 데이터를 DTO로 받아 엔티티로 변환한 후 리파지터리를 이용해 DB에 저장하는 과정이였다. 테이블에는 데이터가 한 행씩 생성(Create)된다. 이렇게 채워진 데이터는 조회(Read),수정(Update),삭제(Delete) 할 수 있다. CRUD 조작은 SQL이라는 언어로 수행한다. 대표적인 SQL 문법으로는 데이터를 생성할 때 사용하는 INSERT 문, 조회할 때 사용하는 SELECT문, 수정할 때 사용하는 UPDATE문, 삭제할 때 사용하는 DELETE문이 있다. 📌 H2 DB 접속하기 src > main > resources > application.properties server.servlet.encoding.force-response=true #H2 DB..
받은 데이터를 데이터베이스에 저장해보자 📌 데이터베이스와 JPA 데이터베이스 DB 데이터를 관리하는 창고 데이터를 행과 열로 구성된 테이블에 저장해 관리한다. DB 프로그램 : MySQL, 오라클, 마리아DB, H2 DB 등 SQL ( Structured Query Language ) 언어를 사용한다. 자바로 DB에 명령을 어떻게 내리나? 자바 언어 ( JPA : Java Persistence API ) 로 DB에 명령을 내린다. 데이터를 객체 지향적으로 관리할 수 있게 해 준다. 🤍 JPA의 핵심 도구 엔티티 : 자바 객체를 DB가 이해할 수 있게 만든 것, 이를 기반으로 테이블이 만들어진다. 리파지터리 : 엔티티가 DB 속 테이블에 저장 및 관리될 수 있게 하는 인터페이스이다. DTO로 받은 폼 데이..
CRUD : 게시글을 생성 (Create) 조회 (Read) 수정 (Update) 삭제 (Delete) 하는 것. 📌 폼 데이터란? form data HTML 요소인 태그에 실려 전송되는 데이터 태그에 실어 보낸 데이터는 서버의 컨트롤러가 객체 (DTO : Data Transfer Object) 에 담아 받는다. DTO로 받은 데이터는 최종적으로 데이터베이스에 저장된다. 1. 폼 데이터를 DTO로 받기 new.mustache {{>layouts/header}} Submit {{>layouts/footer}} 2. 컨트롤러 만들기 ArticleController package com.example.firstproject.controller; import org.springframework.stereotyp..
레이아웃 : 화면에 요소를 배치하는 일 헤더 - 푸터 레이아웃 : 상단의 헤더 영역에는 사이트 안내를 위한 내비게이션, 하단의 푸터 영역에는 사이트 정보, 두 영역 사이에는 핵심 내용인 콘텐츠를 배치. 부트스트랩 : 웹 페이지를 쉽게 만들 수 있도록 각종 레이아웃, 버튼, 입력창 등 디자인을 미리 작성해 놓은 코드 모음. 미리 작성된 html,css,자바스크립트 코드를 가져다 사용. 부트스트랩 v5.0 사용. Navbar Home Link Dropdown Action Another action Something else here Disabled Search {{username}}님, 반갑습니다. ⓒ CloudStudyin | Privacy | Terms 📌 헤더-푸터를 템플릿화하기 템플릿화 : 코드를 하..
웹 서비스 : 클라이언트의 요청에 대한 서버의 응답으로 동작. 스프링 부트 : 서버의 역할 서버 : 모델, 뷰, 컨트롤러가 유기적으로 역할을 분담해 클라이언트의 요청을 처리한다. 컨트롤러가 클라이언트의 요청을 받고, 뷰가 최종 페이지를 만들고, 모델이 최종 페이지에 쓰일 데이터를 뷰에 전달한다. 📌 실행 흐름 🤍 /hi 페이지_컨트롤러 동작 컨트롤러임을 선언 클라이언트로부터 "/hi" 요청을 받아 접수 "/hi" 요청을 받음과 동시에 메서드 수행 뷰 템플릿 페이지에서 사용할 변수를 등록하기 위해 모델 객체를 매게변수로 가져옴 모델에서 사용할 변수를 등록 메서드를 수행한 결과로 파일을 반환 package com.example.firstproject.controller; import org.springfra..
📌 뷰 템플릿과 MVC 패턴 1. 뷰 템플릿이란? View Template : 화면을 담당하는 기술, 웹 페이지(View)를 하나의 틀(Template)로 만들고 여기에 변수를 삽입해 서로 다른 페이지로 보여준다. ex ) Mustache(머스테치)가 뷰 템플릿을 만드는 도구이다. 머스테치 외의 템플릿 엔진으로는 Thymeleaf, JSP 등이 있다. 2. MVC 패턴이란? 화면을 담당하는 뷰 템플릿을 '뷰'라고 정의한다면 뷰는 컨트롤러와 모델이라는 두 동료가 있다. 컨트롤러(Controller) : 클라이언트의 요청에 따라 서버에서 이를 처리하는 역할 모델(Model) : 데이터를 관리하는 역할 웹 페이지를 화면에 보여주고 (View), 클라이언트의 요청을 받아 처리하고 (Controlelr), 데이터..
📌 스프링과 스프링 부트 스프링 부트는 스프링 프레임워크 ( Spring framework ) 를 개선한 것이다. 대표적인 개선 사항 개발 환경 설정을 간소화 : 스프링은 버전에 따라 동작하는 외부 라이브러리를 일일이 찾아 연동해야 한다. 하지만 스프링 부트는 미리 설정된 스타터 프라젝트로 외부 라이브러리를 최적화해 제공하므로 사용자가 직접 연동할 필요가 없다. 웹 애플리케이션 서버를 내장 : 스프링 부트는 내부에 웹 애플리케이션 서버 ( WAS, Web Application Server )인 톰캣을 가지고 있다. 따라서 웹 서비스를 jar 파일로 간편하게 배포할 수 있다. 스프링 부트 버전 접미사 스프링 부트 뒤에 표기된 접미사 : 소프트웨어 생명주기를 의미 일반적으로 GA 또는 아무런 접미사가 없는 ..
객체를 자바 컬렉션에 저장 하듯이 DB에 저장할 수는 없을까? 🤍 JPA - Java Persistence API - 자바 진영에서 ORM 기술 표준으로 사용되는 인터페이스의 모험 - 구현된 클래스와 매핑을 해주기 위해 사용되는 프레임워크 - JPA를 구현한 대표적인 오픈소스 -> Hivernate ✉ ORM - Object - Relational - Mapping ( 객체 관계 매핑 ) - 객체는 객체대로 설계, 관계형 데이터베이스는 관계형 데이터베이스대로 설계 - ORM 프레임워크가 중간에서 매핑 JPA는 애플리케이션과 JDBC 사이에서 동작한다. 🤍 JPA 동작 - 저장 🤍 JPA 동작 - 저장 🤍 JPA를 사용하는 이유 - SQL 중심적인 개발에서 객체 중심으로 개발 - 생산성 - 유지보수 : 필..
VSCode에서 타입스크립트로 리액트 프로젝트를 개발할 때 몇 가지 환경을 설정해주면 좀 더 편리하게 개발할 수 있다. 프로그램명 용도 운영체제 기타 프리티어 코드 정렬 윈도우/macOS 권장 테일윈드CSS CSS 스타일링 필수 헤드윈드 테일윈드CSS 클래스 분류기 선택 포스트 CSS CSS 구문 강조 표시 선택 🤍 편집기 설정 파일 & 설치 및 설정하기 VSCode는 설정 화면에서 바꾼 내용을 settings.json 파일에 저장해 놓는다. Ctrl + Shift + P 를 눌러 나타난 메뉴에서 "User Settings"를 입력하고 Open User Settings (JSON) 를 선택한다. 해당하는 키와 값을 볼 수 있다. ✉ 프리티어 설치 및 설정 프리티어 Prettier 코드에서 띄어쓰기, 들여..
🤍 설치할 개발 도구 프로그램명 용도 운영체제 기타 Node.js 웹 서버 개발 플랫폼 윈도우/macOS 필수 VSCode 소스 코드 편집기 윈도우/macOS 권장 scoop 윈도우용 설치 프로그램 윈도우 권장 Homebrew macOS용 설치 프로그램 macOS 권장 touch 파일 관리 유틸리티 윈도우 선택 Chrome 웹 브라우저 윈도우/macOS 권장 더보기 https://product.kyobobook.co.kr/detail/S000200550965 🤍 scoop 설치하기 scoop : 명령 줄에서 프로그램을 쉽게 설치하게 해주는 프로그램. scoop update * 명령 한 번이면 scoop으로 설치한 모든 프로그램을 한꺼번에 업데이트할 수 있다. scoop으로 설치할 프로그램의 위치 (C:\..
display - block & inline I was a BLOCK div element! I was a INLINE span element! Lorem ipsum dolor sit amet consectetur adipisicing elit. Vero, molestias. 📌 d-inline & d-blcok I was a BLOCK div element! I was a INLINE span element! Lorem ipsum dolor sit amet consectetur adipisicing elit. Vero, molestias. 원래 block 엘리먼트였던 div가 이제는 글자들 만큼의 크기를 가진 span 엘리먼트처럼 되었다. span 엘리먼트였던 하단은 block 엘리먼트가 되었다. CS..