//Google AdSense

 

method 호출 원리는 변함이 없다 | Return data type 과 method 호출은 관련이 없다!

1 - ① - ⑶ 하나의 패키지 내 하나의 클래스에서 리턴 있고 입력 없는 메서드 선언 및 호출 

 

<<실행순서 서술하기>>



① a 메서드 호출
② a 메서드 실행
  "01 a 메서드 실행" 문자열을 콘솔창에 실행
③ return 값 "1루타" 를 메서드 호출한 곳으로 리턴
④ String data type으로 result 변수 선언 "1루타" 문자열을 result 변수에 대입
⑤ result 변수에 담겨있는 "1루타" 문자열을 포함하여 콘솔창에 출력

리턴값은 하나인데 조건에 따라서 리턴값이 바뀔 수 있다.

현재는 리턴값 하나가 리턴된다.
여러개 리턴은 나중에 가능할 것!

1 - ① - ⑷ 하나의 패키지 내 하나의 클래스에서 리턴 있고 입력 있는 메서드 선언 및 호출 





<<실습>>

<기능정리>

 


package Dog.and.Cat;

public class Login {

	public static void main(String[] args) {
		
		int result = uInsert ("id002", "pw002");
		int result2 = logre (result, "윤깨물", "고슴도치");
		typsort(result2, 21);
		agegroup (result);
		
		
			
	}
	
	public static void agegroup (int log) {
		if (log == 11) {
			System.out.println("성장기");
		} else if (log == 12) {
			System.out.println("성견");
		} else if (log == 13) {
			System.out.println("중장년견");
		} else if (log == 14) {
			System.out.println("노령견");
		} else if (log == 21) {
			System.out.println("성장기");
		} else if (log == 22) {
			System.out.println("성묘");
		} else if (log == 23) {
			System.out.println("노령묘");
		} else if (log == 24) {
			System.out.println("초노령묘");
		} 
	}
	
	
	public static int typsort(int log, int aage) {

		
		if(log == 1) { 
			System.out.println("강아지 나이 : "+aage+" 살");

				if(aage <= 1) {
					log = 11;
				} else if(aage >= 2 & aage <= 4) {
					log = 12;
				} else if(aage >= 5 & aage <= 10) {
					log = 13;
				} else if (aage >= 11) {
					log = 14;
				}

		} else if(log == 2) {
			System.out.println("고양이 나이 : "+aage+" 살");
			
				if(aage <= 1) {
					log = 21;
				} else if(aage >= 2 & aage <= 4) {
					log = 22;
				} else if(aage >= 5 & aage <= 10) {
					log = 23;
				} else if (aage >= 11) {
					log = 24;
				}
		} else if (log == 3) {
			System.out.println("기타 동물 등록은 고객 센터에 문의 바랍니다.");

		}
		
		
		return log;
	}

		
	public static int logre (int log, String aname, String atype) {

			
		
			if(log == 1) { 
			System.out.println( "로그인 성공! 환영합니다.");
			System.out.println( atype+" "+aname+" 의 집사님");
				
				if(atype.equals("강아지")) {
					log = 1;
				} else if (atype.equals("고양이")) {
					log = 2;
				} else {
					log = 3;
				}
				
			} else if(log == 2) {
				System.out.println("PW를 확인하세요.");

			} else if(log == 3) {
				System.out.println("등록되지 않은 ID 입니다.");
			}
			
	
			return log;
	}
	
	public static int uInsert (String id, String pw) {
		System.out.println("ID : " +id);
		System.out.println("PW : " +pw);
		
		
		
		String dbid = "id002";
		String dbpw = "pw002";
		
		int log = 0;
		
		if(id.equals(dbid)) {
			if(pw.equals(dbpw)) {
				log = 1;
			}
			else {
				log = 2;
			}
		}else {
			log = 3;
		}
	
		return log;
	}

}

<실행 순서에 따른 해설>


① uInsert 메서드를 호출, 실행

ID : 입력된 id
PW : 입력된 pw 문자열을 콘솔창에 출력한다.

int log는 초기값이 0이다.

