자바 스프링 MVC
12주
신림
초급
x 3
## 주제
스프링 MVC
## 목표
나만의 웹 포트폴리오 만들기
## 커리큘럼
1. 자바 문법 및 알고리즘
2. HTML/CSS
3. Bootstrap
4. JSP
5. Spring MVC
## 대상
1. 웹 개발 입문자
2. 대학 졸업 예정자
3. 취업 준비생
4. Spring MVC를 배우고 싶은 모두
## 시간 및 장소
+ 협의
## 비용
+ 4회 기준 30만원 (회당 2시간)
## 참가 신청
+ 참가신청 클릭
+ 개별 문의
## 연락처
+ 이메일: [email protected]
+ 카 톡: chaesam
# 사전 과제
주어진 링크의 문제를 풀고 코드를 제출해주세요.
(실행하면 코드가 제출됩니다)
1. 구구단 출력 (http://cloudstudying.kr/challenges/18)
2. 1등은 누구? (http://cloudstudying.kr/challenges/108)
3. 당신의 연봉은? (http://cloudstudying.kr/challenges/122)
## 질문 게시판 링크
+ http://cloudstudying.kr/questions
# 자바 기본 문법
## 기본 개념 복습
아래의 동영상 강의를 모두 듣고 난 후, 강의 하단부의 실습 문제를 제출하시오.
1. 자바 프로그래밍이란? (https://cloudstudying.kr/lectures/45)
2. 자바의 특징과 컴퓨터 구조 (https://cloudstudying.kr/lectures/46)
3. 첫 프로그램 만들기 (https://cloudstudying.kr/lectures/47)
4. 변수와 타입 그리고 연산자 (https://cloudstudying.kr/lectures/48)
## 쪽지 시험 대비
위 강의 내용 쪽지시험이 다음 수업에 있습니다. 준비해주세요.
# 개발환경 만들기
Spring 개발환경 구축하기: macOS
## 설치 중 프로그래밍 연습
1. 배열 요소 찾기 (http://cloudstudying.kr/challenges/209)
2. 난수 생성과 반복문 (http://cloudstudying.kr/challenges/210)
3. 평균 구하기 (http://cloudstudying.kr/challenges/211)
4. Circle 객체 만들기 (https://cloudstudying.kr/challenges/220)
## Homebrew 설치
macOS 패키지 관리자 설치 (공식 홈페이지: https://brew.sh/index_ko)
아래 코드를 터미널에 입력하고 기다리면 끝.
```
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
```
## JDK 설치
brew를 통한 JDK 설치
```
brew tap AdoptOpenJDK/openjdk
brew install <version>
```
원하는 버전에 맞게 설치한다.
```
adoptopenjdk-openjdk8
adoptopenjdk-openjdk9
adoptopenjdk-openjdk10
```
## STS 설치
```
brew cask install sts
```
## Tomcat 설치
```
brew install tomcat
```
## PostgreSQL 9.4 설치
```
brew install [email protected]
```
## 레퍼런스
+ Homebrew설치: https://brew.sh/index_ko
+ JDK설치: https://goo.gl/oaSPoa
+ STS설치: https://goo.gl/4XFySr
# SpringMVC 맛보기
## 학습 내용
1. Hello World 출력하기 (https://cloudstudying.kr/lectures/234)
![](https://i.imgur.com/BzfPhAg.png)
2. 스프링 MVC 폴더 구조 (https://cloudstudying.kr/lectures/116)
![](https://i.imgur.com/iT6dU7R.png)
3. MVC 패턴 이해하기 (https://cloudstudying.kr/lectures/235)
![](https://i.imgur.com/V7CGG0Y.png)
# 데이터 베이스 연동하기
## 학습 내용
### 라이브러리 등록
`pom.xml`을 통해 아래 4가지의 라이브러리를 등록.
+ PostgreSQL
+ Spring-JDBC
+ MyBstis
+ MyBatis-Spring
### 라이브러리 설정
`root-context.xml`을 변경하여 라이브러리 객체를 생성.
### 기타 설정파일 작성
데이터베이스 사용을 위한 설정 파일 작성
+ jdbc.properties
+ mybatis-config.xml
## 레퍼런스
+ 데이터베이스 연동하기 (https://cloudstudying.kr/lectures/117)
# 클래스 만들기 연습
## 과제 내용
아래 링크의 과제를 실행하여 제출하시오.
+ 정사각형 (https://cloudstudying.kr/challenges/230)
+ 원기둥 (https://cloudstudying.kr/challenges/231)
+ 쇼핑몰 상품 (https://cloudstudying.kr/challenges/233)
+ 은행 계좌 (https://cloudstudying.kr/challenges/241)
## 출제 의도
클래스 정의 및 구현 능력 증진
# 부트스트랩 연동하기
## 학습 목표
부트스트랩(bootstrap)을 사용한 페이지 만들기 연습
## 학습 내용
1. jumbotron
![](https://i.imgur.com/LZMeJnI.png)
2. navbar
![](https://i.imgur.com/rfQR5pd.png)
3. container & layout
![](https://i.imgur.com/DLhUqf8.png)
## 실습 과제
1. 로그인 페이지: forms
![Imgur](https://i.imgur.com/qYhTwTD.png)
2. 앨범 페이지
![Imgur](https://i.imgur.com/aymH1vz.png)
## 레퍼런스
+ 웹 페이지 만들기: Bootstrap (https://cloudstudying.kr/lectures/225)
+ 부트스트랩 공식 홈페이지 (https://getbootstrap.com)
# 데이터 등록 및 조회
## 학습 목표
DB를 사용하여 데이터를 등록하고 이를 확인한다.
## 학습 내용
1. 조회 페이지 만들기
![](https://i.imgur.com/a8fEkfS.png)
2. 등록 페이지 만들기
![](https://i.imgur.com/ojmg4aS.png)
3. 테이블 생성
![](https://i.imgur.com/FqX7hzi.png)
4. VO 생성
![](https://i.imgur.com/HF4qhT0.png)
5. Mapper 생성
![](https://i.imgur.com/nmsk5LQ.png)
6. 컨트롤러 작성
## 레퍼런스
+ 데이터 등록하기 (https://cloudstudying.kr/lectures/120)
+ 데이터 조회하기 (https://cloudstudying.kr/lectures/121)
# API 사용 연습
## 과제 내용
1. Random (https://cloudstudying.kr/challenges/135)
2. ArrayList (https://cloudstudying.kr/challenges/136)
3. HashMap (https://cloudstudying.kr/challenges/156)
4. 문자열 뒤집기 (https://cloudstudying.kr/challenges/255)
5. 주사위 던지기 (https://cloudstudying.kr/challenges/38)
## 출제 의도
OOP 연습 및 API 활용 능력 향상
# 데이터 수정 및 삭제
## 학습 목표
스프링MVC와 DB를 연동하여 데이터의 수정 및 삭제를 연습한다.
## 학습 내용
1. 수정하기
2. 삭제하기
## 수정하기
1. View: 데이터 수정 페이지 작성
![](https://i.imgur.com/MulIybI.png)
2. Controller: 수정 값 받기
![](https://i.imgur.com/otTffIS.png)
3. Mapper: DB 갱신
```
@Update("update books set title = #{title}, author = #{author}, image = #{image} where id = #{id}")
public boolean update(Book book);
```
4. redirect: 갱신 후 페이지 이동
## 삭제하기
1. View: 삭제 버튼 생성
![](https://i.imgur.com/DiYPd8r.png)
2. Controller: 삭제 요청 받기
3. Mapper: DB 데이터 삭제
4. redirect: 삭제 후 페이지 이동
## 관련 강의 자료
+ 데이터 수정하기 (https://cloudstudying.kr/lectures/122)
+ 데이터 삭제하기 (https://cloudstudying.kr/lectures/123)
# 포트폴리오 프로젝트 구상하기
## 목표
취업 대비용 포트폴리오를 구상하고 이를 설계한다.
## 프로세스
1. 브레인 스토밍
- 평소 관심있는 것 또는 만들고 싶은 것을 나열한다.
2. Why-How-What 분석
- 자신의 동기(why)와
- 방법론(how)을 정리하고,
- 궁극적으로 무엇(what)을 만들지 고민한다.
3. 유즈케이스 다이어그램
- 사용자(관리자, 매니저, 유저, etc..)를 정리하고,
- 각 사용자별 기능들을 분류한다.
4. 화면 흐름 설계
- 유즈케이스 다이어그램을 토대로,
- 사용자의 화면 흐름을 설계한다.
5. 클래스 다이어그램 설계 및 구현
- 화면 흐름을 기반으로,
- 클래스 다이어그램을 설계하고
- 스프링MVC를 통해 이를 구현한다.
# 타일즈 적용하기
## 학습 목표
타일즈의 사용법과 장점을 이해한다.
## 학습 내용
1. 타일즈 환경 설정
+ 라이브러리 등록 (pom.xml)
+ 뷰 리졸버 추가 및 변경 (sevelet-context.xml)
+ 타일즈 설정 파일 작성 (/WEB-INF/tiles/tiles.xml)
2. 레이아웃 설정
+ 레이아웃 작성 (/WEB_INF/tiles/layouts/classic.jsp)
+ 헤더 작성 (/WEB-INF/tiles/components/header.jsp)
+ 푸터 작성 (/WEB-INF/tiles/components/footer.jsp)
3. 테스트
+ Controller: `*/*` 형태로 리턴값 변경
+ View: 중복 코드 제거
+ CSS 커스터마이징 (css/custom.css)
+ 결과 확인
![](https://i.imgur.com/NmbNmbc.png)
## 레퍼런스
+ 스프링 Tiles (https://cloudstudying.kr/lectures/125)
# 스프링 시큐리티
## 학습 목표
스프링 시큐리티를 사용한 로그인 로그아웃 구현.
## 학습 내용
1. 시큐리티 환경설정
+ 라이브러리 등록 (pom.xml)
+ 설정파일 등록 및 필터 추가 (web.xml)
+ 설정 파일 작성 (/WEB-INF/spring/security/security-context.xml)
2. 로그인/로그아웃 UI
+ 로그인 페이지 작성 (views/statics/login.jsp)
+ 로그인/로그아웃 버튼추가 (tiles/components/header.jsp)
+ 컨트롤러에 로그인 페이지 연결 (SessionsController.java)
3. 시큐리티 설정
+ DB 테이블 생성: `users`, `authorities`
+ DB 데이터를 통한 인증설정 (spring/security/security-context.xml)
+ 로그인 페이지: input name 변경
## 레퍼런스
+ 스프링 Security (https://cloudstudying.kr/lectures/126)
# 회원 가입
## 학습 목표
스프링 시큐리티를 활용하여 회원 가입 프로세스를 구현한다.
## 실습 요약
1. View
- 회원 가입링크
![](http://i.imgur.com/JxLEbO5.png)
- 회원 가입 form
![](http://i.imgur.com/OMer82X.png)
2. Controller
- URL 연결: @RequestMapping
- 폼 데이터 받기: @ModelAttribute
- DB로 회원 정보 및 권한 저장
3. Model
- VO 작성: `User.java`
- Mapper 작성: `UserMapper.java`
4. SpringSecurity 설정
- 회원가입 페이지에 모두 접근 가능하도록.
## 실습 자료
+ 회원가입 (https://cloudstudying.kr/lectures/145)
# 권한 제한
## 학습 목표
스프링 시큐리티를 사용하여 사용자별 행동 권한을 제한한다.
## 실습 요약
1. 화면상 기능 숨기기
- View 페이지 상에서 동작 버튼 등을 숨김.
2. URL 접근 제한하기
- 시큐리티 설정을 통해 URL 접근을 제한.
## 실습 자료
+ 권한 제한 (https://cloudstudying.kr/lectures/146)
# 관리자 페이지: 권한 부여 및 삭제
## 학습 목표
스프링 시큐리티를 사용하여 관리자 페이지를 구현한다.
![](http://i.imgur.com/CQW0p32.png)
## 실습 내용
1. View
- 관리자 링크 추가
- 관리자 페이지 작성
2. Controller
- 모든 사용자 가져오기
- 뷰에 데이터를 전달
3. Model
- UserMapper 메소드 추가: `@many` 주의
- VO 변경: `List<Authority> authorities;`
- VO 추가: `Authority.java`
4. 권한 부여 및 삭제
- view: 권한 부여 버튼 생성
- controller: 사용자와 역할을 입력받아 이를 DB에 저장
- model: 맵퍼에 메소드 작성
- view: 권한에 따라 버튼 색 달리하기
## 실습 자료
+ 권한 부여하기 (https://cloudstudying.kr/lectures/149)
# 입사면접 예상 질문
## 동기 및 적성
1. 프로그래밍을 접하게 된 계기가 어떻게 되시나요?
2. 개발자를 업으로 삼겠다고 마음먹게 된 계기가 무엇인가요?
3. 개발자의 필수 덕목을 3가지 꼽자면 어떤 것들이 있을까요?
4. 개발자 서적중 인상 깊었던 것이 있다면 알려주세요.
5. 개발 역량 강화를 위해 개인적으로 노력하는 부분이 있으신가요?
## Java 기본 역량
1. OOP에 대해 설명해주세요.
2. 클래스와 객체를 비교하여 설명해주세요.
3. 인터페이스의 장점을 설명해주세요.
4. 자바 API란 무엇이고 왜 사용할까요?
5. 메소드 오버라이딩이란 무엇인가요?
6. 상속에 대해 설명해주세요.
7. 예외 처리란 무엇일까요?
8. Java I/O를 사용하여, 파일을 읽고 변경후 저장하는 과정을 설명해주세요.
## Java 심화 역량: 자료구조 및 알고리즘
1. Java Collections에 대해 설명해주세요.
2. ArrayList와 LinkedList를 비교해보세요.
3. HashMap의 장점은 무엇일까요?
4. Set이란 어떤 자료구조인가요?
5. 알고리즘의 복잡도란 무엇인지 설명해주세요.
## DB 기본 역량
1. 데이터베이스는 왜 사용할까요?
2. 테이블이란 무엇인가요?
3. PK와 FK를 설명해주세요.
4. 다음의 테이블간 관계를 설명해주세요.
- one-to-one
- one-to-many
- many-to-many
## 포트폴리오 질문
1. 해당 포트폴리오를 만든 동기가 있을까요?
2. 클라이언트-서버 구조에 대해 설명해주세요.
3. 프론트엔드와 백엔드를 비교 및 분석해주세요.
3. MVC 패턴이란 무엇이고 어떠한 장점이 있는지 설명해주세요.
4. MyBatis를 사용한 이유를 설명해주세요.
5. VO는 왜 필요한가요?
6. 게시판 하나 만드는데 얼마나 걸리실까요?
## 실전 면접 코딩 테스트
+ 생략..
# 일대다 관계
## 학습 목표
일대다 관계를 이해하고 이를 구현한다.
## 강의 자료
+ 도서 리뷰 등록하기 (https://cloudstudying.kr/lectures/143)
## 학습 내용
1. 일대다 관계란?
2. 도서별 리뷰 작성하기
- View: 폼 만들기
- Controller: 폼 데이터 받기 -> 맵퍼 호출
- Model: VO 생성 -> Mapper 등록
- DB: 테이블 생성
## 연습하기
아래의 다이어그램을 참고하여 foods의 CRUD를 구현하고, 각 food 별 ingredients를 CRUD 하게 하시오.
![Imgur](https://i.imgur.com/MwJO9R2.png)
음식 재료 테이블 작성쿼리는 아래를 참조한다.
```
create table (
id serial primary key,
name string not null,
price integer not null,
food_id integer referenes foods not null
);
```
### 음식-재료 추가 설명
예를들어 에그마요 샌드위치를 클릭한 경우, 아래와 같은 정보가 표시되어야 한다.
+ 에그마요 샌드위치(기본가: 1000원)
- 식빵 (500원) ✅
- 계란 (500원) ✅
- 마요네즈 (500원) ✅
- 샐러드: 감자,당근,오이 (500원) ✅
- 오이 피클 (500원)
+ 최종 가격: 3000원
# 다대다 관계
## 학습 목표
다대다 관계를 이해하고 이를 구현한다.
## 학습 내용
장바구니에 물품 담기
1. View - 화면
+ 장바구니에 담기 버튼 추가
+ 장바구니 페이지 생성
+ 주문내역 페이지 생성
2. DB - 데이터 보관소
+ 모델링: 데이터간 관계 정의
+ 테이블 생성
3. Model - 데이터 처리자
+ VO 생성: carts, items
+ Mapper 생성: cartMapper, itemMapper
4. Controller - 서비스 담당자
+ 장바구니에 담기()
+ 장바구니 목록 보기()
+ 주문내역 보기()
## 레퍼런스
+ 도서 주문하기 (https://cloudstudying.kr/lectures/321)