Lab1

Lab1
HTML, CSS, JS를 사용하여 2개 이상의 식품(Food)에 대한 영양성분(Nutrition Facts)를 본인의 스타일로 완성하라. (색깔별로 단백질 지방 탄수화물, 비타민, 무기질 등 분류, 마우스 클릭시 웹사이트 연결 등등)
그 실행결과 화면을 캡쳐하여 보고서에 첨부한다.
프로젝트 파일 전체와 보고서를 함께 넣고 Lab1_학번_이름.zip만들어서 e-learning에 과제 제출한다.

aj21-lab1

Lab0

JDK + Tomcat WAS + Eclipse IDE + HelloJSP + Deploy

1.자바 OpenJDK(Java Development Kit) 15.0.2 다운로드 설치
https://jdk.java.net/15/

1) 환경변수 설정 JAVA_HOME 추가
컴퓨터 – 오른쪽 버튼 – 속성 – 고급시스템 설정 – 환경변수
시스템변수 – 새로 만들기
변수이름 : JAVA_HOME
변수값 : C:\Program Files\Java\jdk-15.0.2 (JDK설치폴더명)
2) 환경변수 설정 PATH 설정
시스템변수 – Path 변수값 수정
세미콜론(;) 추가 후 %JAVA_HOME%\bin 추가
3) 설치된 자바 버전 확인
cmd 창 열고, 설치된 자바 버전 확인 java -version

2. Tomcat 9.0.43 다운로드 설치
https://tomcat.apache.org/download-90.cgi

1) 포트 설정
Server Shutdown Port 8005
HTTP/1.1 Connector Port 8085
AJP/1.3 Connector Port 8009
2) 환경변수 설정 CATALINA_HOME 추가
C:\Program Files\Apache Software Foundation\Tomcat 9.0
3) 웹브라우저를 열고, 설치된 톰캣 실행 확인 localhost:8085

3.Eclipse 다운로드 설치
https://www.eclipse.org/downloads/

인스톨러에서 Eclipse IDE for Enterprise Java Developers 선택해서 설치
1) 최초 실행시 workspace 경로 설정 (C:\Users\park\eclipse-workspace\aj21)
2) 이클립스에서 서버 실행환경 설정
Windows – Preferences – Server – Runtime Environments – Add 버튼 – Apache Tomcat v9.0 선택

4.Hello JSP 작성
1) 이클립스 File – New – Dynamic Web Project – Next 버튼 – Target runtime: Apache Tomcat v9.0 & Dynamic web module version: 4.0 & Configuration: Default Configuration for Apache Tomcat v9.0 & Finish 버튼 – Open the Java EE perspective? No – HelloJSP 프로젝트 생성
2) 프로젝트의 WebContent 폴더 우클릭 – File – New – JSP File – hello.jsp 생성 후 html body 안에 Hello 작성
3) hello.jsp 우클릭 – Run as – Run on Server

5.Hello.war 배포
1)프로젝트 war파일 생성
이클립스 프로젝트 우클릭 -> Export – Web – WAR file 선택 -> Next 버튼 클릭
Destination에 war 파일 생성될 위치 지정하고, Finish 버튼 클릭
2)Tomcat 폴더/webapps 폴더에 생성된 war 파일 이동
3)Tomcat 실행후
http://localhost:8085/HelloJSP/hello.jsp

Tutorial

JSP Tutorial
https://www.tutorialspoint.com/jsp/

Learn JSP Tutorial
https://www.javatpoint.com/jsp-tutorial

CodesJava JSP Tutorial
https://codesjava.com/jsp-overview

JSP Tutorial for beginners
http://www.mkyongtutorial.com/jsp-tutorial-beginners/

W3schools.com HTML Tutorial
https://www.w3schools.com/html/default.asp

W3schools.com CSS Tutorial
https://www.w3schools.com/css/default.asp

W3schools.com JS Tutorial
https://www.w3schools.com/js/default.asp

생활코딩 동영상 HTML Tutorial
https://opentutorials.org/course/2039

생활코딩 동영상 CSS Tutorial
https://opentutorials.org/course/2418

생활코딩 동영상 JS Tutorial
https://opentutorials.org/module/532

생활코딩 동영상 Node.js Tutorial
https://opentutorials.org/course/3332

Node.js Tutorial
https://www.tutorialspoint.com/nodejs/