[인터넷DB응용] 웹 서비스의 발전과 모바일 웹 서비스

'모바일'이라는 새로운 웹 접근 환경의 등장

새로운 모바일 웹 환경이 PC를 기반으로 한 데스크톱 웹 환경을 빠르게 대체

 

---

웹 기술의 발전

웹 서비스 제공 방식의 변화

데이터 중심의 웹 -> 서비스 중심의 웹

 

웹 패러다임의 진화

• 웹 1.0
  • 포털 중심의 웹의 시대
  • 일방적으로 정보를 제공

 

• 웹 2.0
  • 플랫폼 중심의 웹 시대
  • 정보의 생성, 공유, 참여가 가능 -> 유튜브나 위키피디아

 

• 웹 3.0
  • 웹이 모든 환경의 플랫폼이 되는 시대
  • 원하는 정보를 찾아 개인별 맞춤 서비스가 가능

 

웹 패러다임의 변화

 

웹 언어의 발전

웹 마크업 언어의 발전

• 마크업
  • 문서 내용 자체가 아닌 내용에 관한 크기와 모양, 표시 위치와 같은 부가적인 정보
• 웹 마크업 언어의 종류

 

HTML5 사양

 

HTML5의 발전 방향

• 웹 브라우저라는 플랫폼 위에서 동작하는 애플리케이션(웹앱)을 HTML과 CSS, 자바스크립트 언어로 만들 수 있도록 하는 것
• 애플리케이션으로 동작하기 위해 필요한 기능들을 API 형태로 제공하도록 확장됨
• CSS3도 단순 화면 구성이 아닌 애플리케이션에 맞는 세련된 화면과 화면 움직임을 제공하도록 확장됨
• 자바스크립트는 단순한 HTML 문서의 조작 수준을 넘어 다양한 HTML5 API를 활용하고 제어하며 통신하는 역할로 확대됨
• 웹 페이지의 구성 요소

 

 

---

데스크톱 웹과 모바일 웹

데스크톱 웹

• 웹 환경을 이야기할 때 말하는 보통의 웹

 

모바일 웹

• 태블릿, 스마트폰 등의 모바일 브라우저로 접속하도록 만들어진 웹 페이지
• 일반적인 웹 사이트를 모바일 환경으로 그대로 옮긴 형태

 

데스크톱 웹과 모바일 웹은 구분되고 각기 다른 관점에서 개발되어야 함

• 모바일 장치에서 데스크톱 웹을 실행시키면 화면 해상도가 달라서 제대로 보기가 어려움
• 웹 페이지를 작성할 때 모바일 장치의 환경에 맞춰 화면을 구성해야 함

 

---

모바일 앱

앱

• 애플리케이션의 줄임말
• 모바일 기기에서 실행되는 응용 프로그램
• 데스크톱 환경의 응용 프로그램(애플리케이션)과 구분하기 위한 용어

 

모바일 프로그래밍 방식의 변화

• 초기 모바일 프로그래밍(네이티브 앱 방식)
  • 기존 서버 중심의 웹 프로그래밍 -> 새롭게 안드로이드나 아이폰 프로그래밍 기술을 습득해야 했음
  • ASP, JSP, PHP -> Object-C나 Java를 새로 익혀 사용
• 최근 '웹의 반격'이 시작됨(웹 앱, 하이브리드 앱)
  • 기존 웹 기술을 가지고 모바일 장치의 애플리케이션과 유사한 특성을 갖는 프로그램의 개발이 가능해짐
  • 전통적인 웹 기술(HTML5와 CSS3)의 발전 + 새로운 프레임워크 기술(제이쿼리 모바일, 폰갭)의 등장

 

---

모바일 앱의 개발 방식

네이티브앱

 

• 네이티브 언어를 사용하여 개발된 모바일 장치에 최적화된 애플리케이션
• 각 플랫폼 전용의 개발 도구(언어)와 SDK(Software Development Kit)를  이용하여 개발
• 아이폰(XCode와 Object-C), 안드로이드폰(자바 ), 윈도폰(C# )

 

특징

• 카메라, 스피커, GPS 등의 장치들을 직접 제어할 수 있고 효율성이 높음
• 각 플랫폼 별로 다른 프로그래밍 언어를 익혀서 앱을 개발해야 함

 

장점

• 각 플랫폼에 최적화되어 실행 속도가 빠르다.
• 스마트폰 안의 모든 장치(하드웨어, 소프트웨어) 접근이 가능하며 정교한 UI 개발이 가능하다.
• 앱 마켓을 통해 등록함으로써 수익 얻기가 쉽다.

 

단점

• 개발 기간이 길고 많은 비용이 소요된다.
• 각 플랫폼 별로 별도의 버전을 다른 언어로 매번 개발해야 한다.
• 앱 마켓을 통해 배포되므로 갱신이나 유지보수가 복잡하고 어렵다.

 

웹앱

 

• 웹 기술로 개발하지만 겉모양은 네이티브앱처럼 보이는 애플리케이션
• 모바일 브라우저를 통해서 동작하면서도 네이티브앱과 비슷한 화면과 터치 관련 사용자 경험(UX)을 제공

 

특징

• 기존의 웹 개발 기술을 그대로 활용할 수 있음
• 기기에 상관없이 한 번 개발하면 어떤 환경에도 적용할 수 있음

 

장점

• 기존의 표준 웹 기술을 사용하므로 단기간에 빠르고 쉽게 개발할 수 있다. 
• 웹 브라우저만 있으면 다양한 장치와 플랫폼에서 동일하게 실행 가능하다.
• 웹 브라우저를 통해 배포되므로 갱신이나 유지보수가 쉽다.

 

단점

• 웹 페이지 내용이 많을 경우, 성능 문제가 발생할 수 있다.
• 모바일 장치에 대한 제어가 제한적이며 코드 효율성이 낮다.
• 적용할 수 있는 UI에 한계가 있다.

 

하이브리드앱

 

• 네이티브앱과 웹앱의 장점을 결합한 애플리케이션
• 대부분의 기능은 웹 기술로 개발하고 최소한의 기능만 네이티브 기술로 구현

 

특징

• 표준 웹 기술로 웹앱을 개발하고 이를 다시 네이티브앱으로 변환한 다음 배포하는 방식
• 크로스 프레임워크(cross framework)를 사용하여 웹 페이지를 애플리케이션으로 변환하거나 애플리케이션처럼 독립적으로 실행할 수 있음

 

장점

• 다양한 플랫폼을 위한 앱 개발 및 유지보수 비용이 낮다.
• 장치 접근도 가능하고 앱 마켓을 통해 등록, 배포할 수 있다.

 

단점

• 네이티브앱에 비해 실행 속도가 느리다.
• 자유로운 UI 구현에 한계가 있다.