Jquery - 이벤트 리스너

이벤트 리스너란?

• 이벤트가 발생했을 때 그 처리를 담당하는 함수
• click, mousehover, enter, focus 등

1. 로딩 이벤트

• .ready()
• $()
• 서버에서 무언가 가져올 때 사람들에게 보여주기 전에 작업을 하기 위한 것

2. 키보드 이벤트

• keydown : 먼저 발생, 아직 누른게 반영 안됐을 때
• keypress : 누른것이 반영 됐을 때(사라졌다고 한다)
• keyup : 땠을 때
• 키 코드로 구분할 수 있다

3. 마우스이벤트

• click : 클릭 이벤트
• mouseover: 마우스를 올렸을 때
• hover: 올렸다가 땠을 때도 감지, 함수 두개 설정 가능

$('#div1').hover(function (e) {
            console.log("div hover over");
            console.log("e : ", e);
        }, function (e) {
            console.log("div hover leave");
            console.log("e : ", e);
        })

• scroll : 스크롤
• currentTarget : 지금 이벤트가 발생한 것 지정

---

서버

• 클라이언트에게 네트워크를 통해 서비스를 제공하는 컴퓨터

서버 구축 방법

1. 본인의 컴퓨터를 직접 서버로 구축(거의 없음)
2. 일정 요금을 내고 외부 서버 임대해 사용(서버 호스팅, 웹 호스팅)

2-1 서버 호스팅

• 서버 한대 : 물리적으로 존재하는 컴퓨터 한 대를 통째로 임대
• 자체적 관리 필요
• 가격 비쌈
• 컴퓨터 작동 환경을 마음껏 유동적으로 설정
• 땅을 사서 단독 주택에 짓고 살기

2-2 웹 호스팅

• 서버 한 대의 일정 저장공간만을 임대해 다른 사용자들과 해당 서버 공유
• 저렴
• 쉽게 이용 가능
• 아파트를 각 세대가 나눠서 사용

클라우드 서버

• 실제 물리적 컴퓨터 한 대로 운영하는게 아닌 VM(가상머신)으로 서버를 운영하는 방식
• 프로그램으로 가상의 컴퓨터(서버)를 하나 생성해 이용
• 빠르게 서버 만들 수 있다
• 장점 : 짧은 시간안에 만들 수 있다, 이론상 접속량 많아도 다운 x

클라우드 모델

1. 퍼블릭 클라우드 : 소유는 공급자, 누구나 접근 가능
2. 프라이빗 클라우드 : 기업에서 자주 사용, 기업 내부에서만 접근할 수 있게 가상환경 구축
3. 하이브리드 클라우드 : 둘 다 사용되는 것, 결합 형태

AWS

• 아마존 웹 서비스

NCP

• 네이버 클라우드에서 제공
• 자료찾기 쉽고 가이드 잘 되어 있음
• 문의 쉬움

NCP 사용하면서 배운 포트

• 80포트 : http의 기본 포트
• 22 포트 : 서버 자체에 접근하기 위한 포트

접근소스 0.0.0.0

• 모든 ip를 의미
• IPV4 패킷을 전송하려는 컴퓨터가 자신의 IP주소를 모르는 경우 통신하기 위해 사용
• 어떤 네트워크에서도 접근할 수 있게 하는 것

IP주소

• 인터넷 상에서 데이터를 주고받기 위한 통신 규약(약속)
• 데이터를 주고 받기 위해 사용되는 주소
• 터미널에 ipconfig입력시 ip확인 가능

공인 ip

• 외부에서 접근할 수 있는 ip(서버주소) => putty나 filezillar는 이걸 통해 접근

1. 유동 ip : ip갱신 주기가 되었을 때 기기 껐다 켰을 경우 남아있는 ip골라서 할당 ex) 와이파이 공유기
2. 고정 ip : 사용자가 직접 ip주소 입력해 주소 설정, 한 번 부여받으면 반납 전까지 해당 ip할당 받는다

비공인 ip

• 로컬ip
• ncp안에서 접근할 수 있게 쓴 ip
• ipv4체계의 ip주소 부족 문제를 해결할 수 있는 방안

---

후기

이번주는 개인프로젝트를 2회차에 걸쳐진행했다. 나는 구글링을 통해 영화 예매 창을 만들면 재밌을 것 같아서 구현해봤다. 그리고 마지막 회차에는 서버 관련 프로그램을 깔고 ip와 같은 기본적인 지식을 배웠다. 서버가 생각보다 재밌어서 앞으로의 수업이 더 기대된다.