WEB 38

어떠한 페이지를 만들기 위해서는 다양한 기능들이 필요하다. 컨트롤러 기능을 하는 jsp 페이지를 기능별로 만들라고 한다면? --> 만약 카페를 갔는데, 아메리카노는 A장소에서 주문하고 라떼는 B장소에서 주문하라는 것과 동일하다.       따라서 카운터 한 곳에서 주문을 받아 처리하는 것이 올바른 방법. ctrl_login.jsp 처럼 기능별로 페이지를 나누게 되면 : 메뉴별로 카운터가 다른 카페ctrl.jsp로 통합을 하는 것이 올바른 모습이다.  많은 기능들을 구분하여 수행하기 위해서는..action 파라미터에 값을 저장하여 controller.jsp로 전송할 필요가 있다.따라서 action명을 정하고, 이 내용은 view와 controller가 알아야 한다! 만약 로그아웃 기능을 수행한다면?로그아웃..

useBeanuseBean은 new 연산자를 대신한다. useBean은 page지시어 아래쪽에 사용해 준다.▼사용방법  일반적으로 new 연산자를 사용할 때,Apple banana = new Apple(); 형식으로 사용하는데, 이와 동일한 코드가useBean clss = "apple.Apple" id="banana"가 된다. 위의 예시에서..id ="사용할 이름"을 뜻하고,class="java파일의 패키지 이름.클래스이름" 으로 작성한다. memberDTO의 모든 속성을 설정하겠다는 의미이다!-> setProperty는 사용자의 입력값을 받아오며,   사용자가 form을 통해 제출한 데이터가 저장된 request 객체 전체를 memberDTO 객체에 담는다..setName() 같..

🍀문제!d. jsp : 이름을 입력하고e.jsp로 이동.e.jsp : 상품들이 select 박스에 제공되어 있다. (5개 정도 제공!)사용자가 [장바구니에 추가] 버튼을 눌러 해당 상품을 추가한다.[계산하기] 버튼을 누르면 지금까지 장바구니에 담았던 상품들을 모두 출력한다!f.jsp : 장바구니에 select에서 선택한 상품을 추가g.jsp : 장바구니에 저장했던 상품들을 출력   // d.jsp  사용자에게 이름을 입력받고,사용자가 "확인" 버튼을 누르면 e.jsp 파일로 이동한다.!  // e.jsp 처음으로 돌아가기(∩^o^)⊃━☆ 님, 환영합니다! 장바구니에 담을 상품을 선택해주세요❣️ 버터🧈 ..

JSP 내장객체의 종류1) exception2) out3) request4) response5) 파라미터를 옮길 수 있는 내장객체들  파라미터를 옮길 수 있는 내장객체들1) request2) session3) application 위의 3개의 내장객체들의 차이점?scope에 차이점이 있다.scope == 유효범위, 유효기간이라는 뜻이다. 🍀request / session / application의 scope1) request  - 1 요청  - 새로운 요청을 수행하게 되면 기존의 정보들이 사라진다. - getParameter();2) session - 1 브라우저 - 기존의 창을 닫으면 기존의 정보들이 사라진다. - 시간이 정해져 있다 -> 기존의 창이 유지되더라도 일정 시간이 지나면 기존 정보들이 사..

JSP 내장객체의 종류1) exception2) out3) request4) response5) 파라미터를 옮길 수 있는 내장객체들  out- 웹 브라우저 화면에 HTML을 작성하는 역할을 한다.- Servlet에서는 기본 제공 되지 않아서 선언해서 사용.response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); out.println(""); out.println(""); out.println("끝 페이지"); out.println(""); out.println(""); out.println(" "+msg+""); out.println(""); out.println(""); 하지만 JSP에는 내장되어..

JSP 내장 객체객체란?메서드 수행 주체를 의미한다. 내장객체의 종류exceptionoutrequestresponse파라미터를 옮길 수 있는 내장객체들 exception.jsp 파일을 생성하고, 아래의 코드를 작성하게 되면 에러가 발생한다. "+n1+" /"+n2+" = "+res+""); %> ▼ 웹 페이지에서 보이는 에러 화면▼ 콘솔창에서 확인되는 에러  500번대의 에러 원인은?백, 서버 or DB, JAVA, C or M.. 에서 에러가 발생한다.에러가 발생하면 해당 내용을 확인하여 해결해주어야 한다.현재 발생한 에러는 n2가 0이기 때문에, 0으로는 나눌 수 없어 발생한 에러이다 에러 해결방안의 종류1) n2를 0이 아닌 다른 정수로 설정한다.2) try-catch 예외처리를 한다.3) 에러 페..