입력된id와 dbid가 같고 입력된 pw와 dbpw가 같을경우 log변수에 담긴 값 1
입력된 id와 dbid가 같고 입력된 pw와 dbpw가 다를경우 log변수에 담긴 값 2
입력된 id와 dbid가 다를경우 log 변수에 담긴 값 3  


입력된 id와 dbid가 같고 입력된 pw와 dbpw가 같으므로 log 변수에 담긴 값은 1



② return 값 log 변수에 담겨있는 값 1을 메서드를 호출한 곳으로 리턴



③ int data type 으로 result 변수를 선언하고 정수 1을 result 변수에 대입



④ logre 메서드를 호출, 실행

result 변수에 담겨있는 값은 정수 1 > log 변수에 입력.

log 변수에 담긴 값이 1이라면 " 로그인 성공! 환영합니다. 입력된 atype, aname의 집사님" 문자열을 출력하고
atype이 강아지 문자열일 경우 log 변수에 담긴 값 1
고양이 문자열일 경우 log 변수에 담긴 값 2
강아지 또는 고양이 문자열이 아닐 경우 log 변수에 담긴 값 3

log 변수에 담긴 값이 2라면 "PW를 확인하세요." 문자열 출력
log 변수에 담긴 값이 3이라면 "등록되지 않은 ID 입니다." 문자열 출력


log 변수에 입력된 값이 1이고 atype에 입력된 값이 고슴도치 문자열이기 때문에 log 변수에 담겨있는 값은 정수 3



⑤ return 값 log 변수에 담겨있는 값 3을  메서드를 호출한 곳으로 리턴
  int data type으로 result2를 선언하고 정수 3을 result2 변수에 대입한다.

⑥ typsort 메소드를 호출, 실행

result2 변수에 담겨있는 값은 정수 3 > log 변수에 입력.

log 변수에 담긴 값이 1이라면
강아지 나이 : aage 살 문자열 출력.
입력받은 aage의 나이가 1보다 작거나 같으면 log 변수에 담긴 값 11
2보다 크거나 같고 4보다 작거나 같으면 log 변수에 담긴 값 12
5보다 크거나  같고 10보다 작거나 같으면 log 변수에 담긴 값 13
그 외는 log 변수에 담긴 값 14


log 변수에 담긴 값이 2라면
고양이 나이 : aage 살 문자열 출력.
입력받은 aage의 나이가 1보다 작거나 같으면 log 변수에 담긴 값 21
2보다 크거나 같고 4보다 작거나 같으면 log 변수에 담긴 값 22
5보다 크거나  같고 10보다 작거나 같으면 log 변수에 담긴 값 23
그 외는 log 변수에 담긴 값 24


log 변수에 담긴 값이 3이라면 
기타 동물 등록은 고객 센터에 문의 바랍니다. 문자열 출력



log 변수에 담긴 값이 3이기 때문에 기타 동물 등록은 고객 센터에 문의 바랍니다. 문자열을 출력한다.


리턴할 log 변수에 담긴 값이 없으므로 0이 된다.



⑦ return 값 log 변수에 담긴 값 0을 메서드를 호출한 곳으로 리턴


⑧ agegroup 메서드를 호출, 실행

log 변수에 담긴 값이 11 이라면 성장기 문자열
     12 라면 성견 문자열
     13 이라면 중장년견 문자열
     14 라면 노령견 문자열
     21 이라면 성장기 문자열
     22 라면 성묘 문자열
     23 이라면 노령묘 문자열
     24 라면 초노령묘 문자열을 출력한다.

log 변수에 담긴 값이 0이므로 아무것도 출력되지 않는다.

<실행 결과> 


출력오류?!

package Dog.and.Cat;

public class Login {

	public static void main(String[] args) {
		
		int result = uInsert ("id002", "pw002");
		logre (result, "윤깨물", "고슴도치");
		typsort(result, 21);
		agegroup (result);
		
		
			
	}
	
