본문 바로가기

웹_프론트_백엔드/JAVA프레임윅기반_풀스택

(82)
2020.06.17 [AJAX와 JSON을 이용하여 다단계 Category 구현] 1. 서버단 1) common > D.java package common; /* * DB 접속 정보, 쿼리문, 테이블명, 컬럼명 등은 * 별도로 관리하든지 * XML, 초기화 파라미터 등에서 관리하는 것이 좋다. */ public class D { public static final String DRIVER = "oracle.jdbc.driver.OracleDriver"; // JDBC 드라이버 클래스 public static final String URL = "jdbc:oracle:thin:@localhost:1521:XE"; // DB 접속 URL public static final String USERID = "scott0316"; //..
2020.06.16 [AJAX + SPA게시판 클라이언트단 글 읽기, 글 수정 추가, 글 작성, 글 삭제 수정] 1. index.html 게시판 - SPA # UID 제목 작성자 조회수 작성일 글삭제 글작성 새글 작성 × 글제목 작성자 내용 작성 삭제 수정 수정완료 2. board.js var page = 1 // 현재 페이지 var pageRows = 10 // 한 페이지에 보여지는 게시글 개수 $(document).ready(function(){ // 게시판 목록 1페이지 로딩 loadPage(page); // 글작성 버튼 누르면 팝업 $("#btnWrite").click(function() { setPopup("write"); $("#dlg_write").show(); }); // 모달 대화상자에서 close 버튼 누..
JSP Team Project(2020.05.25 ~ 2020.06.15) 1. 팀 프로젝트 일정 2. 반드시 기획에 반영해야할 필수 사항 1) 클라이언트, 웹서버 간의 주고 받는 웹 어플리케이션 형태 2) 관계형 데이터 베이스 사용 3) CRUD 사이클이 구현되게 하기 4) JSP, MVC model2로 구현하기 5) 회원/비회원 운영시스템(로그인, 회원가입 등 구현) 6) JSTL, EL 적극 활용 7) 파일 업로딩 및 파일 다루기 8) jQuery 사용 9) AJAX 구현 10) JSON, XML 데이터 주고 받기. 11) 다양한 API 사용 3. 선택 사항 1) 관리자 페이지 구현 2) 안드로이드 앱 - 서버 연동 3) 반응형 웹 4. 작성한 문서 1) 요구사항 정의서 2) 페이지구성도, 화면흐름도 3) ERD 4) 스토리보드 5) 발표 PPT 5. 프로젝트 깃허브 주소..
2020.06.10 [AJAX + SPA게시판 클라이언트단 글 작성, 삭제 구현] 1. index.jsp 게시판 - SPA # UID 제목 작성자 조회수 작성일 글삭제 글작성 새글 작성 × 글제목 작성자 내용 작성 2. board.js var page = 1 // 현재 페이지 var pageRows = 10 // 한 페이지에 보여지는 게시글 개수 $(document).ready(function(){ // 게시판 목록 1페이지 로딩 loadPage(page); // 글작성 버튼 누르면 팝업 $("#btnWrite").click(function() { $("#dlg_write").show(); }); // 모달 대화상자에서 close 버튼 누르면 닫기 $(".modal .close").click(function(){ $(thi..
2020.06.09 [AJAX + SPA게시판 클라이언트단 만들기] 1. 기본 페이지 ** index.html 게시판 - SPA # UID 제목 작성자 조회수 작성일 2. 스타일링 ** CSS > common.css @charset "UTF-8"; #list table {width: 100%;} #list table, #list th, #list td { border: 1px solid black; border-collapse: collapse; } .clear { clear: both; } .center { text-align: center; } ul.pagination{ list-style-type:none } ul.pagination li{ display: inline-block; } ul.pagination a { ..
2020.06.08 [AJAX + SPA게시판(API 인터페이스 구축) -> 글쓰기, 수정하기, 삭제하기] 1. write.ajax ** com.command.write > AjaxResultCommand.java package com.command.write; import java.io.IOException; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import com.fasterxml.jackson.core.JsonProcessingException; import com.fasterxml.jackson.databind.ObjectMapper; import com.lec.beans.AjaxWrite..
2020.06.05 [AJAX + SPA게시판(API 인터페이스 구축)] 1. SPA(Single Page Application) : 서버로부터 완전한 새로운 페이지를 불러오지 않고 현재의 페이지를 동적으로 다시 작성함으로써 사용자와 소통하는 웹어플리케이션이나 웹사이트 사용자 경험의 간섭을 막아주고, 마치 데스크탑 어플리케이션 처럼 동작하도록 한다. 즉, 페이지 리로딩이 없다는 의미 ex) 구글 문서작업 2. 서버 - 클라이언트 간 API(Application Programming Interface) 인터페이스 설계 1) 어떠한 ‘기능’들이 필요할것인가 요구사항 분석. 2) 각 ‘기능’ 을 요청(request) 기획 ** request URL 포맷 ** request parameter (요청인자) 3) 요청 받은 URL에 ..
2020.06.03 [어제 배우던 게시글 그대로 삭제와 수정 기능 추가] 1. 삭제 : 글 수정을 구현하기 앞서 글 삭제부터 만들어 두면 좋다. ** 글 삭제시 삭제해야할 두 가지 1) 물리적으로 저장된 파일 2) DB 에 저장된 첨부파일 정보 : 이는 DDL에서 ON DELETE CASCADE로 설정하여 처리됨 ** common > D.java package com.lec.beans; import java.io.File; import java.sql.Connection; import java.sql.DriverManager; import java.sql.PreparedStatement; import java.sql.ResultSet; import java.sql.SQLException; import java.sql.Sta..
2020.06.02 [게시판 첨부파일(write, view)] 1. 시나리오 1) 게시글마다 임의개수의 첨부파일 추가 가능 2) 업로드 경로는 Context Path / upload 3) 업로드시 파일이름 기억(저장) 4) 첨부파일 다운로드 가능 다운로드시 업로드된 파일이름으로 다운받게 하기 5) 글 수정에서 첨부파일 삭제 가능 6) 글 수정에서 첨부파일 새로 추가 가능 7) 글 삭제시 첨부파일도 경로에서 물리적인 삭제 8) 첨부파일 이 이미지인 경우 게시물 화면에 보이기 2. 첨부파일 DDL 작성 ** test_write_orcle.erm ** test_write_orcle2.sql /* Drop Tables */ DROP TABLE test_file CASCADE CONSTRAINTS; DROP TABLE test_wr..
2020.06.01 [CKEditor 웹에디터 사용하기] 1. HTML + CSS + JavaScript로 만들어진 웹에디터 : 글 내용을 다양한 인터페이스와 함게 손쉽게 편집 가능 2. CKEditor : WYSIWIG 웹 에디터 중 하나, 세계적으로 가장 널리 쓰임 3. CKEditor Quick Start Guide(기본설치 가이드) : ckeditor.com/docs/ckeditor4/latest/guide/dev_installation.html 4. 기존의 JSP15_JDBC 게시판 + CKEditor + 이미지파일 업로드(cos 라이브러리 사용) 1) 기존의 JSP15_JDBC 게시판 복사 2) CKEditor 다운로드 : https://ckeditor.com/ckeditor-4/download/ > Downlo..