<자바>
highjava/workspace
UTF-8 업데이트
=자바 복습=
배열의 단점은 크기 조절이 어렵다는 것
이 변동되는 크기를 조절하고 배열의 값을 자동으로 저장시켜주는 것이 컬렉션(리스트)
배열 안에 저장되는 데이터는 객체.
컬렉션 안에 저장되는 데이터도 객체(객체가 아니면 자동으로 변환(오토박싱) int => Integer)
데이터를 다시 꺼내올 때에는 객체회되어 있던 데이터를 다시 언박싱(Integer => int)
벡터와 어레이리스트는 구조와 기능이 같은데나중에 배울 스레드를 얘기해보자면
스레드에서 기능이 반복되면 한 데이터를 서로 공유해서 사용할 수 있다.
이 공통으로 쓰이는 데이터를 서로 쓰게 되면 서로가 상충되며 데이터 문제가 생길 소지가 있어서 데이터 동기화 처리가 필요한데
리스트는 이게 안 되어 있지만 벡터는 동기화 처리가 되어 있다. 그래서 좀 더 무겁다.
평상시에는 리스트를 사용하면 되고 나중에 스레드 동기화 처리가 필요하면 벡터를 쓰면 되고
리스트도 나중에 가면 동기화 처리를 할 수 있는 방법이 있기 때문에 리스트를 주로 쓴다.
예전에 컬렉션이 활성화되어있지 않았던 때는 벡터를 많이 썼지만 지금은 리스트를 쓰는 게 훨씬 더 편리하다.
벡터는 <> 안에 제네릭타입을 적는데 이 안에 들어가는 자료형 이름에 따라 해당 자료형 데이터만 저장하게 된다.
컬렉션들은 내부에 있는 데이터를 알고 싶으면 size() 를 통해 반환 가능(벡터도 마찬가지)
벡터에는 컬렉션에 많은 양을 저장하는게 목적인데 이때 add(추가할 데이터), 반환값으로 성공하면true, 실패하면(데이터 형식이 맞지 않는 등) false
근데 오토박싱이 있으니 자료형 지정하고 바로 넣어도 된다(자바1.9이상부터 new 자료형이름=>자료형.valueOf로 객체 저장 방식도 바뀜)
추가의 두번쨰 방법은 add(index,데이터) 하면 기존 index번째의 데이터를 새 데이터로 추가함(기존 데이터는 사라지지 않고 뒤로 밀려남)
이제 저장된 데이터를 꺼내올 때는 get(index)
이제 저장된 데이터를 수정할 때는 set(index, newdata)
이제 저장된 데이터를 삭제할 때는 remove(index) 또는 remove(삭제할데이터)인데 이 때 정수를 삭제하려다 index로 인식하여 삭제되는 불상사가 발생하지 않도록 remove(Integer.valueOf(500))과 같은 식으로 데이터를 객체화하여 삭제하도록 하자. 문자 데이터도 그대로 하면 문자가 아닌 유니코드 숫자로
변환되어 인덱스 번호로 인식하기에 remove(Character.valueOf('r')) 과 같은 형식으로..
전체 자료 삭제는 clear()
자료가 비었는지 여부 검사는 isEmpty() 로 true/false 로 값이 나뉜다.
일반적인 for문 이용시 벡터나 리스트에 저장된 데이터 전체를 차례로 가져와 처리하게 된다.
향상된 for문은 자료형벡터가 자료형 데이터를 하나씩 꺼내오도록 하면 처음부터 끝까지 모든 데이터가 출력된다.
인덱스 값을 사용 안해도 될때는 이게 더 편하다
이제 리스트를 봐보면 ==>>>>
contains 를 사용해서 데이터값 존재 여부를 boolean 형식으로 찾을 수 있다
또한 indexOf(찾을 자료) 형식을 취하면 앞에서부터 뒤에까지 찾으면서 처음 찾는 값을 반환하고 없으면 -1 반환, lastIndexOf는 뒤부터 처음까지
리스트 자료를 배열로 반환시 toArray() 사용시 Object형 배열로 반환되며
원하는 배열타입이 있을 시 toArray(new 제네릭타입[0]으로 반환한다.
=스택, 큐=
스택은 자료를 담는 그릇(후입선출) ==> FILO, LIFO
큐도 자료를 담는 그릇(선입선출) ==> FIFO, LILO
Stack과 Queue는 LinkedList를 이용하여 사용 가능
Stack의 명령
1. 자료 입력 : push(입력값)
2. 자료 출력 : pop() ==> 자료를 꺼내온 후 꺼내온 자료를 Stack에서 삭제한다.
peek() ==> 삭제 없이 자료를 꺼내온다(단순히 조회하거나 비교하고 싶을 때 사용).
Queue의 명령
1. 자료 입력 : offer(입력값)
2. 자료 출력 : poll() ==> 자료를 꺼내오고 꺼내온 자료를 Queue에서 삭제한다.
peek() ==> 삭제 없이 자료를 꺼내온다.
다음 시간==> 정렬하기 배울것
<HTML 웹 프로그래밍 기초>
우리는 뭐다? 앞단과 뒷단의 영역을 모두 관장하는 풀스택 개발자.
이번 과정에서는 프론트, 앞단의 영역을 맛볼 것이다
웹 구성의 3요소
- http (문서 전송 프로토콜(규약))
- html 이라는 문서 형태
- uri 보낼 위치=통합 자원 식별자(내부에 url포함)
서버에 요청하고, 전달받는다
이러한 HTML문서를 읽어서 눈에 보이는 웹 페이지를 만드는 응용 SW = 웹 브라우저
요청과 응답이라는 2가지의 기본 프로토콜로 구성되어있다.
- HTML은 웹 페이지를 기술하기 위한 마크업 언어
- 마크업 언어는 텍스트에 태그를 붙여서 텍스트가 문서의 어디에 해당하는지를 기술한 것(언어라기보다 기본의 상식을 지정하는 문법)
* 예외: 컨텐츠가 없는 태그는 종료 태그가 없음
- HTML은 여러 수정을 거쳐 최근에 이르러서는 2014년 10월 28일에 나온 HTML5 가 기준이 된다
- HTML5로 이동하면서 강력한 멀티미디어 기능이 지원되었다.
- 멀티미디어 외에도 오프라인 웹 애플리케이션,드래그 앤 드롭, 웹 스토리지,위치 정보,파일API,웹소켓API등 많은 기술이 지원됨
- 현재 다양한 웹 브라우저가 존재하는 만큼 사용자에게 배포되는 HTML문서를 작성할 때는 여러 브라우저를 사용해 다양한 환경에서 테스트해야 한다.
Dynamic web project 생성
encoding 형식 utf-8 apply (content type의 text 전부, 나머지 다 하나씩
test html 만들기
톰캣 홈페이지에서 다운받자. 맥은 tar파일 다운,,! 근데 나는 왜 zip파일로 하니 되는 것인가...
https://tomcat.apache.org/download-10.cgi
Apache Tomcat® - Apache Tomcat 10 Software Downloads
Welcome to the Apache Tomcat® 10.x software download page. This page provides download links for obtaining the latest version of Tomcat 10.1.x software, as well as links to the archives of older releases. Unsure which version you need? Specification versi
tomcat.apache.org
저장잘됨
(http://localhost:8080/1024/test.html)
기본포트는 8080으로 설정되어있구만
*웹포트의 기본값:80(생략가능)
이클립스 + 톰캣(WAS서버)
WAS(Web Application Server):동적 페이지 제공
정적 페이지 제공
이클립스는 맛보기!
당분간 vscode로!
폴더선택까지 진행하자(Open Folder)
html5 형식으로 지정하자
동적 기능은 당장은 사용 안하므로 viewprot 부분은 지우고,
Extension 확장 스토어에서 live server 다운
go live 누르기
이런거 받으면 이클립스 주요 단축키 사용가능
그 전에는 문서에 대한 형식을 설명하는 구문이 많았었는데
5버전에 들어서는 간편하게 형식 선언이 가능하다.
-시작 태그,콘텐츠, 종료 태그로 정의된 문서 구성요소
속성)
- 요소에 대한 추가적인 정보 제공
- 속성은 시작 태그에 name="value"형태로 정의한다
커맨드 쉬프트 c ==> 한줄 주석
커맨드 쉬프트 / ==> 선택한 블록 영역 주석
⌘(cmd) ⌥(option) ⇧(shift) 여러 블록 선택
- HTML 문서는 대소문자를 가리지 않으나 보기 편하고 수정이 용이하도록 소문자로 통일하는 편
- 시작 태그와 종료 태그를 먼저 쓰는 게 에러 방지에 용이하다
- HTML문서를 정의할 때 들여쓰기(indent)에 주의한다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>기본 태그</title>
</head>
<body>
<!-- line break: 줄넘김 태그 -->
자<br>
오늘은<br>
여기까지<br>
합시다<br>
....
<!-- horizental: 수평선 태그 -->
<hr>
뻥 이지롱~~
<!-- paragraph: 단락을 정의 -->
<p>(줄넘김 태그 안썼는데 줄넘김됨=>블록요소라서..)이야기 토막</p>
<!-- pre: 미리 정의된 서식으로 작성되는 태그(줄넘김/공백 사용이 자유롭다) -->
<pre>ㅎ
아무거 나 입
력~~ ! !
<!-- heading tag - 각 콘텐츠들의 정의으로 사용 -->
<h1>헤딩태그 h1</h1의
<h2>헤딩태그 h2</h2>
<h3>헤딩태그 h3</h3>
<h4>헤딩태그 h4</h4>
<h5>헤딩태그 h5</h5>
<h6>헤딩태그 h6</h6>
<h7>h7은 없는 태그라서 브라우저 마음대로 표현</h7>
<br> 태그를 문자 그대로 화면에 표현하고 싶당
<!-- 목록태그 ul/ol/dl -->
<!-- unordered list -->
<!-- list-style: disc;는 기본 값으로 생략된다 -->
<ul style="list-style: decimal;">
<li>순서없는 목록1</li>
<li>순서없는 목록2</li>
<li>순서없는 목록3</li>
</ul>
<!-- ordered list -->
<ol style="list-style: hiragana;">
<!-- target의 속성값에 세미콜론 있으면 앙대 -->
<li><a href="//google.com" target="_self"> 순서있는 목록1</a></li>
<li>순서있는 목록2</li>
<li>순서있는 목록3</li>
</ol>
<!-- definition list -->
<dl>
<dt>정의1</dt>
<dd>상세내용이 들여쓰기 되네용</dd>
<dt>정의2</dt>
<dd>내용2</dd>
<dt>정의2</dt>
<dd>내용3</dd>
</dl>
</pre>
</body>
</html>오늘은
여기까지
합시다
....
뻥 이지롱~~
(줄넘김 태그 안썼는데 줄넘김됨=>블록요소라서..)이야기 토막
ㅎ
아무거 나 입
력~~ ! !
헤딩태그 h1헤딩태그 h2
헤딩태그 h3
헤딩태그 h4
헤딩태그 h5
헤딩태그 h6
h7은 없는 태그라서 브라우저 마음대로 표현
<br> 태그를 문자 그대로 화면에 표현하고 싶당
- 순서없는 목록1
- 순서없는 목록2
- 순서없는 목록3
- 순서있는 목록1
- 순서있는 목록2
- 순서있는 목록3
- 정의1
- 상세내용이 들여쓰기 되네용
- 정의2
- 내용2
- 정의2
- 내용3
HTML 출력 결과
참고사항
1. HTML5 스펙에 따르면 <b>와 <i> 태그는 다른 모든 태그가 적절하지 않은 경우에만 사용되어야 함
2. 강조해야 하는 텍스트는 <em>을 사용하는 편이 좋음
3. 중요한 텍스트는 <strong> 태그를 사용
4. 하이라이트 된 텍스트는 <mark> 태그를 사용
5. 모든 텍스트 스타일은 CSS를 이용하는 것이 원칙
6. 볼드 텍스트를 만들려면 CSS의 font-weight 속성을 사용
웹 접근성)
웹 접근성이란 장애인 고령자 등이 비장애인과 동등한 조건으로 정보를 접할 수 있는 환경을 제공하는 것이다
HTML은 여러 개의 공백이 이웃해 있더라도 하나의 공백으로 간주한다.
따라서 불가피하게 여러 개의 공백을 나타내고자 할 때는 를 여러개 사용해야 한다.
< 를 표시하려고 해도 마찬가지다
<br> 태그를 문자 그대로 화면에 표현하고 싶당
결과>>
<br> 태그를 문자 그대로 화면에 표현하고 싶당
목록 표시
커맨드+F2 ==> 원하는 글자 공통된 부분 전부 수정가능
하이퍼링크: 현재 문서에서 다른 문서로 연결해 이동하는 것 . 앵커 태그라고도 한다.
지정된 id영역으로 이동