	public static void agegroup (int log) {..
	
	public static int typsort(int log, int aage) {..
		
	public static int logre (int log, String aname, String atype) {..
	
	public static int uInsert (String id, String pw) {..
	
}

오류내용

문법상의 오류는 없었지만 의도와 다른 내용이 출력되었다.

고슴도치이기 때문에 이 내용이 출력되어야 한다.

 


 

오류 수정

메서드 호출부분에서 result 값을 계속 같은 result 값으로 받았기 때문에 발생한 오류였다!
새로운 변수 result2를 int data type 으로 지정해주고 result2 다음 메서드에서 새로운 result2의 값을 받았더니 원하는 내용이 출력되었다.

 

1. primitive data type (8가지)

 

<정수형>

비객체 타입. null 값을 가질 수 없다. 

type length range 
byte 8bit -128 ~127 
short 16bit -32768~32767 
int 32bit -2147483648~21483647
long 64bit -9223372036854775808~922337203685477580 

 

 

<실수형>

소수점값을 나타내기 위함 

type length range 
float 32bit  1.40239846e-45f ~3.40282347e+38f  
double 64bit 4.94065645841246544e-324~1.79769313486231570e+308 

 

 

<문자형>

혼합되지 않은 하나의 문자만 사용 (문자열과 혼동 주의) 

type example
char  ex) char a ='문'; 



2. reference data type

 - 객체를 참조하는 형태
 type
- String class : 참조형에 속하지만 기본형처럼 사용. 불변객체.
  기본형 비교는 == / String 객체간 비교는 .equals() 메소드 사용
- Wrapper class : 기본형을 클래스로 감싼 형태 
  기본형에 null을 넣고싶다면 래퍼클래스를 활용.
ex
기본형 대응 래퍼 클래스
byte Byte
short Short
int Int
long Long
float Float
double Double
char Char
boolean Boolean
* 참고 : void 의 래퍼 클래스 Void 도 존재

 


* 인터페이스 

interface MyInterface { 
    void add(T value); 
} 

인터페이스를 만드는 것은 새로운 참조 자료형을 만드는 것과 같다.
자료형이기 때문에 자신을 구현한 객체의 주소를 가질 수 있다.
(인터페이스에 정의된 메소드만 사용 가능)



* 배열형 

public class ArrayType { 
    public static void main(String[] args) { 
        int [] i = new int[2]; 
        Long [] l = new Long[2]; 
        Object[][] o = null; 
    } 
} 

기본형으로도 만들 수 있고 참조형으로도 만들 수 있다. 

자료형에 대해 []를 선언함으로 배열을 지정.
(배열형 변수 또안 배열의 주소를 가지고 있기 때문에 클래스형의 특징과 일치)
같은 객체의 주소를 바라보게 만들면 동일한 배열을 가리킨다.

'REPORT' 카테고리의 다른 글

URL URI  (0) 2020.05.14
깨물이  (0) 2020.02.26
절대경로와 상대경로  (0) 2020.02.24

1.절대경로

원하는 경로를 Root 디렉터리부터 모두 적은 것
어떠한 웹페이지나 파일이 가지고 있는 고유한 경로


ex)
http://www.naver.com
C:\users\document\untitled.jpg


2. 상대경로

 현재 위치한 곳을 기준으로 한 그곳의 위치

  ex)
C:\users\document를 기준으로
C:\users\document\ex\untitled.jpg > \ex\untitled.jpg
C:\users\document > ./
C:\users > ../


'REPORT' 카테고리의 다른 글

URL URI  (0) 2020.05.14
깨물이  (0) 2020.02.26
JAVA data type (primitive & reference)  (0) 2020.02.24
준비된 동작이 호출시에 동작한다.

1. 자바 기초 문법

 * 메서드를 선언하고 호출 할 수 있다.
  - 12가지 경우의 수
   ① 하나의 패키지하나의 클래스에서 메서드 선언 및 호출 (4가지)
     (1) 리턴X 입력X & 리턴X 입력O
     (2) 리턴O 입력X & 리턴O 입력O
   ② 하나의 패키지서로다른 클래스에서 메서드 선언 및 호출 (4가지)
     (1) 리턴X 입력X & 리턴X 입력O
     (2) 리턴O 입력X & 리턴O 입력O
   ③ 서로다른 패키지 내 서로다른 클래스에서 메서드 선언 및 호출 (4가지)
     (1) 리턴X 입력X & 리턴X 입력O
     (2) 리턴O 입력X & 리턴O 입력O

