플레이스토어 병아리게임 출시!!!~~ [많은 이용 부탁드립니다!]

📝톰캣 연결

Window - Preference - Sever - Runtime Enviorment - Add - 설치된 버전 선택 - 디렉토리 설정 – finish

📝인코딩 설정

Window - Preference - Web - CSS, HTML, JSP을 UTF-8로 설정

Window - Preference - General - Worspace - Text file encoding을 UTF-8로 설정

📝기본 웹브라우저 설정

Window - Web Browser - 사용할 기본 웹브라우저 설정

📝JSP 프로젝트 만들기

File - New - others - Dynamic Web Project

WebContent : .jsp 파일 넣는 곳 (META-INF, WEB-INF에만 안 넣으면 된다)

이클립스의 워크플레이스에는 환경이나 여러 가지가 저장 되어 있다.

📝자바스크립트

HTML을 동적으로 움직이게 하는 언어의 종류 요즘은 데스크톱 애플리케이션 개발, 게임등 여러 개발에도 사용

📝Nodejs

JavaScript를 크롬(Chrome)같은 브라우저에서만 쓰는 것이 아닌 브라우저 밖. 즉, 내 컴퓨터에서 다양한 용도로 확장하기 위해 만들어진 것이 바로 Node.js이다.

Node.js를 이해하려면 먼저 Javascript를 배워야 한다.

그 이유는 Node.js는 Javascript 기반으로 개조하여 만들어졌기 때문입니다.

Javascript를 웹 브라우저에서 독립시킨 것으로 Node.js를 설치하게 되면 터미널프로그램(윈도우의 cmd, 맥의 terminal 등)에서 브라우져 없이 Javascript를 실행할 수 있습니다.

하지만 Javascript에서 분리된 언어이기 때문에 문법은 같습니다.

이렇게 Node.js를 이용하여 웹브라우져와 무관한 프로그램을 만들 수 있게 되었고, 중요한 것은 Node.js를 이용하여 서버를 만들 수 있다는 것입니다.

중요한 이유는 이전까지 Server-Clint 웹사이트를 만들 때 웹에서 표시되는 부분은 Javascript를 사용하여 만들어야만 했으며, 서버는 Ruby, Java 등 다른 언어를 써서 만들어야 했는데, 마침내 한가지 언어로 전체 웹페이지를 만들 수 있게 된 것

📝디버깅

프로그래밍에서 잘못된 부분을 찾는 것

📝프레임워크

효율적으로 구조를 짜놓는 개발 방식 웹 응용 프로그램을 개발하기 위해 프레임워크가 반드시 필요한 건 아니지만

작업 속도를 크게 높이고 단순화 장점이 있다

아주 간단하게 이야기하자면 조립식 컴퓨터를 살 때 부품을 사잖아요 근데 부품은 여러가지 회로들로 만들어진 건데

이렇게 만들어진 부품가지고 내가 필요한 거를 써서 조립해서 쓰는 걸 프레임워크라고 생각하시면 됩니다.

내가 회로를 만들어서 RAM만들고 이런식이면 엄청 오래걸리고 실수할 확률도 늘어나잖아요 그게 프레임워크에 장점입니다.

라이브러리와의 차이점은 내가 통제할 수 있다는 것(물론 한정된 범위가 존재 → 메뉴얼대로 하는게 좋다)입니다.

📝라이브러리

두 지점의 위도와 경도를 가지고 거리를 측정하는 함수를 직접 만드는 것보다 이런 자주 쓰는 걸 모듈화 해 제공해주는 것을 말합니다. 이러한 것들은 공신력있고 검증이 되었기 때문에 내가 임의로 만들어서 사용하는 것보다 훨씬 빠르고 정확할 가능성이 매우 높습니다.

프레임워크랑 차이점은 내가 통제할 수 없습니다 (Git에 올라간 경우 Fork를 이용해 내가 수정해서 사용할 수도 있다)

📝 URI

URI는 리소스의 이름만 나타낸다.

예를 들면 www.naver.com 처럼 프로토콜 방식도 안 적혀 있는 자체를 의미한다.

📝 URL

URL은 프로토콜 방식과 URI를 포함한다.

