KOSTA 23일차) 톰캣 / 자바 기반 웹 프로그래밍 / <li> / <hr> / <alt>

해버니·2023년 4월 2일
0

KOSTA

목록 보기
1/32
post-thumbnail

지난 한 주는

지금까지 배운 내용들로 백엔드에서만 프로그램이 돌아가게 미니 미니 프로젝트를 만들었다.








Apache Tomcat 설치


32-bit/64-bit Windows Service Installer (pgp, sha512) 다운받기
Tomcat 9.0 버전으로 다운 받았다.








포트번호 안 겹치게 하기 위해 바꿔주고 Next 누르기








체크 해제하고 Finish 누르기











eclipse 톰캣 연결


Oracle Java SE Platform 다운받기









설정 > Server > Runtime Environments 에 들어가서 Add... 클릭








Apache Tomcat v9.0 선택하기
본인이 설치한 버전을 선택해주면 된다.








그리고 톰캣 경로도 선택해준다.








Dynamic Web Project로 프로젝트를 하나 만들어준다.
Dynamie web module version은 3.1로 해준다.








webapp 에서 뷰 페이지 파일들을 만들 것이다.
jsp 설치하기








그리고 Java Resources에서는 서버 관련 파일들을 만들 것이다.















오늘 공부한 내용

<ul>, <ol>, <li>




<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
<h3>목록 테스트</h3>
<h4>순서 없는 목록</h4>
<ul>
<li>자바</li>
<li>오라클</li>
<li>html</li>
</ul>

<ul style="list-style-type:disc">
<li>자바</li>
<li>오라클</li>
<li>html</li>
</ul>

<ul style="list-style-type:circle">
<li>자바</li>
<li>오라클</li>
<li>html</li>
</ul>

<ul style="list-style-type:square">
<li>자바</li>
<li>오라클</li>
<li>html</li>
</ul>

<ul style="list-style-type:none">
<li>자바</li>
<li>오라클</li>
<li>html</li>
</ul>

<ol>
<li>자바</li>
<li>오라클</li>
<li>html</li>
</ol>
</body>
</html>












자바 기반 웹 프로그래밍

front

html → 웹페이지 기본 뼈대
css → 예쁘게 꾸미기 위한
javascript → 프로그래밍적인 요소를 웹페이지에 추가
ajax(asynchronous javascript and xml) → 비동기 자바스크립트와 xml

아이디 입력할 때 새창이 뜰 때가 있고 그냥 바로 로그인을 할 수가 있는데 xml을 쓰면 새창이 안 나오게 만들 수 있다.
그래서 불필요한 페이지 이동을 줄일 수 있고 사용자 입장에선 적게 움직이는게 좋기 때문에 xml을 사용하는 것이 좋다.




비동기 or 동기란?

동기
자바에서 사용하는 일반적인 함수호출은 동기이다.
자바에서 메서드호출하면 호출한 쪽의 코드는 멈춰있고 그 메소드로 점프해서 그걸 실행하고 호출한쪽으로 다시 돌아와서 코드가 다시 실행이 된다.
그때 호출한 쪽의 코드는 멈춰져있는것이 동기이다.


비동기
동기와 반대로 호출해도 계속해서 코드가 돌아가는게 비동기이다.
그래서 비동기라고 하면 페이지 이동이 이루어질 수 있다.
예를 들어 아이디를 입력받고 입력받은 것을 (사용자 몰래?) 몰래 서버에게 보내준 다음 일치하면 로그인이 되고 일치하지 않으면 로그인이 되지 않게 한 페이지 내에서 비동기적으로 해결할 수 있다.





XML (eXtensible Markup Language)

XML은 DOM과 비슷하다
DOM이란 Document Object Model을 뜻한다.
XML은 우리가 직접 태그를 명명해서 사용하는 방법이다.
(HTML은 태그가 정해져 있고 직접 명명하고 싶을때 XML을 이용)





jQuery

계속 사용하는 코드는 라이브러리로 만들어 처음부터 만드는 게 아니라 가져다 쓴다.
그러면 편하기도 하고 신뢰성이 높아진다.
그런 자바스크립트 라이브러리이다.
(요즘엔 제이쿼리가 많이 빠지는 추세이다. 순수자바스크립트를 많이 쓴다.)





JSP (java server page)

중간에서 교통정리하는 컨트롤러 역할 웹통신이 가능한 자바이다.
HTML 웹페이지에서 자바값을 인식해야하는데 JSP가 이를 인식할 수 있다.

client와 server 중간에 있는 친구 : servlet.
역할 → 웹에서 클라이언트가 요청하는게 있으면 요청을 받고 처리해주는 친구가 servlet이다.











HTML

수평선 <hr> 태그

<hr/> // 수평선






<img>에서 alt 속성은?

<img src="../img/daum.png" alt="test1" style="width:200px">	

엑스박스가 떴을 때 그때 설정한 alt의 이름으로 출력하게 된다.
그래서 어느 부분이 잘못됐는지 확인할 수 있다.






0개의 댓글