 문법은 끝이 있지만 응용은 끝이 없다.

 

 

 

* java 파일 생성

 

 - Web Content가 아닌 Java Resources > src에서 작업
 - 한국스마트정보교육원 : ksmart.or.kr (패키지 명은 보통 도메인을 뒤집어 쓴다.)
 - package : kr.or.ksmart.A

  · src>kr>or>ksmart>A 경로의 폴더가 생긴 모습
 - class : AA01
 - class : AA02
 - class : AA03
 - class : AA04

· class 생성시 public static void main(Sting[] args) 체크


· AA01.java 가 생성된 모습

· AA01.java 파일의 내용





1 - ① - ⑴ 하나의 패키지 내 하나의 클래스에서 리턴 없고 입력 없는 메서드 선언 및 호출 

 - 중괄호를 잘 열고 닫자! (block 개념)


선언한 메서드를 호출한 모습!

1 - ① - ⑵ 하나의 패키지 내 하나의 클래스에서 리턴 없고 입력 있는 메서드 선언 및 호출 

 - (int age) : age 변수에는 정수값만 입력되어야 한다.
 - a(10); : a(int age) = 10
  * int data type으로 age 변수를 선언하고 10 값을 age 변수에 대입(입력)

a메서드 호출 시 10 정수값을 age 매개변수에 입력 후 대입하여 메서드가 실행된다. (콘솔창에 출력)



<<실행순서 서술하기>>



예제 1)

  >> b 메서드 호출시 홍길동 문자열을 name 매개변수에 입력 후 메서드 실행


예제2)

  >> c 메서드 호출시 남 문자를 gender 매개변수에 입력 후 메서드 실행


예제 3)

*********메서드 선언*********
 1) 접근지시(지정)자 (Access Modifier)
 
  - public 
   [ public (모든곳) / protected (같은 패키지) / private (같은 클래스) ]

 2) 정적키워드 : static 

 3) return data type  
  - void (리턴x) 

 4) method name : uInsert 
  
 5) 매개변수 data type / name 
  - 첫번째 매개변수 data type: String 
     *첫번째 매개변수 name : name 
  - 두번째 매개변수 data type: int 
     *두번째 매개변수 name : age 
  - 세번째 매개변수 data type: char
    *세번째 매개변수 name : gender 
                      로 메서드가 선언 되었다.
  
*********메서드 호출 원리 (가장 중요!)*********
 1) 메서드name 일치
 2) 매개변수 개수와 입력 개수 일치 
 3) 매개변수 data type에 일치하는 값이 각각의 매개변수에 입력되어야 메서드가 호출

* 조건의 false/true를 확인하는 방법 



method body 내에 조건식만 출력해보기

<<조건식>>

예제1-1) int/ if, else if

예제 1-2) int/if, else

 


예제 3) String/ if 안의 if, else


예제4) char/ if, else if, else

 

*Method Overloading

하나의 클래스에서 동일한 이름의 메서드를 입력받는 데이터의 개수와 data type을 다르게 프로그래밍 할 수 있는 방법.

<<실습>>

 1. 하나의 메서드 기능 정리

2. JAVA 코드 작성

3. 결과

                       

HTML 작성 전 기본 설정 변경

- eclipse 편집기

- file > switch workspace 새 workspace

 

(다시보기)개발환경 세팅 및 workspace 설정☞

 

- 서버 추가 

 

 >1

 

 

 

 

or

 

>2

window > preferences >server > runtime environments > add

 

 

 

- 설정 변경

window > preferences > en 검색

workspace , css files, html file, jsp files의 EUC-KR을 UTF-8

 

 

- jsp 검색 > jsp files > editor > templates> New jsp file (html) >edit

 

내용을 수정해준다.


 

