1. 서블릿(Servlet)과 JSP(Java Server Page) 

▪ 서블릿은 자바를 이용한 서버 프로그래밍 기술이다. 

▪ JSP는 PHP와 유사한 형태로 HTML을 중심으로 자바 프로그램과의 유기적인 연결을 지원. 

 - JSP의 특징 

➊ 자바의 모든 기능을 사용할 수 있어 발전 가능성이 무한하다. 

➋ 서블릿으로 컴파일된 후 메모리에서 처리되기 때문에 많은 사용자의 접속도 원활하게 처리할 수 있다. 

➌ JSP 또는 다른 서블릿 간의 데이터를 쉽게 공유 할 수 있다. 

➍ 빈즈(Beans)라고 하는 자바 컴포넌트를 사용할 수 있다

➎ 커스텀 태그를 만들어 사용할 수 있으며, JSTL(JSP Standard Tag Library)과 같은 태그 라이브러리를 이용할 수 있다.

➏ 스트러츠, 스프링 @MVC 등 다양한 프레임워크와 결합하여 개발할 수 있다.

 

2. JSP 학습에 필요한 기술

 

1. JSP 전체 동작 과정 

• JSP 는 HTML 과 유사한 처리 과정을 거치나 HTML이 단순 서버 파일을 브라우저로 보내주는 것에 비해 JSP는 서버에서 프로그램이 실행된 결과를 웹 브라우저로 전달하는 차이가 있음.

JSP 전체 동작 과정

 

2. 서블릿 컨테이너 내부 과정 

▪ JSP와 서블릿 차이 

• JSP는 HTML과 같은 일반적인 텍스트 파일 구조 

• 서블릿은 자바 소스로 작성된 클래스 파일 구조 

• JSP는 서블릿 컨테이너에 의해 서블릿 형태의 자바 소스로 변환되어 클래스로 컴파일 됨

▪ 서블릿 컨테이너 

• 서블릿 컨테이너는 서블릿을 실행하고 JSP를 서블릿 코드로 변환하는 기능을 수행함. 

• 변환된 JSP의 서블릿 클래스를 실행하고 웹 서버의 메모리에 적재하고 사용자 요청에 따라 실행.

 

◼ JSP에 관해서 이것만은 알고 있자. 

➊ JSP는 일반 텍스트 파일로 되어 있다(텍스트 파일은 컴퓨터가 이해할 수 없다. 즉 실행 가능한 프로그램이 아 니며 특정 동작을 할 수 없다).

➋ JSP는 HTML 코드와 몇몇 특수한 태그, 그리고 자바 코드가 섞여 있다.

➌ 사용자가 요청할 경우 JSP는 컨테이너(톰캣)에 의해 서블릿 형태의 .java 소스로 변환되고 컴파일된다.

➍ 컴파일된 .class는 컴퓨터에서 실행할 수 있는 형태로 특정한 기능을 수행할 수 있게 된다. 이후 소스 변경 전 까지 해당 파일은 메모리에 상주하면서 다시 컴파일 되지 않고 서비스된다.

 

반응형
저작자표시

'잡동사니' 카테고리의 다른 글

[JSP] JSP 기본 문법  (0) 2020.06.16
[JSP] 서블릿의 이해  (0) 2020.06.16
[JSP] JSP 개발환경 구축  (0) 2020.06.16
[JSP] 웹 프로그래밍 언어와 주요 기술  (0) 2020.06.16
네트워크, 인터넷, 웹  (0) 2020.06.16

1. 자바 개발환경 - JDK

 - 3강 Spring MVC 5 - JDK 설치 및 설정

 

2. JSP 운영환경(서블릿 컨테이너) - 아파치 톰캣

▪ 아파치 톰캣(Apache Tomcat)은 웹 서버 소프트웨어의 하나로, 서블릿 컨테이너라고도 한다. 

▪ 서블릿 컨테이너는 서블릿과 JSP를 실행할 수 있는 환경을 말한다. 기본적으로 웹 서버의 기능도 포함하고 있으며 자바로 개발되어 있다. 

▪ 개발용이 아닌 실제 서비스용으로 웹 서버를 운영하려면 아파치 웹 서버를 설치하고 서블릿 컨테이너로 톰캣을 사용할 수 있도록 설정하는 것이 좋음.

 - 4강 Spring MVC 5 - Apache Tomcat 설치

 

3. 통합 개발환경 구축: 이클립스