예를 들면  https://www.naver.com 처럼 HTTPS 라는 프로토콜 방식과 www.naver.com 이라는 URI 이름을 가지고 있다

📝 URN

메인 도메인을 제외한 부분을 의미한다

EndPoint이라고 생각하면 된다. 

📝 REST API

웹에 존재하는 모든 자원(이미지, 동영상, DB 자원)에 고유한 URI를 부여해 활용 [API서버 중에서 REST방식을 잘 따르는 API] HTTP Method + 모든 개체 Resource화 + URL 디자인 (라우팅)

• HTTP Method
  • HTTP방식(POST, GET, DELETE, PATCH)을 통해 해당 자원에 대한 CRUD를 적용 한 것
• 모든 개체 Resource화
  • 요청시 Response로 돌려줄 개체의 값들 → Json, XML
• URL 디자인 (라우팅)
  • 요청할 HTTP URL 주소

예시로 https://192.168.0.40/user의 URL을 통해 GET방식으로 호출할 때 Json형식으로 user에 대한 정보를 보내준다

📝 RESTFul

Rest API 설계 규칙을 올바르게 지킨 시스템을 Restful하다 한다

📝 SOAP

데이터를 주고 받는 규약으로서 XML으로 작성한다.

데이터를 주고 받을 때 XML 작성 → WSDL로 정의 → UDDI에 등록 → UDDI등록된 프로토콜 기반 호출 → 데이터 획득

• WSDL
  • 웹 서비스를 기술한 언어로 XML을 작성할 때 규약이다 안에는 보낼 데이터에 대한 규약따위가 들어있다
  • 예를 들면 HTTP통신할 때 Header에 들어갈 때 Content-Type이 Application/json 이런식으로 설정하는 것과 같다. json으로 표현하자면 이런 형식인 것이다. { "name" : "lee" }

• UDDI
  • WSDL로 정의되면 UDDI라는 곳에 등록되어 호출해서 데이터를 받아갈 수 있게 한다.

🔗 참고 자료 및 출처

https://www.elancer.co.kr/blog/view?seq=74 

📝패킷 

크게 헤더와 바디로 나뉩니다.

📝헤더

헤더에는 7가지 HTTP 메서드 방식중 무엇을 썻는지, 요청 클라이언트의 정보, 브라우저 정보, 접속할 URL 등등 과 같은 클라이언트 정보를 담는다

📝바디      

바디는 보통 비어있다. 하지만, 특정 데이터를 담아서 보낼 수 있다

📝POST방식

Body영역에 데이터를 실어 보낸다 (내용 안 보임) 그래서 보안에 GET방식보단 강하다

데이터 전송양에 길이 제한이 없으며 대용량 데이터를 보내는데 적합합니다.

📝GET방식

www.example.com?id=mommoo&pass=1234와 같이 URL에 Parameter를 전송하기 때문에 body영역을 사용하지 않는다

옛날에는 URL포함 255자 까지 전송이 가능하며 HTTP/1.1 에서는 2048자 까지 가능하지만 요즘은 제한이 없다 (WAS나 서버에서 제한을 줄 수도 풀 수도 있음)

📝URLEncoding vs Encode

• URLEncoding
  • GET방식으로 호출할 때 "키=값"으로 데이터를 전달할 때 값에 한글 및 #, $, %, = 등... 특수문자가 들어가는 경우 비정상적으로 동작(예약어 동작 등...)할 수 있기 때문에 URL 인코딩 과정이 필요하다 → 인코딩안하면 영어만 인식할 수 있고 나머지 다 인식못해서 URL 에러나옴 (GET방식의 경우 header의 ContentType 인코딩방식은 문제가 되지 않고 URL 인코딩만 하면 된다)
• Encode
  • 데이터를 보내려면 해당 데이터를 이진데이터로 보내는데 UTF-8 체계를 따라 이진데이터로 만들지에 대한 설정을 합니다 간단히 이야기하면 데이터를 2글자씩 끊어서 보내는 것과 3글자씩 끊어서 보내는 느낌이다

📝자바 API 도큐먼트

자바 라이브러리들을 말합니다.

📝Javac

.java를 컴파일해 바이트코드로 구성된 .class파일로 만드는 컴파일러

📝퍼블리셔