기본 설정이 모두 변경되었다.


* 새로고침만으로 페이지 갱신하기 (without run)

servers overview에서 server options의 serve modules without publishing을 체크해준다.

 


html vs. jsp

 

jsp에 하이라이트한 구문이 없다면 html밖에 안된다.


html debuging

 

debuging은 브라우저의 개발자 모드를 이용하는 것이 편리하다.

 

 


html 태그

 ※ html 필수 기본
  - 들여쓰기
  - 열고 닫기 
  - 주석  <!-- 타이핑하면 <!-- 주석 --> 자동완성!
  - 자식태그는 부모태그의 영향을 받는다.

 

↖서술한 태그와 출력된 모습↗ 

 

 

 


HTML 태그 종류

- 텍스트를 표현하는 태그

 

 

- 표를 구성하는 태그

 

 

표의 형태가 나타난 모습

 

 

- 속성 attribute

 

 

 

 

 

※ 요소, 속성, 객체?

요소 : 선택된 대상의 자식 전체 (태그 + 텍스트 포함) 
속성 : 선택된 태그의 세부 옵션 (데이터) 
객체 : 대상

 

 - table의 속성 > style~

 - thead의 속성 > align~

 - th의 속성 > width~

 

 


표의 여백 제거하기


CSS

 


실습해보기

 

 

1. 표 내용을 서술한다.

 


 

2. style type을 css로 적용하고 class마다 조건에 맞는 속성을 서술한다.

 

3. 조건별로 class를 지정한다.

 

 


조건에 맞게 완성된 표

 

4. 다른 방법

>> 두가지 class를 한 번에 적용할 수 있음

'UI/UX엔지니어링 > HTML' 카테고리의 다른 글

웹서버 세팅하기  (0) 2020.02.20

웹서비스

프로그램에서의 클라이언트 > 브라우저 (IE, Chrome, Safari ...) 

● 프로토콜 (통신규약) 
복수의 컴퓨터 사이나 중앙 컴퓨터와 단말기 사이에서 데이터 통신을 원활하게 하기 위해 필요한 통신 규약

 

 - 프로토콜 종류

  1) HTTP: Hyper Text Transfer Protocol

  2) HTTPS: Hyper Text Transfer Protocol Secure

   웹 서버와 웹 브라우저가 HTTP 규약을 따름.( ie, 사파리, 크롬 등)

  3) FTP: File Transfer Protocol

  4) Telnet: Terminal Network

  5) POP3: Post Office Protocol Version 3

  등등

 

 

 

http, https를 통해 아이피에 할당된 하드웨어를 호출, 웹 프로그램(web server)에 접근 

프로토콜//아이피:포트 

 

●http://localhost:8080/index.jsp 


- localhost = 127.0.0.1 
- :8080 > 포트=길 
  
 포트가 적혀있지 않은 경우

    http 기본 80번 포트 http://www.naver.com:80 
    https 기본 443번 포트 (보안화) https://www.naver.com:443 
  

- 포트 범위 : 0~65535

- 예약 포트 범위 : 0~1023 까지 (이 포트로는 설정하면 안된다.)

 

●Web Server -apache 
html 문서만 반응

 Web Container -tomcat (→WAS : web application server★)
웹 서버에서 읽지 못한 내용을 html로 변환하여 웹서버로 전달

 

(다시보기)개발환경 세팅, 웹서버 실행하기☞


html5는 <!DOCTYPE html> 뒤 내용 생략 가능

 

 

● html 기본 문법과 속성을 알기

● class : 그룹화

  id : 유일화

 

● 자바스크립트(JavaScript)

  동적으로 이벤트를 발생시키는 언어 (화면)


HTML(Hyper Text Markup Language)

 

HTML은 마크업 언어로서 웹 페이지를 표현하는 언어이다.

 

HTML 태그의 이해

① HTML의 모든 태그는 시작과 끝 태그로 이루어진다.
② HTML 태그에는 속성을 지정할 수 있다.
③ 웹 브라우저에 보여지는 내용들을 표현한다.

 

HTML의 레이아웃 관련 태그

