spring mvc homepage 스프링 홈페이지 만들기 3

SPRING FRAMEWORK 2020. 5. 15. 13:18

spring mvc homepage 스프링 홈페이지 만들기 3

mysql을 설치해주세요. 헐.. 전 mariadb를 설치되어 있네요. 

mariadb10.4

음 mariadb로 설치할께요 mysql과 동일하게 접속이 되니 그냥 진행할께요. 

db를 하나 만들어요. home_page로 만들었어요. 
schemas 잘만들어지네요.

mysql workbench 프로그램으로 생성이 되니 mysql홈페이지에서 다운받아 설치하시면되요. 

SELECT HOST, USER, PASSWORD FROM USER;

CREATE USER 'eunhopapa'@'%' IDENTIFIED BY 'eunho20190000';
SELECT HOST, USER, PASSWORD FROM USER;

db를 생성해요. mariadb도 버전이 오르면서 툴에서 생성하는게 잘 안되어서 명령어로 생성해요. 

권한등을 설정할꺼에요. 
dba설정

전 모든권한을 주었어요.

이렇게 db생성이 되었습니다. 

그리고나서 toad for mysql 설치합니다. 

접속 설정

이렇게 해서 db에 접속을 해요. 잘되네요. 이제 스프링에 세팅해줄께요. 

/homepage/src/main/webapp/WEB-INF/spring/root-context.xml
/homepage/src/main/webapp/WEB-INF/spring/appServlet/servlet-context.xml

두파일을 수정해요.

엑셀다운로드 mybitis log 인터셉터등으로 다양한 파일을 생성해야해요. 내용은 없고 추가해주도록할게요.

interceptor를 추가해줄께요. 하나는 로그인 관련 처리할것이고 하나는 메타태그 관련정보를 다를거에요. 

AuthInterceptor.java
0.00MB
MetaInterceptor.java
0.00MB

src->main->resources 안에 아래의 파일을 추가수정해요. 

log4j.xml
0.00MB
log4jdbc.log4j2.properties
0.00MB
mybatis-config.xml
0.00MB

그리고 쿼리 관련 xml도 만들어줘요. 

BasicMapper.xml
0.00MB

WIN-INF 에다가 views.xml 파일을 복사해줘요. 

views.xml
0.00MB

그럼 실행을 해보면 별로 변한건 없이 db연결만 되었어요. 테스트는 따로 안할께요. 

그리고 jsp 파일에 <div class="container"> 부분을 모두 <div class="container-fluid"> 이렇게 변경을 해주세요

전 화면에 꽉찬 페이지를 만들고 싶어서 그래요. 

홈페이지

꽉 찬 페이지가 나오는것을 확인할수 있어요. <div class="col-lg-6"> 을 <div class="col-lg-12"> 변경해야하는것도 잊지 마세요.

저작자표시

'SPRING FRAMEWORK' 카테고리의 다른 글

spring mvc homepage 스프링 홈페이지 만들기 5  (0) 2020.05.18
spring mvc homepage 스프링 홈페이지 만들기 4  (0) 2020.05.18
spring mvc homepage 스프링 홈페이지 만들기 2  (0) 2020.05.15
spring mvc homepage 스프링 홈페이지 만들기 1  (0) 2020.05.15
summernote img 태그 이미지 첨부 스프링  (0) 2020.04.21
블로그 이미지

은호아빠

여행, 맛집, 일상, 프로그래밍, 개발자, 윈도우, 웹, jsp, spring, db, mysql, oracle, c#

,

spring mvc homepage 스프링 홈페이지 만들기 2

SPRING FRAMEWORK 2020. 5. 15. 11:22

spring  mvc homepage  스프링 홈페이지 만들기 2

adminlte를 붙여볼게요. 

여기에 복사

경로는 src -> main -> webapp -> resources 에 압축을 푼 adminlte를 복사를 해요. 

※AdminLTE-3.0.4 가 길어보여서 AdminLTE로 이름 변경했어요. 

샘플소스