html 파일의 경우src - main - webapp 안에 html 파일이 존재해야 한다.만약 잘못된 위치로 생성하게 된다면 404 에러가 발생하게 된다. 에러의 종류4xx >> 요청에서 문제 발생 (주로 프론트, js에서 문제 발생)     잘못된 요청     1) 없는 페이지 경로로 요청 (사용자 잘못)          만약 주소를 NewFile이 아닌 newfile로 잘못 입력하는 경우 -> 소문자 newfile이 없기 때문에 에러 발생     2) 페이지의 경로가 잘못됨 (프론트 잘못)          개발자가 경로를 잘못 설정했기 때문!!     이렇게 원인에 따라 해결 방안이 달라진다. 5xx >> 응답에서 문제 발생 (주로 백, 서버, DB, java, jsp 문제)   html에서는.....

쇼핑몰에서 흔하게 볼 수 있는 메뉴는 가로로 진열된 메뉴들과, 세로로 진열된 메뉴들이 있다.ex) 쿠팡 이 가로 네비게이션과 세로 네비게이션은 메뉴가 아예 다르다.글로벌 네비게이션 바 == gnb라고 한다. 구매 안의 카테고리로컬 네비게이션 바 == lnb 라고 한다.   베스트 상품 신상품 마이페이지 고객센터  네비게이션 바에 들어갈 메뉴들을 작성한다.해당 메뉴들을 태그로 감싸주게 되면,  해당 메뉴 클릭시 작성된 링크로 페이지 이동이 가능하다. 메뉴 꾸미기 태그를 정의하여 메뉴들을 꾸며줄 수 있다.정렬 / 색 / 리스트의 점 제거/ 마우스 가져다 댔을 때 효과 등...* 신상품 메뉴에 마우스를 가져다 댄 상태이다.

웹 폰트 구글에 웹 폰트를 검색하면, 구글 웹 폰트들을 확인할 수 있다. 원하는 폰트를 눌러서 -> 우측 상단의 Get font 버튼을 클릭한다. 그럼 이렇게 두 개의 버튼이 뜬다.1. Get embed code : 온라인으로 연결이 되어있어야지만 사용 가능2. Download all : 다운로드하였기 때문에 온라인 상태가 아니어도 사용 가능. 하지만 2번의 경우 파일이 무겁기도 하고, 파일 관리도 해야 하고, 온라인 아닌 상태에서 사용할 일이 없으므로1번 Get embed code로 사용한다. 그럼 맨 위에 html 코드가 나오는데,해당 코드를 복사해서 html 파일에 그대로 붙여넣기 하면 된다. 웹 폰트   그리고 style 태그 안쪽에 코드를 작성해준다." " 안에는 폰트명을 기입한다.h1, p{..

스타일 적용방법은 내부 스타일시트 적용 방법과 외부 스타일시트 적용 방법이 있다. 1. 내부 스타일시트 적용방법 많이 쓰이진 않음. >> 실무에선 주로 외부 스타일시트 적용을 사용함. 인라인 스타일 적용긴급하게 스타일 적용 우선순위를 높이는 방법 : 인라인 스타일 적용방법제목 문장 01 제목 문장 02 제목 문장 03     선택자(selector)h1 {      color : red; } h2{      color : blue; }위 코드에서 h1, h2  >> 선택자가장 기본적인 선택자가 h1, h2, span 이런 것들임. 타입 선택자inputh1span...등등의 요소를 그대로 작성하는 것! 제목 문장 01  제목 문장 02class 선택자여러 개 / . / 속성 class.red{ color..

태그form 태그를 만나게 되면, 사용자가 무언갈 입력한다고 이해하면 됨. action == 필수 속성!  이 form 태그 안에는 사용자에게 입력을 받아올 input을 입력한다.input은 속성에 따라 구현되는 게 다르다. input은 블록 요소가 아니기 때문에 띄어쓰기 (or 줄 바꿈) 해줘야 함.하나의 페이지에서 입력값을 여러개 보낼 수 있다. ID : PASSWORD : 수량 : 이메일 : 파일 업로드 : ID의 type = "text"PW의 type ="password"type="password"로 설정하게 되면 정보가 마킹되어서 나옴!    ex) PASSWORD에 1234를 입력하면 화면에는 ● ● ● ● 로 보임.  required : 해당 내용을 입력하지 않으면 넘어가..

이미지 넣기img를 입력하면, 자동으로 가 작성된다. 자동으로 속성이 작성되는 이유는? => 필수 속성이기 때문에! alt는 스크린리더에서 안내되어야 할 멘트를 작성한다.🍀스크린리더?눈이 보이지 않는 분들을 위해 웹에 있는 내용을 읽어주는 기능.반드시 넣어줘야 함! src에는 이미지 파일의 경로를 작성한다. 이미지 파일을 html 파일과 같은 위치에 넣고 설정해주면, 파일이 너무 많아지기 때문에 응집도가 떨어진다. 따라서 별도의 폴더를 만들어서 그 안에 이미지 파일을 넣어준다.실행시키게 되면 웹 페이지에서 내가 넣은 이미지가 보여진다.   만약 img 태그를 a 태그 안쪽에 넣어주면,해당 이미지 파일을 클릭했을 때 a 태그에서 설정한 링크로 페이지 이동도 가능하다!