웹브라우저
- HTML을 비롯하여 이미지, 멀티미디어 파일등의 문서를 월드와이드웹을 기반으로 연결하기 위한 응용 프로그램(Application Program)
- HTML은 마크업언어로 변수수정, 조건분기가 불가하며 웹브라우저를 만나야만 렌더링되어 동작된다
- 현재 html5가 표준이며, 웹 페이지소스에서 <!doctype html>을 확인할 수 있다면 html5로 작성된 것을 알 수 있음.
- 그외 legacy로 html4, xtml 등이 있음. : <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional...
- HTTP프로토콜을 기반으로 통신하며 사용자의 동작에 따라 HTTP method를 실행하여 OS에 전송을 요청하는 역할을 함
웹표준
- 웹접근성(장애인의 사용성)을준수하고 수준을 높이는 것은 웹 표준을 지킴으로서 달성가능함
- ex) tap키를 통해서 웹화면이 잘 선택이 되는지
- 웹브라우저의 다양화로 크로스 플랫폼을 지향하는 웹서비스는 각 브라우저의 엔진에 잘 작동되어야한다.
- 브라우저 : 엔진 - IE : 트라이던트, 엣지 크롬 : blink, 사파리 : Webkit, 파이어폭스 : Gecko
- 나아가, 모바일 브라우저의 등장으로 다양한 기종에 따른 화면을 구성하는 작업이 필요하여 백엔드와 프론트엔드가 나눠지기 시작함.
- 프론트앤드의 주 개발도구는 크롬이며 F12로 다양한 디스플레이 환경을 보여준다.
프론트엔드 백엔드 프로그래밍
- 프론트엔드 개발은 웹브라우저 내에서의 동작과 데이터처리의 범위를 지칭함. 문서를 HTML을 통해서 아웃라인을 잡고 CSS로 디자인을 입히고 Javascript로 이펙트와 데이터 처리에 대한 업무를 진행함.
- 사용기술 : jQuery(라이브러리. 과거 표준이며, 현재 웹상 많은 자료로 일부 쓰이기도함), Angular (구글에서 배포, mvc모델 기본), React (페이스북과 인스타에서 사용, 현재 주류), vue.js (러닝커브가 적은 프레임워크)
- 백엔드 개발은 웹브라우저를 넘어서 네트워크를 타고 후면에 존재하는 웹서버와 데이터베이스를 사용하 조건과 로직에 맞게 데이터를 쓰고 읽고 수정하고 삭제하는 일을 함.
- 사용기술 : PHP(C언어 스타일), ASP - ASP.net(MS사의 C#, VB.net), JSP(Java), Django(Python) 루비온레일(루비) Node.js(Javascript) 등이 있다.
웹기술
비즈니스 업무 기반은 데이터와 처리하는 로직으로 구성됨. 데이터의 처리, 데이터의 입력과 출력 창구를 담당하는 것이 웹임.
웹 서버
웹 서버는 정적 리소스(HTML, CSS, JS, 이미지, 영상 등)를 클라이언트(브라우저)에 제공하는 역할을 수행합니다. 클라이언트 요청을 받아 정적 파일을 전달하거나, 경우에 따라 다른 서버(WAS)로 요청을 전달(프록시 역할)하기도 합니다.
주요 웹서버 종류
- Apache HTTP Server : 오픈소스 웹 서버로 가장 널리 사용됨. 동적 콘텐츠는 WAS와 연동하거나 프록시 서버로 설정 가능.
- NGINX : 경량화되고 고성능을 목표로 설계된 웹 서버. 비동기 이벤트 기반 아키텍처를 채택해 높은 트래픽을 효율적으로 처리. 웹 서버뿐만 아니라 리버스 프록시, 로드 밸런서, HTTP 캐시 서버로도 활용 가능.
동적으로 생성되는 컨텐츠
- 정적 페이지(템플릿)는 기본적인 HTML 구조를 정의합니다. 동적인 컨텐츠는 API 요청을 통해 WAS로부터 데이터를 받아오고 화면에 렌더링합니다.
- SSR: 서버(WAS)가 동적인 데이터를 WAS 내의 HTML 템플릿 파일(JSP, Thymeleaf 등)에 포함한 뒤 클라이언트로 보냄. 단, 다른 정적 파일(CSS, JS 등)은 별도의 웹 서버나 CDN에서 서빙
- CSR: 클라이언트 브라우저가 JS를 실행해 WAS로부터 데이터를 받아 클라이언트에서 스스로 화면을 렌더링.
- SSR은 서버에서 완성된 HTML을 반환하므로, 검색 엔진 크롤러가 콘텐츠를 쉽게 읽을 수 있습니다.
- CSR 방식은 클라이언트가 JS를 다운로드하고 실행하기까지 빈 페이지를 보여줄 수 있어 초기 로드가 느려질 수 있습니다.
- CSR은 빌드된 정적 파일을 CDN에서 제공하므로, 독립성, 성능과 확장성이 높음.
- 리버스 프록시 : 클라이언트 요청을 받아 다른 서버로 전달하고, 그 서버에서 받은 응답을 클라이언트에 반환하는 중간 서버 역할.
- 로드 밸런싱: 여러 서버에 요청을 분배하여 부하를 분산,
- SSL 종료: HTTPS 요청을 처리하고 내부적으로 HTTP로 전달.
- 캐싱: 자주 요청되는 콘텐츠를 캐싱하여 응답 속도 향상.
웹 어플리케이션 Web Application Server, 앱(WAS)
WAS는 동적인 온디멘드 구현을 담당. 웹 애플리케이션 요청을 처리하고 비즈니스 로직을 수행하는 서버입니다. WAS는 HTTP 요청을 받아 애플리케이션 코드를 실행하고 응답을 반환합니다.
- 과거: WAS는 동적 웹 문서 생성과 정적 리소스 제공을 모두 담당하며 서버 중심의 렌더링(SSR)을 수행.
- 동적으로 DB를 조회하고 변환, 웹문서를 로직대로 변경해서 재출력하는 서버이다. 웹앱은 동적인 웹문서 뿐만아니라 웹서버처럼 정적인 웹문서 역시 처리할 수 있다.
- 현재: WAS는 주로 API 서버로 동작하며 비즈니스 로직과 데이터 처리를 담당, 정적 리소스는 CDN이나 웹 서버가 처리.
웹서버와 웹어플리케이션의 분리
- WAS는 여러가지 복잡한 어플리케이션 로직이 존재하기때문에 쉽게 서버가 다운될 수 있다. 그러므로 정적인파일을 담당하는 서버와 동적인 파일을 담당하는 서버를 분리시켜야 WAS가 다운되더라도 웹페이지에 접속자체가 안되는 불상사를 막을 수 있음.
- 정적인 자원은 web서버 증설, 동적인 자원은 was서버 증설로 효율적자원분배
주요 WAS 종류
- Tomcat : 가장 널리 사용되는 Java 기반 WAS. 서블릿, JSP 등을 지원.Spring Boot의 기본 내장 WAS로도 사용 가능.
- Jetty : 경량화된 Java 기반 WAS. 속도와 유연성이 뛰어나며 IoT나 임베디드 시스템에 적합.
- Undertow : 경량화된 WAS로 비동기 HTTP 처리에 강점. Spring Boot에서 선택적으로 사용 가능.
주요 기능:
- HTTP 요청/응답 처리: : 클라이언트의 요청(예: URL 호출)을 받아 적절한 응답을 생성합니다.
- 서블릿 컨테이너 역할: : Java EE 표준에 따라 서블릿(Servlet), JSP, Spring 애플리케이션 등을 실행합니다.
- 세션 및 상태 관리: 클라이언트의 상태(Session)을 관리하여 로그인 유지나 쇼핑 카트 등 기능 지원.
- 보안 기능 : HTTPS, 인증 및 권한 부여 관리.
- 스레드 관리 : 여러 사용자의 동시 요청을 처리하기 위해 스레드를 생성 및 관리합니다.
서블릿 내용 정리
- 서블릿이란?
- 1997년 도입, 서블릿은 자바 클래스 중 하나로, TCP/IP 통신구현 및 HTTP Parsing을 통해서 Request와 Responsde 객체를 생성하여 수신정보를 기반으로 회신정보를 넣어서 송신하는 객체이다.
- 개발자의 공통과정인 TCP/IP와 HTTP 통신의 상세하게 고려하지 않고 비즈니스 로직구현에만 신경쓸 수 있도록 도와준다.
- 동적 HTML 생성:
- 응답(Response) 객체에 out.write() 메서드로 HTML을 한 줄씩 작성하여 동적 페이지 생성 가능.
- 하지만, HTML 코드 작성이 번거롭고 비효율적.
- 단, out객체에 write method를 사용해서 html문을 한줄 한줄 입력해야해서 개발자가 직업 html 생성이 어려움
- 서블릿 컨테이너
- 서블릿을 실행하고 관리하는 서버 프로그램(예: Tomcat).
- 톰캣과 같은 서버 프로그램 내에는 서블릿을 자동으로 생성해주는 서블린 컨테이너가 있음, J
- SP도 서블릿으로 변환 되어서 사용됨, 그 외 동시 요청을 위한 멀티 쓰레드 처리 지원.
- 서블릿과 Spring MVC의 관계
- 서블릿은 Spring MVC의 기반 기술로 작동하며, 요청과 응답을 처리하는 역할을 담당.
- Spring MVC는 DispatcherServlet이라는 특별한 서블릿을 통해 요청을 처리.
- 서블릿 컨테이너(Tomcat)는 클라이언트 요청을 DispatcherServlet으로 전달.
- DispatcherServlet은 요청을 스프링의 컨트롤러로 전달하여 비즈니스 로직을 실행.
- 스프링 MVC 내에서 서블릿 컨테이너는 주로 요청과 응답을 처리하고, 이를 스프링 프레임워크로 전달하는 역할을 하며, 실제 애플리케이션의 로직은 스프링이 담당한다고 보면 됩니다.
- MVC 패턴,Spring MVC
- MVC 패턴 자동화, 복잡한 웹 기술을 편리하게 사용할 수 있는 다양한 기능 지, 서블릿, JSP 조합 MVC 패턴 사용, 모델, 뷰 컨트롤러로 역할을 나누어 개발
JSP
- 1999년 도입됨. 최근에는 타임리프를 주력으로 많이 씀.
- JSP : Java를 이용한 서버 사이드 템플릿 엔진이다. JSP는 자바를 웹서버에서 쉽게 쓰기 위한 기술이며 언어가 아니다. 동적인 java와 정적인 html을 융합시킨 파일로 html과 <%, %> 해당 꺽쇠 안의 내용은 동적인 내용이 표시된다.
- 이 JSP 파일을 Servlet 자바소스로 클래스로 변환하고 컴파일 역할을 하는 프로그램을 JSP 컨테이너라 하며 컴파일된 서블릿 클래스 파일을 실제로 실행하는 프로그램은 서블릿 컨테이너 혹은 웹 컨테이너라고 부른다. 대표적인 것으로 Tomcat. 하나의 JSP 페이지가 하나의 Java 클래스이기 때문에 모든 Java 라이브러리를 끌어다 쓸 수 있다.
- 단, 서블릿과 달리, JSP는 HTML 생성은 편리하지만, 하나의 파일 내에 html 화면표시와 중간의 비즈니스 로직까지 한꺼번에 너무 많은 역할을 담당하여 유지보수와 가독성이 어려움
스프링(Spring Framework)
스프링은 웹 개발에서 톰캣(Tomcat) 같은 WAS(Web Application Server)를 내장하고, 이를 추상화하여 개발자가 비즈니스 로직 구현에 집중할 수 있도록 돕는 도구라고 볼 수 있습니다.
1) 웹 통신과 관련된 기술 추상화
- 스프링은 HTTP 요청/응답, 세션 관리, 서블릿 처리 등 웹 통신의 복잡한 작업을 추상화합니다.
- 예를 들어, 개발자는 Spring MVC의 컨트롤러(Controller)에서 요청/응답 처리에 집중하고, 나머지 작업은 스프링이 알아서 처리:
- 클라이언트 요청 → DispatcherServlet → 컨트롤러 → 서비스 → 응답 반환.
2) 개발 생산성 향상
- 스프링은 의존성 주입(DI), 트랜잭션 관리, 데이터 접근 계층 추상화(JPA) 등 다양한 기능을 제공하여 개발자가 반복적이고 복잡한 작업에서 벗어나 비즈니스 로직 구현에 집중할 수 있도록 돕습니다.
3) 내장 WAS 지원 (Spring Boot)
- 스프링 부트(Spring Boot)는 톰캣(Tomcat), Jetty, Undertow 같은 WAS를 내장하고 있어, 별도의 WAS 설치 없이 실행 가능합니다. 개발자가 java -jar 명령으로 애플리케이션을 실행하면 내장된 톰캣이 자동으로 시작되고, HTTP 요청을 처리합니다.이를 통해 개발 환경과 배포 환경이 간단해지고, 설정 작업이 줄어듭니다.
- 과거에는 서버에 WAS를 직접 설치하고, 소스는 War 파일을 만들어서 설치한 WAS에 배포
'개발기술 > Web Dev' 카테고리의 다른 글
NGNIX 사용 (0) | 2025.03.07 |
---|---|
RESTFUL API 설계 (0) | 2024.12.15 |
Interception , Filter (0) | 2024.09.05 |
프론트엔드 연계 관련 지식 (0) | 2024.07.08 |
외부 API 활용 (Pure Java, Webclient, 최적화)과 직렬화/역직렬화 Parsing (0) | 2024.07.03 |