프론트엔드에 반쯤 걸쳐 있는 부분으로 동작까지는 구현하지 않고 레이아웃이나 배치 버튼 색상 등에 대한 디자인에 나온대로 화면만 만드는 거라 생각하면 된다 주 업무는 HTML CSS 중심 업무지만 최근에는 JS도 다루는 사람이 많아졌다

📝프론트엔드

1. 동적인 화면을 구사합니다. 이를테면 사용자가 ID나 Password를 입력했을 때, 그것이 유효한지 확인해야 하는데요. 만약 잘못된 ID를 입력했다면 상황에 따른 알림을 주는 역할도 하게 됩니다.
2. 실제 작동 가능한 웹페이지를 구현합니다. 프론트엔드 개발자는 API를 웹페이지에 적용하고 백엔드와 연동되는 실제 작동 가능한 웹 페이지를 구현하게 됩니다.
3. 크로스 브라우징, 웹페이지의 호환성, 페이지의 개선 등을 맡습니다 단순히 퍼블리싱 하는 것에서 나아가 웹사이트 전반에 대해 관리하고 유지 보수하는 일까지 맡는다고 볼 수 있죠.

요약하자면 HTML, CSS , JS를 이용해 화면을 만드는 사람을 퍼블리셔라고 하고 퍼블리셔 역할을하면서 DB랑 연결하고 홈페이지를 만드는데 쓰이는 언어를 이용해 기능을 넣는 사람을 프론트엔드라고 합니다

📝Bit 단위 

UTF-8 기준으로 영문은 1byte 한글 2byte을 사용한다

• 1Byte = 8 Bit
• 1KByte = 1024Byte
• 1MByte = 1024KByte
• 1GByte = 1024MByte
• 1TByte = 1024GBbyte

2byte → 65536의 이진수 표현가능 (2byte = 16bit → 2^16)

📝리퀘스트

클라이언트가 서비스를 요청하는 것

📝리스펀스

서버에서 요청에 대한 응답을 클라이언트에게 보내주는 것

📝클라이언트

사용자 자신을 지칭할 수도 있고, 사용자의 컴퓨터를 가리키기도 하며 컴퓨터에서 동작하고 있는 프로그램이 될 수도 있다요청하는 쪽이 클라이언트가 되겠죠.

📝서버

서비스 요청에 응하거나 답을 주는 곳이 서버 네트워크 혹은 인터넷으로 확장을 시켜보면 우리가 어느 사이트에 접속을 할 경우 그쪽에서 연결을 허용하고 응답을 해야 연결이 이루어진다

그러면 내 컴퓨터는 클라이언트가 되고 상대 사이트의 컴퓨터가 서버된다

📝크롤링

공개된 웹페이지에서 필요한 부분을 수집하는 방법

📝빅데이터

방대한 데이터를 수집하고 필요한 부분을 추출해 결과를 만드는 것

📝정적웹페이지

코드안에 있는 내용을 그대로 보여줍니다. (코딩내용 - ID : 홍길동) 일시 무조건 홍길동만 뿌려줍니다.

📝동적웹페이지

로그인하면 사용자마다 보여지는 닉네임 등이 다 다른데 이부분은 동적으로 바뀐다 해당 데이터는 DB에서 가져와서 해당 데이터를 화면에 보여줍니다

📝서블릿 (Servlet)

Java언어로 View(HTML)도 만들고 로직도 만들어서 HTML을 반환시켜준다 → 서버에서 HTML 반환

📝JSP

Java Server Page 약자 HTML내에 스크립트 형식으로 자바코드 삽입해 동적 웹페이지를 만드는 것으로 서버에 올려 서버에서 실행시켜 HTML 문서를 만든다 → Servlet으로 만들면 코드가 되게 더럽고 보기도 힘들다 JSP는 해당 문제를 어느정도 해결해준다

📝JSTL

JSP에서도 Servlet의 불편함을 다 해소하진 못하는데 JSTL이라는 외부 라이브러리를 이용해 JSP에 스크립트문을 쓰는게 아닌 태그를 이용한다 (If문, For문 등... 여러가지가 있다 탬플릿 엔진이라고 생각하면 된다)

📝호스팅

업체에서 서버를 제공해서 내가 만든 HTML파일 따위를 사람들이 다른 컴퓨터에서 이용할 수 있게 도와주는 역할(URL로 접속)을 합니다