복사를 모두 해도 되겠지만 일단 조금씩 해볼께요. 용량이 큰지라 top-nav.html 기준으로 가져와 볼게요.

top-nav.html 파일을 메모장에서 열어요. 대충 보니까 두 군데 파일이 필요해 보이는데 2 폴더 용량이 61메가나 되네요.

모든 소스가 다 포함되어 있어서 사용하는 파일만 하나하나 복사할까 했지만 그냥 다 복사할게요.

그리고 home.jsp파일내용을 top-nav.html내용으로 수정해줍니다. 경로도 수정야 하는데요. 첨부파일을 참고해주세요.

home.jsp
0.01MB

실행하여 결과를 보면요. 

home.jsp수정후 결과

결과를 잘 보았는데요. 이제 이걸 쪼갤 예정입니다. 위쪽 메뉴 부분과 아래쪽 부분은 다른 페이지에서 공통으로 사용하는 영역이고요. 

본문 내용만 계속 수정이 이루어질 예정이기 때문에 그래요.

페이지 소스를 보니 보니 <!-- Content Wrapper. Contains page content --> 부분 위쪽과 <!-- /.content-wrapper --> 부분 아래쪽으로 나누면 될 거 같아요. 

views안에 하위 폴더를 만들어요 저는 include라는 폴더를 만들었어요. 

그리곤 home.jsp파일을 복사를 했어요. 

파일명은 top과 bottom이라고 지었어요 주석을 보니 헤더와 풋터로 해야 할 것 같은 느낌인데 그냥 진행할게요. 

top bottom.

top는 <!-- Content Wrapper. Contains page content --> 위쪽만 남기고 bottom은 <!-- /.content-wrapper -->아래쪽만남겨요.

home.jsp 파일내용도 수정을 해요. 

<!-- Content Wrapper. Contains page content --> 와  <!-- /.content-wrapper --> 사이내용만 남기고 위아래를 지워요. 

그리고 위아래로 두파일을 포함시켜요. 

<%@include file="include/top.jsp"%>
<%@include file="include/bottom.jsp"%>

그럼 이렇게 파일3개가 수정되었어요. 첨부한 파일을 참고하세요. 

home.jsp
0.00MB
top.jsp
0.01MB
bottom.jsp
0.00MB

그리고 결과를 확인해보면 이렇게 나와요. 

아까와 결과가 같지요? 

이제 로그인이라던지 가입하기 같은 걸 해볼 거예요. db를 설치하고 해야 할 텐데 

전 mysql을 사용할 예정이에요. 버전은 상관없어요. 

참고자료 book.naver.com/bookdb/book_detail.nhn?bid=9425458

 

코드로 배우는 스프링 웹 프로젝트

[코드로 배우는 스프링 웹 프로젝트]는 개발 현장에서 사용하는 도구로서 스프링을 취급하는 책으로, SPRING FRAMEWORK(이하 스프링)를 이용해서 ‘웹 프로젝트’를 어떻게 진행하는지를 설명한다. �

book.naver.com

참고 카페 cafe.naver.com/gugucoding

 

구멍가게코딩단 : 네이버 카페

안녕하세요? 구멍가게 코딩단의 활동을 위한 카페입니다.

cafe.naver.com

 

저작자표시

'SPRING FRAMEWORK' 카테고리의 다른 글

spring mvc homepage 스프링 홈페이지 만들기 4  (0) 2020.05.18
spring mvc homepage 스프링 홈페이지 만들기 3  (0) 2020.05.15
spring mvc homepage 스프링 홈페이지 만들기 1  (0) 2020.05.15
summernote img 태그 이미지 첨부 스프링  (0) 2020.04.21
spring mvc 스프링 바코드 생성 하기 Zxing 사용법  (4) 2020.04.15
블로그 이미지

은호아빠

여행, 맛집, 일상, 프로그래밍, 개발자, 윈도우, 웹, jsp, spring, db, mysql, oracle, c#

,

spring mvc homepage 스프링 홈페이지 만들기 1

SPRING FRAMEWORK 2020. 5. 15. 10:04