실무에서 div, header, navigation, footer를 많이 사용한다.

 


CSS(Cascading Style Sheets)

웹 페이지 전체의 일관성을 유지할 수 있도록 스타일을 미리 저장해 둔 시트

 

CSS 문법

- 선택자(Selector)는 스타일을 적용하기 위한 대상

  (HTML 요소를 사용할 수도 있고 ID나 Class 형태로 정의할 수도 있다)
- 스타일은 다양한 형태로 지정할 수 있으며 ‘속성 : 값’ 형태로 지정

 

CSS 선택자

- 공용 선택자(Universal Selector. 일반 선택자)
HTML 요소를 선택자로 하여 스타일을 적용할 수 있으며, 이 경우 해당 HTML 요소
모두에 스타일이 적용된다.

 

- 태그 선택자(Type Selector)
지정한 태그에 대하여 스타일이 적용된다.

 

- 클래스 선택자(Class Selector) - 그룹화
클래스 선택자를 활용하면 특정 HTML 요소들을 그룹화하여 스타일을 지정하는 것이
가능하다.

 

-아이디 선택자(ID Selector) -유일화
특정 ID를 부여하여 ID에 스타일을 지정할 수 있다.

 


메모장으로 간단한 웹 페이지를 작성하고 실행하기

 

 

절대경로에서 호출한 상황

 

 

 

tomcat을 통해 호출

 

 

tomcat의 \webapps\ROOT 경로에 test.html 파일을 넣는다.

 

tomcat이 실행되지 않는다.

 

톰캣 구동시에 필요한 java path가 설정되어있지 않기 때문이다.

 


* java path 설정

 

내 컴퓨터>속성>고급시스템속성>환경변수>시스템변수

자바 PATH 시스템 변수를 추가한다.

 

내 컴퓨터>속성>고급시스템속성>환경변수>시스템변수>path>편집

 

변수로 추가했던 JAVA_HOME의 bin 폴더를 변수값으로 추가한다.

;%JAVA_HOME%\bin;

 


 

다시 tomcat을 startup한다.

tomcat이 실행되는 모습

 

페이지가 호출되는 모습

 

'UI/UX엔지니어링 > HTML' 카테고리의 다른 글

eclipse HTML 작업환경 설정 & HTML 태그 종류  (0) 2020.02.20

가입후리스트에서 수정화면까지

수정 버튼을 어디에 만들지 결정

 >user_list.jsp 에는 수정버튼의 위치만 

 >user_list_insert.jsp에 작동하는 수정버튼을 생성할 계획이다.

 

수정버튼을 클릭하면 user_update_form.jsp 화면으로 이동하도록 설정

 

구성이 비슷한 user_insert_form.jsp를 참고하여 만들 수 있다.

 

* (아직 배우지 않음) 화면 이동 사이에 데이터를 주고 받을 수 없는 상황

* 수정화면에 값을 보여주기

* ID 수정을 불가능하게 설정

 

 


 

user_list.jsp에 수정, 수정버튼에 대한 내용을 추가한다.

 

 

user_list_insert.jsp에 수정, 수정버튼에 대한 내용을 추가하고 2번 회원의 수정버튼만 작동하도록 경로를 설정한다.

run

 

버튼이 잘 보이는 것을 확인할 수 있다.

1번 회원의 버튼은 작동하지 않고 2번 회원의 버튼은 작동한다.

user_update_form.jsp 파일이 없기 때문에 404 error가 뜨게 된다.

 

* 404 error :파일이 없어가 경로설정이 잘못되었을 경우

 

 

user_update_form.jsp 파일을 생성한다. 

 

 

run

 

 

경로가 제대로 설정되었지만 파일 내용이 없어 빈 화면이 출력된다.

 

 

 

user_update_form.jsp의 내용을 수정, 작성한다.

 

 

run

 

내용이 잘 수정된 모습

 

 

* 수정화면에 값을 보여주기

 > value 값을 지정해준다.

run

 

수정화면에서 값이 보이게 되었다.

 

 

