메뉴 건너뛰기

조회 수 6581 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄 첨부
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄 첨부

JSP 게시판 만들기 - 구현 (마무리, 테스트)

 

마무리

기본적인 자바스크립트 및 CSS, HTML 태그에 대해 다듬어 보자. 그리고 내용에 CKEditor를 입힌다. 

 

CSS

게시판의 Width를 맞추기 위함과 버튼 정렬, 열 항목 구분을 위해 간단한 CSS 구현하였다.

 

    <style type="text/css">

         * {font-size: 9pt;} /** HTML 전체 폰트를 9pt 로 고정 */

         p {width: 600px; text-align: right;} /** p 태그 width 와 우측 고정 (테이블 width 동일)  */

         table thead tr th {background-color: gray;} /** 열 항목 구분을 위한 회색 배경 */

        .btn_align {width: 600px; text-align: right;} /** 하단 버튼의 위치 우측 고정 */

    </style>

 

 

자바스크립트

아래와 같이 페이지 이동, 폼 체크, 메시지창 외에는 다른 스크립트는 없이 간단히 구현하였다.

 

    <script type="text/javascript">

        // 페이지 이동

        function goUrl(url) {

            location.href=url;

        }

        // 등록 폼 체크

        function boardWriteCheck() {

            var form = document.boardWriteForm;

            // 제목이 입력이 안되어 있다면

            if (form.subject.value == '') {

                alert('제목을 입력하세요.');

                // 제목 INPUT BOX 커서가 이동

                form.subject.focus();

                return false;

            }

            if (form.writer.value == '') {

                alert('작성자을 입력하세요');

                form.writer.focus();

                return false;

            }

            return true;

        }

        // 삭제 체크

        function deleteCheck(url) {

            // 예/아니오 창으로 메시지 창을 띄운다.

            if (confirm('정말 삭제하시겠어요?')) {

               location.href=url;

            }

        }

    </script>

 

 

HTML

 

     // 폼 데이터 전송시 onsubmit 을 이용해 폼 체크를 한다.

     <form onsubmit="return searchCheck();" ></form>

     // INPUT TYPE TEXT 태그들은 문자열 제한을 두어 데이터베이스 저장에 오류가 발생하지 않도

     // 록 한다. 데이터베이스 캐릭터셋이 UTF-8 이라면 한글 3Byte, 영/특/숫 1Byte Size 임.

     <input type="text" name="subject" size="80" maxlength="100" />

 

 

CKEditor 

CKEditor는 여기서 참고한다. (http://blog.naver.com/musasin84/60189890399)

 

      // CKEditor js를 상단에 선언 

     <script type="text/javascript" src="/ckeditor/ckeditor.js"></script>

      // Editor를 적용할 textarea 를 지정

     <textarea name="contents" cols="80" rows="10"></textarea>

     <script>CKEDITOR.replace('contents');</script>

 

 

 

테스트

하나의 시스템을 만들었을 때 테스트 과정은 반드시 필요하다. 이 테스트로 인해 수정/오류사항들을 찾아 대처해 나가야 하기 때문이다. 게시판 만들기의 테스트는 간단할 수 있으나 규모가 큰 시스템의 테스트는 테스트 하나 하나의 시나리오를 문서로 작성하여 검토가 될 만큼 보통 성가신 일이 아니다. 게임도 알바, 베타 테스트를 거쳐 오픈을 하듯이 웹 프로젝트 또한 마찬가지 인 것이다.

 

 테스트 항목

확인 

  1. 페이지 네비게이터 기능이 이상 없는 가?

  2. 검색 기능이 이상 없는 가?

  3. 검색 후 보기 or 수정 or 삭제 후 목록으로 돌아왔을 경우 

     검색 파라미터가 유지 되는 가?

  4. 기본적인 등록, 수정, 삭제 기능은 이상 없는 가? 

  5. 크로스 브라우징(브라우저 호환성)에 대한 이슈는 없는 가?

  6. SQL Injection 취약점은 문제가 없는 가?

  7. XSS 취약점은 문제가 없는 가?

SQL Injection 이란? 

XSS 취약점 이란?

 

다음은 소스와 몇가지 의견을 작성하는 마지막 글을 작성할 것이다.



List of Articles
번호 제목 날짜 조회 수
65 Oracle Database DB연결, table 생성 file 2017.09.11 4262
64 JSP 동작 원리, 내부 객체 file 2017.09.12 3579
63 스크립틀릿(Scriptlet), 선언(declaration), 표현식(expression) file 2017.09.12 3637
62 지시자(Directive) file 2017.09.12 3123
61 주석(comments) file 2017.09.12 3114
60 request, response file 2017.09.12 3220
59 JSP 게시판 만들기 - 구현 (이클립스 웹 프로젝트 생성) file 2017.09.12 4879
58 JSP 게시판 만들기 - 구현 (이클립스 웹 프로젝트 생성) file 2017.09.12 13393
57 JSP 게시판 만들기 - 개발표준, 화면설계 file 2017.09.12 6596
56 JSP 게시판 만들기 - 시스템 아키텍처 file 2017.09.12 4781
55 JSP (Java Server Page), Servlet에 대해 file 2017.09.12 6709
54 JSP 게시판 만들기 - 네이밍, 데이터베이스 설계 file 2017.09.12 4981
53 JSP 게시판 만들기 - 구현 (웹 프로젝트와 톰켓 연동, 샘플 페이지 작성) file 2017.09.12 5185
52 JSP 게시판 만들기 - 구현 (디렉토리, 파일, 테이블 생성) file 2017.09.12 7909
51 JSP 게시판 만들기 - 구현 (HTML 코딩) file 2017.09.12 17066
50 JSP 게시판 만들기 - 구현 (MySQL과의 연동) file 2017.09.12 37895
49 JSP 게시판 만들기 - 구현 (Method, Query 기초) file 2017.09.12 30633
48 JSP 게시판 만들기 - 구현 (파라미터, 요청/응답) file 2017.09.12 4798
» JSP 게시판 만들기 - 구현 (마무리, 테스트) file 2017.09.12 6581
46 JSP 게시판 만들기 - 완료 (소스파일, 의견) 2017.09.12 5510
Board Pagination Prev 1 2 3 4 Next
/ 4

하단 정보를 입력할 수 있습니다

© k2s0o1d4e0s2i1g5n. All Rights Reserved