또한 많은 사람들이 이용할 경우 서버나 포트가 문제가 생길 수도 있는데 그것도 해결해줍니다 → 업체마다 다르겠지만 관리도 해주는 곳도 있다

📝웹호스팅

호스팅업체에서는 서버 한대에 1개의 포트(계정)만 제공해서 여러 업체들이 공유해서 사용하도록 관리해 줍니다.

📝서버호스팅

물리적인 서버(컴퓨터 본체에 해당)을 임대해 사용하는 것을 의미한다 → 직접 가지고 있는 건 아니고 외부에서 서버에 접근해 다양한 소프트웨어 설치 및 서버 배포, 포트 관리 등 다양한 방면에 사용이 가능하다 [그냥 컴퓨터에서 다른 컴퓨터에 접근해서 쓰는 거라 생각하면 됨]

📝웹퍼블리싱

디자인 시안을 기반으로 화면을 구성해내는 것을 의미

📝CSS

HTML에 꾸미기 기능을 넣을 수 있는 스타일 시트언어 입니다

📝아파치톰캣

아파치에서 만든 서버 프로그램으로 기동시 계속적으로 실행중이며 Java로 만든 코드들을 실행시켜주는 역할을 합니다

예를 들면 https://127.0.0.1:8080으로 페이지 접근시 해당 페이지 접근할 때 실행시키게 작성한 Java로 만든 코드를 실행시킵니다

📝JDBC

자바 프로그램 안에서 SQL을 실행하기 위해 데이터베이스를 연결시켜주는 응용프로그램입니다.

📝Web서버 (웹서버)

HTML같은 정적 컨텐츠 처리합니다.

정적 컨텐츠는 어떤 사용자가 이용하던지 바뀌지 않는 화면입니다 [제품 소개서 등...]

정적인 것만 처리할거면 WAS보단 Web서버를 쓰는게 빠르고 안정적입니다

📝was (웹어플리케이션서버) (앱서버) [AP서버]

WAS는 기본적으로 동적 컨텐츠를 제공하기 위해 존재하는 서버입니다.

JSP, PHP , ASP같은 개발 언어를 읽고 처리해줍니다. 예를 들면 톰캣은 JVM이 담아져있어 Java언어를 읽고 처리해준다

동적 컨텐츠라 함은 사용자에 따라 프로필 화면이 다른 것 처럼 DB와 연결되어 데이터를 주고 받거나 프로그램으로 데이터 조작이 필요한 컨텐츠를 의미합니다

현재는 WAS가 가지고 있는 Web Server도 정적인 컨텐츠를 처리하는 데 있어서 성능상 큰 차이가 없다

그런데도 Web Server를 따로 둬서 쓰는 이유는 기능을 분리하여 서버 부하 방지 때문입니다.

WAS는 DB 조회나 다양한 로직을 처리하느라 바쁩니다

만약 정적 컨텐츠 요청까지 WAS가 처리한다면 정적 데이터 처리로 인해 부하가 커지게 되고, 동적 컨텐츠의 처리가 지연됨에 따라 수행 속도가 느려진다. 즉, 이로 인해 페이지 노출 시간이 늘어나게 될 것입니다.

단순한 정적 컨텐츠는 Web Server에서 빠르게 클라이언트에 제공하는 것이 좋습니다.

그렇기 때문에 Web서버와 WAS는 같이 쓰이는게 일반적입니다

📝앱 (Application)

응용 프로그램

예) 카카오톡

📝Web Application 

웹서버 + 앱서버 + 웹브라우저 + DB서버

📝웹시스템 구조 (Web - WAS - DB 구조)

• 효율적 리소스 관리
  • 정적 리소스 많이 사용되면 WEB서버 증설
  • 동적 리소스 많이 사용되면 WAS서버 증설
• WAS서버 또는 DB 장애시 WEB서버에서 오류 페이지 제공 가능
  • 정적 리소스만 제공하는 WEB서버는 잘 안 죽기 때문에 가능
• 선행 처리 가능
  • WEB서버에 SSL 인증서 따위를 두어 항상 먼저 체크하고 들어갈 수 있는 등에 대한 행위 가능