* ID 수정을 불가능하게 설정하기

 > 속성을 읽기전용(readonly)으로 추가


수정화면에서 수정처리후리스트까지

 - user_update_form.jsp 수정화면에서 수정을 완료하면

   user_list_update.jsp 수정처리 후 리스트가 출력되도록 설정

 

user_update_form.jsp의 action 경로를 user_list_update.jsp로 변경한다.

 

user_list_update.jsp 파일이 없기 때문에 run 하면 404error가 발생할 것이다.

 

user_list_update.jsp 파일을 생성한 뒤 내용을 수정해준다.

 

 

 

run

 

 

화면이 제대로 출력되는 모습

 


삭제버튼 클릭시 삭제후 리스트 

user_list.jsp  > 삭제버튼 텍스트만

user_list_insert.jsp > 삭제버튼 (경로이동)

user_list_update.jsp > 삭제버튼 (경로이동)

 

user_list_delete.jsp > 삭제처리 후 리스트 최종 완성

 

 

 

user_list_insert.jsp와 user_list_update.jsp의 내용을 추가하여 삭제버튼을 만들고 경로를 user_list_delete.jsp로 설정한다.

 

user_list_delete.jsp를 생성하고 내용을 작성한다.

(user_list.jsp의 내용을 참고한다.)

 

run

 

 

회원 등록 후 삭제하는 모습

 

회원등록, 수정 후 삭제하는 모습

 

 



상품등록, 리스트, 관리 화면 만들기

 

1. 상품 작업을 위한 폴더 및 파일명 정하기.

 

2. eclipse 를 이용하여 실습한 내용과 같이 상품관리 페이지를 만든다.

 

>이미지를 폼으로 제출하고 수정가능하게 만드는 방법을 알고싶어졌다.

 

회원 한명 리스트 만들기

 

html을 구글링하여 html 참고 사이트를 찾는다.

 

https://www.w3schools.com/

 

W3Schools Online Web Tutorials

HTML Example:

This is a heading

This is a paragraph.

Try it Yourself » CSS Example: body {   background-color: lightblue; } h1 {   color: white;   text-align: center

 

www.w3schools.com

 

 

html tables 메뉴에서 참고할 코드를 탐색한다.

 

TEST 폴더 생성 table.jsp 파일 생성하여 참고사이트의 html 코드 복사, table.jsp 에 붙여넣기한다.

 

표의 내용을 수정한다.

 

아래 불필요한 내용 삭제

 

run

 

 

내용을 추가한다.

 

 

run 

 

 

index.jsp와 table.jsp를 참고해서 user_list.jsp를 완성할 수 있다.

 

 index.jsp의 전체 내용 복사해서 user_list.jsp의 내용을 모두 지우고 붙여넣기

 - index와 내용이 같아 화면의 변화는 없지만 경로의 변화가 있다.

table.jsp 내용을 일부 (<head><style>~<body/>) 복사해서 user_list.jsp의 내용 부분에 붙여넣기

 

*css 태그 별도

 

table.jsp의

 

를 user_list.jsp의 <head><head/>사이에 붙여넣기

 

 

table.jsp의 <table><table/>의 내용을 user_list.jsp의 내용 부분에 붙여넣기

 

run

 

 

적용된 모습

 

 

* 스타일을 주석처리 해보기

 

표의 모양이 사라졌다

style태그가 table, th, td 태그에 영향을 미치는 것을 알 수 있다.

 


회원가입 화면에서 가입 후 리스트 경로 까지

 - user_insert_form.jsp 가입버튼을 클릭하면 두명의 리스트 화면으로 이동하게 만들기

 

 user_list_insert.jsp 생성

 

user_insert_form.jsp의 form action 경로 확인

 index.jsp를 run 하여 가입버튼 클릭 후 경로 확인

작업한 내용이 없으므로 빈 화면이 출력 된다.

 

 user_list.jsp의 내용을 전체 복사하여 user_list_insert.jsp 붙여넣고 user_list_insert.jsp 에 한명을 추가하고 리스트 이름을 바꾸어준다.

run

 

잘 작동되는 모습

+ Recent posts