본문 바로가기
IT/WEB

JSP 웹 프로그래밍 - 자바 웹 개발 환경 구축

by 심슨아빠똥 2023. 7. 2.
728x90

1. 자바 웹 개발 환경 구축

   1.1 자바 개발 도구, JDK

      https://adoptium.net/

 

Home | Adoptium

The Adoptium® Working Group The Adoptium Working Group promotes and supports high-quality runtimes and associated technology for use across the Java ecosystem. Our vision is to meet the needs of Eclipse and the broader Java community by providing runtimes

adoptium.net

 

  1.2 통합 개발 환경, 이클립스

      https://www.eclipse.org/

 

The Community for Open Innovation and Collaboration | The Eclipse Foundation

The Eclipse Foundation provides our global community of individuals and organizations with a mature, scalable, and business-friendly environment for open source …

www.eclipse.org

 

      - [eclipseinstaller] 창에서 ' Eclipsee IDE for Enterpris Java Developers' 선택

 

      1.2.1 이클립스 환경 설정하기

        - 텍스트 인코딩 설정

          설정 화면 들어가기 [Window] - [Preferences] 

          [General] -  [Content Types] - [Text] 선택, [Default encoding] 에서 'utf-8' 입력 후 <Update>

       - HTML, CSS, JSP 캐릭터 인코딩 설정

         [Web] - [HTML Files] 선택, 'ISO 10646/Unicode(UTF-8)'로 변경

       - 웹 브라우저 설정

         [General - [Web Browser] 에 들어가 Chrome 체크

      - 톰캣 경로 설정

      - JSP 파일 만들기 및 JSP 실행

 

  1.3 서블릿 컨테이너, 아파치 톰캣

      https://tomcat.apache.org/

 

Apache Tomcat® - Welcome!

The Apache Tomcat® software is an open source implementation of the Jakarta Servlet, Jakarta Server Pages, Jakarta Expression Language, Jakarta WebSocket, Jakarta Annotations and Jakarta Authentication specifications. These specifications are part of the

tomcat.apache.org

 

2. 이클립스와 톰캣 연결이 안될 때

  2.1 서버 연결 오류 참고 블로그

      - https://all-record.tistory.com/49

 

이클립스(Eclipse) 톰캣(Tomcat) 연동하기

톰캣을 설치했다면 이클립스와 연동을 해야 웹개발 환경이 만들어진다. 이클립스와 톰캣 연동하기 이클립스를 실행시켜 보면 상단에 Window 라는 메뉴가 있다. 여기에 있는 Preferences를 클릭한다.

all-record.tistory.com

      - 해결

예제 파일 실행

 

3. 부트스트랩

  3.1 사용 방법

    3.1.1전체 소스코드를 내려 받아 원하는 부분 수정

    3.1.2 단순히 CSS 링크만 이용해 기본 설정 형대로 바로 사용하는 방법

      - 부트스트랩 홈페이지에 들어가서 원하는 모양의 샘플 사용

      https://getbootstrap.kr/docs/5.2/components/accordion/

 

아코디언

Collapse(콜랩스) JavaScript 플러그인과 조합하여, 수직으로 접는 아코디언을 만듭니다.

getbootstrap.kr

      - 속성 중첩 사용 가능

 

728x90

댓글