[Terminology] WebApp, HybridApp, Responsive App, Platform, Framework...

<분류>
A. 수단
- OS/Platform/Tool : Linux, Kubernetes(k8s), Docker, AWS
- Package Manager : node.js, yarn, brew, 
- Compiler/Transpillar : React, Nvcc, gcc/g++, Babel, Flutter
- Module Bundler  : React, Webpack, Parcel

B. 언어
- C/C++, python, Javacsript, Typescript, Go-Lang, CUDA, Dart, HTML/CSS

C. 라이브러리 및 프레임워크 및 SDK
- OpenCV, OpenCL, FastAPI, PyTorch, Tensorflow, Nsight

 

---

1. What? (현상)

프론트 및 다양한 개발을 하다가 보면 세가지가 헷갈립니다.

• 웹앱, 하이브리드 앱 등 앱과 웹을 정의하는 용어에 대한 용어
• 웹 디자인 시의 반응형 웹, Interactive 웹 등에 대한 용어
• 소프트웨어 개발에 필요한 플랫폼, 프레임워크 등에 대한 용어

---

2. Why? (원인)

• 정리해봅니다.

---

3. How? (해결책)

• 앱, 웹 종류
  • 모바일 웹(Mobile Web) : 웹 브라우저로 실행하는 웹 페이지. 
  • 웹 앱(Web App) : 웹 브라우저로 실행하며, SPA 형태로 앱과 같이 최적화하여 동작하는 웹페이지
  • 하이브리드 앱(Hybrid App) : 앱으로 실행하며, 모바일 웹앱을 패키징 한것입니다. 
    - Webview기반 App : 웹 위주로 구성, 앱은 꼭 필요한 부분만 사용
    - Appview 기반 App : 네이티브위주, 일부 컨텐츠만 웹화면 구성
  • 네이티브 앱(Native App) : 앱으로 실행하며, 최적화된 네이티브 언어가 존재합니다.

• 웹 디자인
  • Responsive(반응형) Web Design : 다양한 기기와 다양한 browser screen size로 인해 변경
    (Frontend에서 MediaQuery를 통해 하나의 템플릿으로 대응)
  • Adaptive(적응형) Web Design : 다양한 기기(스마트폰, PC, 태블릿)에 맞게 해상도 및 레이아웃이 변경
    (Backend에서 기기를 detect 해 다양한 템플릿을으로 대응)
  • Interactive Web Design : Event를 통해 User의 요청에 동적인 결과를 가져다주는 비동기식 구현 방식
  • Reactive Programming :  데이터의 흐름을 먼저 정의하면 데이터의 변화 혹은 작업의 종료에 따라 반응하여 진행되는 프로그래밍. 객체 지향의 패러다임. 앞의 내용의 상위 개념.
• 개발 도구
  • 플랫폼(Platform) : 소프트웨어 개발에서 App이 동작하는 환경을 제공하는 것.
    • 안드로이드, 윈도우, ios등의 운영체제를 포함하여 네이버, 야후나 구글 플레이스토어, 애플 앱스토어, 유니티 에셋스토어처럼 수요와 공급이 만날 수 있도록 제공된 공간
    • 플랫폼은 OS와 하드웨어를 통칭하는 말 혹은 OS 자체로도 사용되기도 한다. 하지만 명확히는 조금 다릅니다.
      ** OS : 하드웨어 자원 관리를 맡고 있는 소프트웨어이며, 확장된 기능과 데이터 해석등은 App과 프레임워크가 담당
    • ex) Windows, Linux, macOS 등의 OS
    • ex) Kubernetes, Docker 등의 오픈소스 플랫폼
    • ex) App Store, Google Play 등의 서비스 플랫폼
  • 프레임워크(Framework) : 정의된 API를 제공하는 Software Library의 모음
    
    • 그자체로 완벽히 동작할 수 있는 App이라 코딩을 할필요가 없는 경우이며, default로 작업하는 일을 가지고 있고, 이 중에 가능한 것을 재정의 하는 것이 사용자의 역할입니다.
    • 플랫폼과 관계는, 사용자가 작성한 코드가 없더라도 동작하는데 문제가 없으며, 환경을 플랫폼과 OS에서 제공받습니다.
    • ex) Spring(java), Django(python), Angular.js(Javascript) 등의 웹 프레임워크
    • ex) PyTorch, Tensorflow 등의 딥러닝 프레임워크
  • SDK(Software Development Kit) : 프로그래머들이 개발할 수 있도록 제공하는 도구.
    •  소프트웨어 개발 도구 모음. SDK안에는 개발에 도움이 될 Debugger, API, IDE, 문서, 라이브러리, 코드 샘플 및 기타 유틸리티 등이 있다.
    • SDK는 라이브러리, 프레임워크, 툴 등의 상위 개념입니다.
    • ex) Android SDK, JDK, IOS SDK, NET Framework SDK, Facebook SDK ...
  • 라이브러리(Library) : 여러가지 패키지와 모듈을 기능단위로 모아 놓은 것
    • ex) jQuery, OpenCV
  • 패키지(Package) : 특정 기능과 관련된 여러 모듈을 폴더단위로 관리하는 것
  • 모듈(Module) : 함수, 변수, 클래스 등을 모아 놓은 것 

[플랫폼, 프레임워크, 라이브러리 구조 예시]

---

https://m.blog.naver.com/knix008/221034069747