▪ 이클립스(Eclipse)는 IBM에서 개발해 오픈소스 프로젝트로 기증한 통합 개발환경이다. 

 - 5강 Spring MVC 5 - 이클립스 설치 및 개발환경 구축

+ 이클립스 환경설정 텍스트 인코딩 설정하기

▪ 프로그램 개발 시 한글 사용은 여러 문제를 발생시키는 원인이 됨.
▪ 다국어를 지원하는 프로그램 개발을 위해서는 유니코드 기반인 UTF-8 의 사용이 권장됨.

[Window] - [Preferences]

➊ [General] → [Workspace] → Text file encoding 항목을 Other 로 변경한 뒤 UTF-8로 설정

➋ 자바 클래스 인코딩 설정 : [Preferences] - [General] → [Content Types] → Java Class File에 대한 Default encoding 값을 UTF-8 로 입력 후 <Update> 버튼

➌ JSP 파일 인코딩 설정 : [General]→[Content Types] → [Text] → JSP 항목을 UTF-8 로 변경 후 <Update> 버튼

➍ HTML / JSP 코드 인코딩 설정 : [Web] → [HTML Files], [JSP Files] 항목을 ISO 10646/Unicode(UTF-8)로 변경

반응형
저작자표시

'잡동사니' 카테고리의 다른 글

[JSP] 서블릿의 이해  (0) 2020.06.16
JSP  (0) 2020.06.16
[JSP] 웹 프로그래밍 언어와 주요 기술  (0) 2020.06.16
네트워크, 인터넷, 웹  (0) 2020.06.16
RTCMultiConnection 화상채팅 구현하기  (0) 2020.05.27

대표적인 웹 개발 기술

1. 클라이언트 기술 

▪ 기본적으로 브라우저에 의해 처리되는 요소

▪ 화면 구성, 스타일, 동적 이벤트처리 등 사용자 상호작용 담당

▪ HTML(Hyper Text Markup Language) 

• 웹 서비스를 표현하기 위해 사용하는 언어. 

• <HTML></HTML> 과 같은 마크업 구조. 

• 최근 HTML5 가 널리 사용되고 있음.

 

▪ 자바스크립트(JavaScript) 

• 자바와 유사한 문법구조를 제공하는 웹 클라이언트 개발 언어. 실제 자바와는 무관함. 

• 웹 브라우저 에서 해석함. 웹 브라우저 성능 평가에서 매우 중요한 요소가 됨. 

• jQuery 와 같은 공개 라이브러리가 유명함. 

• JSON(JavaScript Object Notation)은 클라이언트 서버간 정보 교환에 널리 사용.

 

▪ CSS(Cascading Style Sheet) 

• HTML에서 레이아웃이나 디자인 요소를 분리. 

• 최근 웹 클라이언트 개발은 HTML5+CSS3+JavaScript 임.

 

2. 서버 기술

▪ HTML 파일은 파일 내용을 수정하기 전까지는 내용이 변하지 않는 정적인 구조.

▪ 사용자 요청에 따라 다른 정보를 제공하거나 데이터베이스를 통한 서비스를 위해서는 별도의 프로그램 기술이 필요.

▪ ASP.Net

• MS 윈도우 기반의 서버 프로그램 기술 

• .Net 기반의 컴포넌트 사용 가능. 

• MS 윈도우 종속과 상용 라이센스 정책으로 대규모 공개 웹 서비스 개발에는 거의 사용되지 않음.

 

▪ PHP(Professional Hypertext Preprocessor) 

• 처리속도가 빠르고 다양한 운영체제와 웹 서버 환경에 서 실행 가능. 

• APM = Apache + PHP + MySQL • 오픈소스 게시판, 위키 프로그램, 연구용으로 널리 사용됨.

 

▪ JSP(Java Server Page) 

• 자바 서블릿 기반의 웹 프로그래밍 기술 

• 자바의 모든 기능을 사용할 수 있으며 안정성과 확장성이 뛰어나 가장 많이 사용되고 있는 웹 프로그래밍 기술임.

반응형
저작자표시

'잡동사니' 카테고리의 다른 글

JSP  (0) 2020.06.16
[JSP] JSP 개발환경 구축  (0) 2020.06.16
네트워크, 인터넷, 웹  (0) 2020.06.16
RTCMultiConnection 화상채팅 구현하기  (0) 2020.05.27
WebRTC  (0) 2020.04.15

1. 네트워크 

 TCP/IP 

▪ TCP/IP(Transmission Control Protocol/Internet Protocol)는 컴퓨터 간에 통신할 수 있도록 만든 프로토콜. 