spring  mvc homepage  스프링 홈페이지 만들기 1

스프링을 이용하여 홈페이지를 제작해볼 예정입니다. 

최대한 간단하게 필요한 결과 위주로 구성해볼 예정입니다.

UI는 https://adminlte.io/themes/v3/pages/layout/top-nav.html를 이용할 예정입니다.

소스코드를 다운로드 받아주세요.
용량

압축을 해제하니 용량이 제법 많으네요. 일단 다운로드한 후 잘 보관해 놓으세요.

STS를 설치해주세요. 그리고 새로운 프로젝트를 시작해요.

스프링프로젝트생성

프로젝트를 생성을 해요. 생성할때 Spring MVC Project로 해주세요. 

서버를 실행해보세요. 톰캣서버로 실행을 할 거예요. 8 버전으로 맞추어 주세요. 

실행을 하면 이런 화면이 보일꺼에요. 

hello world

??? 표도 나오고 그러죠? 이제 utf8환경으로 세팅을 할 건데요. 세팅되어 있는 환경을 복사하는 형태로 진행할게요.

안에 내용은 따로 공부해보세요. 검색하면 잘 나와요. 

처음에 할 일은 pom.xml을 수정할 거예요. 

pom.xml

이 부분을 남기고 모두 첨부한 pom.xml과 같게 수정을 해줘요 안에 필요 없는 내용은 삭제하시면 돼요. 

pom.xml
0.01MB

다음은 web.xml을 수정할게요. 

web.xml
0.00MB

web.xml내용을 복사해주세요.

이제 jsp페이지를 수정할 거예요. 

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ page session="false" %>
<html>
<head>
	<title>Home</title>
</head>
<body>
<h1>
	Hello world!  
</h1>

<P>  The time on the server is ${serverTime}. </P>
</body>
</html>

 

내용일 텐데요 아래와 같이 수정을 해요. 

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<html>
<head>
	<title>Home</title>
</head>
<body>
<h1>
	Hello world!  
</h1>

<P>  The time on the server is ${serverTime}. </P>
</body>
</html>

 

서버 폴더 안에 톰캣 8이 있어요 거기에 server.xml이 있는데 이걸 수정할 거예요.

<Context docBase="homepage" path="/" reloadable="true" source="org.eclipse.jst.jee.server:homepage"/></Host>

path를 지우세요. 이러면 localhost:8080으로 접속 시 바로 home.jsp내용이 나와요. 

헬로우 월드가 출력되었죠?

다음은 ADMINLTE3 네이게이션페이지를 출력해볼께요. 

 

참고자료

https://book.naver.com/bookdb/book_detail.nhn?bid=9425458

 

코드로 배우는 스프링 웹 프로젝트

[코드로 배우는 스프링 웹 프로젝트]는 개발 현장에서 사용하는 도구로서 스프링을 취급하는 책으로, SPRING FRAMEWORK(이하 스프링)를 이용해서 ‘웹 프로젝트’를 어떻게 진행하는지를 설명한다. �

book.naver.com

참고카페

https://cafe.naver.com/gugucoding

 

구멍가게코딩단 : 네이버 카페

안녕하세요? 구멍가게 코딩단의 활동을 위한 카페입니다.

cafe.naver.com

 

저작자표시

'SPRING FRAMEWORK' 카테고리의 다른 글

spring mvc homepage 스프링 홈페이지 만들기 3  (0) 2020.05.15
spring mvc homepage 스프링 홈페이지 만들기 2  (0) 2020.05.15
summernote img 태그 이미지 첨부 스프링  (0) 2020.04.21
spring mvc 스프링 바코드 생성 하기 Zxing 사용법  (4) 2020.04.15
SPRING MVC 세팅 설정 시작하기!  (0) 2020.04.06
블로그 이미지

은호아빠

여행, 맛집, 일상, 프로그래밍, 개발자, 윈도우, 웹, jsp, spring, db, mysql, oracle, c#

,

공지사항

글 보관함

달력

«   2024/04   »
일 월 화 수 목 금 토
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30

티스토리툴바