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"> 변경해야하는것도 잊지 마세요.

블로그 이미지

은호아빠

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

,

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

 

블로그 이미지

은호아빠

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

,

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

 

블로그 이미지

은호아빠

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

,

spring mvc 스프링 바코드 생성 하기 Zxing 사용법

안녕하세요. spring 프로젝트중 바코드를 생성해서 회원에게 날려줘야 할일이 생겼어요. 

그래서 지금 바코드 생성 관련해서 찾아보니 zxing를 사용한 방법이 공개되어 있었어요. 

일단 메이븐에서 라이브러리 다운로드를 위해 설정을 합니다. 

		<!-- https://mvnrepository.com/artifact/com.google.zxing/core -->
		<!-- 구글바코드 오픈소스 -->
		<dependency>
		    <groupId>com.google.zxing</groupId>
		    <artifactId>core</artifactId>
		    <version>3.4.0</version>
		</dependency>
		<!-- https://mvnrepository.com/artifact/com.google.zxing/javase -->
		<dependency>
		    <groupId>com.google.zxing</groupId>
		    <artifactId>javase</artifactId>
		    <version>3.4.0</version>
		</dependency>

그리고나서 컨트롤러 위치한 곳에 바코드 이미지를 받아가는 코딩을 합니다. 

import com.google.zxing.BarcodeFormat;
import com.google.zxing.BinaryBitmap;
import com.google.zxing.MultiFormatWriter;
import com.google.zxing.client.j2se.MatrixToImageWriter;
import com.google.zxing.common.BitMatrix;
import com.google.zxing.qrcode.QRCodeWriter;

라이브러리를 import를 하고요. 

@RequestMapping(value = "/get_barcode", method = RequestMethod.GET)
	public ResponseEntity<byte[]> get_partner_image(HttpServletRequest request, Model model) throws Exception {
		 smsp.print_String("get_barcode ==>" + "아악."  );
		String text ="https://digital365365.com";
        String _formatName = text;
        text = new String(text.getBytes("UTF-8"), "ISO-8859-1");
      
 		byte[] imageInByte_re = smsp.getBarCodeImage(text, 840, 160);
 		//smsp.print_String(image.toString());
 		HttpHeaders headers = new HttpHeaders(); 
 		String mt_filename = text+".png";
        String formatName = "png";	      
	      MediaType mType = MediaUtils.getMediaType(formatName);
	      //smsp.print_String(mType.toString());
	      if(mType != null){
		        headers.setContentType(mType);
		      }else{
		    	mt_filename = new String(mt_filename.getBytes("UTF-8"), "ISO-8859-1");
		        headers.setContentType(MediaType.APPLICATION_OCTET_STREAM);
		        headers.add("Content-Disposition", "attachment;filename=\""+mt_filename+"\";");
		        headers.add("Content-Transfer-Encoding", "binary");
		      }
       
	      return new ResponseEntity<byte[]>(imageInByte_re, headers,HttpStatus.OK);
	}

바코드 생성코드는 이렇게 있습니다. 

public static byte[] getBarCodeImage(String text, int width, int height) {
		try {
			Hashtable<EncodeHintType, ErrorCorrectionLevel> hintMap = new Hashtable<>();
			hintMap.put(EncodeHintType.ERROR_CORRECTION, ErrorCorrectionLevel.L);
			Writer writer = new Code128Writer();
			BitMatrix bitMatrix = writer.encode(text, BarcodeFormat.CODE_128, width, height);
			ByteArrayOutputStream byteArrayOutputStream = new ByteArrayOutputStream();
			MatrixToImageWriter.writeToStream(bitMatrix, "png", byteArrayOutputStream);
			return byteArrayOutputStream.toByteArray();
		} catch (Exception e) {
			return null;
		}
	}

이상 정리해보았습니다. 

<img src="${pageContext.request.contextPath}/cp_a/get_barcode" alt="바코드">

 

블로그 이미지

은호아빠

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

,

SPRING MVC 세팅 설정 시작하기!

SPRING BOOT도 좋지만 저는 SPRING MVC로 프로젝트를 진행을 하는 편이에요.

환경설정 등을 기존에 해놓은 것을 그대로 사용할 수 있어 그런데요.

일단 STS를 실행하고 새로운 작업공간을 설정해요. 

새로운작업공간

전 DENTALAPP이라는 폴더를 작업공간으로 설정했어요. 

스프링 레거시 프로젝트

오른쪽 마우스를 누르고 New -> Spring Legacy Project를 선택해요.

패키지

그럼 새로운 작업 패키지명을 적는데요 저는 com에 제 이름의 약어인 sms와 2019를 붙이고 home이라고 적었어요. 

앱이름

프로젝트 이름을 dentalapp이라고 하였고요.  템플릿은 Spring MVC Project를 선택하였어요. 

컨트롤러

홈컨트롤러 파일과 홈 JSP파일이 생기는데요. 

JSP파일

JSP파일은 페이지를 UTP-8로 사용하겠다는 내용을 추가해줘요. 안 그러면 한글이 깨져서 나와요. 

그럼 프로젝트를 실행해볼까요?

저는 톰캣 8로 설정하고 돌렸어요. 

결과물

결과가 잘 나오고 있네요. 한글도 안 깨지고요. 

앞으로 쭉 프로젝트를 진행 볼게요. 모바일 웹앱을 만들 생각이고요. 안드로이드랑 아이폰으로 패키징을 할 계획이에요. 

여기까지 정리할게요. 

블로그 이미지

은호아빠

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

,