▪ 인터넷의 기반 네트워크 시스템으로 하드웨어, 운영체제, 접속 매체에 관계없이 동작할 수 있는 개방형 구조.

TCP/IP의 계층

 IP 주소

▪ IP 주소(IP Address)는 TCP/IP로 연결된 네트워크 에서 각각의 컴퓨터를 구분하려고 사용하는 주소.

▪ 숫자로 구성되어 있고 “123.123.123.123” 과 같이 네 개로 구분된 10진수를 사용.

 

2. 인터넷(Internet) 

▪ 인터넷은 전 세계가 하나로 연결된 네트워크를 의미하는 고유명사로, Internet으로 표기.

▪ 인터넷은 네트워크 인프라이고 www, email 등은 인터넷 기반 서비스 임.

▪ 인터넷 ≠ 웹

대표적인 인터넷 기반 서비스

 

 프로토콜 

▪ 네트워크에 연결된 컴퓨터들 간의 통신 규약 

▪ 인터넷 서비스들은 TCP/IP 4계층 중 응용계층에 해당함. 

 포트 

▪ 네트워크 서비스를 접속하기 위한 접점. 

▪ 컴퓨터에서 여러 네트워크 서비스를 제공하는 경우 이를 구분하기 위한 용도로 사용. 

▪ 은행의 구분된 업무 창구와 유사한 개념.

 DNS(Domain Name System) 

• 인터넷에 연결된 컴퓨터 구분을 위해 사용하는 IP주소 대신 알기 쉬운 이름 형태로 컴퓨터를 구분하기 위 한 인터넷 서비스/시스템 중 하나.

• 호스트(컴퓨터) 이름(www) + 도메인 이름(naver.com) 형태로 구성됨

 

3. 웹 

▪ 월드 와이드 웹(World Wide Web, www) 

▪ 인터넷에서 운영되는 서비스 중 하나로 많은 사람들이 ‘웹 = 인터넷’이라고 생각할 정도로 대표적인 인터넷 서비스임.

 서버(Server) 

• 네트워크에서 서비스를 제공하는 컴퓨터

• 웹 서버, FTP 서버, 파일 서버, 프린트 서버

 클라이언트(Client)

• 서비스를 이용하는 컴퓨터 → 웹 브라우저(Web Browser) 

• PC, 스마트폰, 태블릿 등

• 인터넷 익스플로러(Internet Explorer), 크롬(Chrome), 파이어폭스(Firefox), 애플 사파리(Safari) 등

 HTTP(Hyper Text Transfer Protocol)

• 웹 서비스에 사용되는 통신 규격

• 간단한 명령어와 헤더 규격으로 되어 있음
 

클라이언트와 서버간 동작 과정

 

반응형
저작자표시

'잡동사니' 카테고리의 다른 글

[JSP] JSP 개발환경 구축  (0) 2020.06.16
[JSP] 웹 프로그래밍 언어와 주요 기술  (0) 2020.06.16
RTCMultiConnection 화상채팅 구현하기  (0) 2020.05.27
WebRTC  (0) 2020.04.15
TOEIC Speaking Part2 빈출 표현  (0) 2020.03.05

RTCMultiConnection은 피어 투 피어 응용 프로그램 (화면 공유, 오디오 / 비디오 회의, 파일 공유, 미디어 스트리밍 등)을위한 WebRTC JavaScript 라이브러리입니다.

 

1. 폴더 생성

폴더 생성

 

2. 깃에서 코드 다운받기

git clone https://github.com/muaz-khan/RTCMultiConnection.git ./
sudo npm install --production

깃에서 파일 다운받기
node_modeules 폴더가 생긴것을 확인 할 수 있다.

 

3. server.js 실행

node server.js

 

※ 서버가 올바르게 실행되고 있는지 확인하는 방법

 https://도메인:9001/socket.io/socket.io.js 서버에 로드 할 수 있다면 정상적으로 작동하고 있는 것이다.

※ config.json 

aws와 https를 사용하기 때문에 설정 파일을 변경해줘야한다. 

( aws 9001 포트도 열어줘야한다. )

config.json

{
  "socketURL": "https://jungeun96.cf:9001/", //도메인
  "dirPath": "/var/www/html/RTCMultiConnection", // 폴더 경로
  "homePage": "/demos/index.html", // 첫 화면
  "socketMessageEvent": "RTCMultiConnection-Message",
  "socketCustomEvent": "RTCMultiConnection-Custom-Message",
  "port": "9001", // 포트번호
  "enableLogs": "false",
  "autoRebootServerOnFailure": "false",
  "isUseHTTPs": "true", // https 사용
  "sslKey": "/home/privkey.pem", //인증서 위치
  "sslCert": "/home/cert.pem", //인증서 위치
  "sslCabundle": "",
  "enableAdmin": "false", 
  "adminUserName": "username",
  "adminPassword": "password"
}

 

 

 

반응형
저작자표시

'잡동사니' 카테고리의 다른 글

[JSP] 웹 프로그래밍 언어와 주요 기술  (0) 2020.06.16
네트워크, 인터넷, 웹  (0) 2020.06.16
WebRTC  (0) 2020.04.15
TOEIC Speaking Part2 빈출 표현  (0) 2020.03.05
TOEIC Speaking Part3 빈출 표현  (0) 2020.03.05

WebRTC는 웹 및 기본 앱에서 오디오, 비디오 및 데이터의 실시간 통신을 가능하게하는 오픈 소스 프로젝트입니다.

WebRTC에는 여러 JavaScript API가 있습니다. 

 

WebRTC 호출을 설정하고 유지하려면 WebRTC 클라이언트 (피어)가 메타 데이터를 교환해야합니다.

  • 후보자 (네트워크) 정보.
  • 제공 및 대답 등의 해상도와 코덱 등의 미디어에 대한 정보를 제공하는 메시지.

다시 말해, 오디오, 비디오 또는 데이터의 피어 투 피어 스트리밍이 발생하기 전에 메타 데이터 교환이 필요합니다. 이 과정을 시그널링 이라고 합니다 .

이전 단계에서 발신자와 수신자 RTCPeerConnection 객체는 같은 페이지에 있으므로 '신호'는 단순히 객체간에 메타 데이터를 전달하는 것입니다.

실제 응용 프로그램에서 발신자와 수신자 RTCPeerConnection은 서로 다른 장치의 웹 페이지에서 실행되므로 메타 데이터와 통신 할 수있는 방법이 필요합니다.

이를 위해 신호 서버 (WebRTC 클라이언트 (피어)간에 메시지를 전달할 수있는 서버)를 사용합니다. 실제 메시지는 일반 텍스트 : 문자열 화 된 JavaScript 객체입니다.

전제 조건 : Node.js 설치

 Node.js.를 사용하여 로컬 호스트에 서버를 실행해야합니다

 

https://codelabs.developers.google.com/codelabs/webrtc-web/#0

 

Real time communication with WebRTC

A complete version of this step is in the step-2 folder. RTCPeerConnection is an API for making WebRTC calls to stream video and audio, and exchange data. This example sets up a connection between two RTCPeerConnection objects (known as peers) on the same

codelabs.developers.google.com

https://dksshddl.tistory.com/entry/webRTC-%EC%9B%B9RTC-%EC%98%88%EC%A0%9C%EB%A1%9C-%ED%99%94%EC%83%81-%EC%B1%84%ED%8C%85-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0

 

[webRTC] 웹RTC 예제로 화상 채팅 구현하기.

1. webRTC RTC는 Real-Time Communications의 약자이다. 웹을 통해 웹어플리케이션이 비디오, 오디오 스트림 뿐만아니라 데이터를 중간의 서버가 없 이 직접 주고 받게할 수 있는 것이 목적이다. webRTC의 장점은..

dksshddl.tistory.com

 

반응형
저작자표시

'잡동사니' 카테고리의 다른 글

네트워크, 인터넷, 웹  (0) 2020.06.16
RTCMultiConnection 화상채팅 구현하기  (0) 2020.05.27
TOEIC Speaking Part2 빈출 표현  (0) 2020.03.05
TOEIC Speaking Part3 빈출 표현  (0) 2020.03.05
TOEIC Speaking 유형 정리 & 템플릿  (0) 2020.03.05
사물

columns : 기둥들
handrail : 난간
Double-decker bus : 이층버스
luggage : 여행가방
stroller : 유모차
bushed : 관목들
structures : 구조물
statue : 동상
pillar : 기둥
conference call : 동영상 회의
shelves : 선반

 

위치

construction site : 공사장
grass field / lawn : 잔디밭

 

복장

머리 - ponytail : 묶은 머리 / bald : 대머리 / blonnd hair : 금발
복장 - suit / casuals  
apron : 앞치마
mustache : 콧수염 

 

동작 

crossing legs : 다리를 꼬다
crossing the street : 길을 건너다
walking down/up the street : 길을 걸어 내려오다. / 올라가다
walking down/up the stairs : 계단에 내려오다/올라오다
pointing at : 가리키다
rasing hand : 손을 들다
carrying a bag : 어깨에 매다
looking into - ~을 들여다 보다
talking to each other : 서로 말하다
sitting face to face : 얼굴 보고 앉다
bending down : 숙이다
serving customer : 손님들을 대접하다
leaning on : 기대다
seems to be waiting for _ : _을 기다리고 있는거 같다.
giving a lecture : 수업하다
seems to be concentrating : 집중하는 것처럼 보이다
talking on the phone : 통화하다
working on the computer/laptop : 컴퓨터로 작업하다
writing something down : 무언가를 적고 있다.
standing in line : 줄을 서다
is parked along the street : 길가에 주차되어있다.
is surrounded by buildings : 건물에 둘러싸여 있다.
is tied to a dock : 부두에 묶여있다
is planted in the park : 공원에 심어져있다.
is hanging on the wall : 벽에 걸려있다.
is placed / scattered on the desk : 책상위에 놓여있다. / 흩어져있다.

 

반응형
저작자표시

'잡동사니' 카테고리의 다른 글

RTCMultiConnection 화상채팅 구현하기  (0) 2020.05.27
WebRTC  (0) 2020.04.15
TOEIC Speaking Part3 빈출 표현  (0) 2020.03.05
TOEIC Speaking 유형 정리 & 템플릿  (0) 2020.03.05
[CSS]CSS 기초1  (0) 2020.01.30
  • It is very interesting and I love it.               그것은 매우 흥미롭고 난 그게 너무 좋다.
  • It is very convenient to use.                       그것은 사용하기 매우 편리하다.
  • It is a significant matter to me.                  그것은 나에게 중요하다.
  • I can have so much fun.                           나는 즐거운 시간을 가질 수 있다.
  • There are so many choices.                      선택이 많다.
  • I seriously care about 00                          나는 00을 심하게 신경 쓴다.
  • It is so easy to ~ / it is so hard to               ~~ 하기 쉽다. / ~ 하기 어렵다.
  • The price is very attractive and reasonable.    가격이 매우 매력적이고 적절하다.
  • I will be able to 00                                   나는 00을 하는 것이 가능할 것이다.
  • I always do my best                                 나는 항상 최선을 다한다.
  • It makes me relaxed and happy                  그것은 나를 편하고 행복하게 해준다.
  • It is absolutely bad for 00                         그것은 00에 안좋다.
  • It is absolutely good for 00                       그것은 00에 좋다.
  • I can relieve my stress.                             나는 내 스트레스를 풀 수 있다.
  • It took me about 20 minutes                     한 20분 걸렸다.
  • Since I am a student, I have/I don’t have      나는 학생이여서, ~ 가지다 / ~없다.
  • 00 is well organized                                 00이 잘 마련되어 있다.
  • anytime anywhere                                   아무 때나 아무데서나
  • I can get more 00                                   나는 00을 더 얻을 수 있다.
  • I can feel the fresh breeze of air                 나는 맑은 공기를 마실 수 있다.
  • I can get information from the internet        나는 인터넷에서 정보를 얻을 수 있다.
  • I always pay attention to 00                      나는 항상 00 에 관심을 둔다.
  • I don’t know how to use 00                      나는 00을 다룰 줄 모른다.
  • when I go shopping                                내가 쇼핑 갈 때
  • It is cost effective.                                  그것은 가성비가 좋다.
  • I am pretty satisfied with it.                      나는 그것에 매우 만족한다.
  • I can take care of 00                               나는 00을 돌볼 수 있다.
  • I think, opportunity cost is too high.           내 생각에 기회 비용이 너무 크다
  • I can save so much money                       나는 돈을 아낄 수 있다.
  • 00 is available                                       00이 가능하다.
  • I don’t know exactly but                         ~잘 모르겠지만 ~~
  • When it comes to 00,                             00에 대해 말하자면 ~~
  • I am interested in 00                              나는 00에 관심이 있다.
반응형
저작자표시

'잡동사니' 카테고리의 다른 글

WebRTC  (0) 2020.04.15
TOEIC Speaking Part2 빈출 표현  (0) 2020.03.05
TOEIC Speaking 유형 정리 & 템플릿  (0) 2020.03.05
[CSS]CSS 기초1  (0) 2020.01.30
[CSS]CSS 기초  (0) 2020.01.23

+ Recent posts

티스토리툴바