Library vs Framework

Library 라이브러리란? 쉽게 비유하자면 톱, 망치, 삽 같은 연장(도구) 이다. 사람들이 도구를 사용하여 작업을 할 수 있습니다. 이때 어떤 도구를 사용하든 사용자가 원하는 것을 만들어 줄 수만 있으면 된다. 예를 들어 톱이 아닌 망치를 이용해 나무판자를 자를 수 있다. Framework 프레임워크란?차, 비행기, 배와 같은 탈 것, 운송 수단이다. 하늘을 날려면 비행기를 타야하고, 도로를 달리려면 자동차가 훨씬 유용하다.그 목적에 맞게 만들어졌기 때문에 톱이나 망치를 이용해 운송 수단을 직접 만들 필요를 없게 한다. 하지만 정해진 규칙에 따라 시동을 걸고, 기어를 제어하고, 핸들을 돌려야 한다.즉, 라이브러리와는 달리 프레임워크는 이미 프로그래밍할 규칙이 정해져 있음을 뜻한다.프레임워크의 사전적 ..

  • format_list_bulleted HTML
  • · 2025. 3. 16.
  • textsms
SPA(Single Page Appliaction)

SPA(Single Page Appliaction)

SPA 란? Single Page Appliaction(이하 SPA)은 전통적인 Multi Page Appliaction(이하 MPA)과 다르다. 가장 큰 차이점은 SPA 내비게이션은 단 하나의 웹 페이지에서 이루어진다는 점이다. 기존 웹 서비스는 요청 시마다 서버로부터 리소스들과 데이터를 해석하고 화면에 렌더링하는 방식이다.SPA형태는 브라우저에 최초에 한 번 페이지 전체를 로드하고, 이후부터는 특정 부분만 Ajax를 통해 데이터를 바인딩하는 방식이다. 전통적인 페이지 vs 단일 페이지 애플리케이션 비교 예전부터 개발자들은 지속적으로 웹 서비스와 개발 방식을 발전시켜왔다. CSS, JS 리소스 등을 CDN 형태로 캐싱 및 압축하고, View에서 템플릿엔진 들을 사용하고, 초기의 SPA 개념인 Backb..

  • format_list_bulleted HTML
  • · 2025. 3. 16.
  • textsms

Virtual DOM

DOM은 문서 객체 모델이라고 하는데 결국은 브라우저에서 다룰 HTML 문서를 파싱하여 "문서의 구성 요소들을 객체로 구조화하여 나타낸 것"이다. DOM은 HTML Elements, Attributes, CSS style, Events, Methods 등을 제어할 수 있는 표준 인터페이스를 제공한다. 요약하면 웹 페이지를 구성하는 요소를 구조화해서 나타낸 객체이며 이 객체를 이용해서 웹 페이지 구성 요소를 제어할 수 있다. Virtual DOMVirtual DOM은 DOM을 추상화하였고, 가상의 객체라 표현한다. 어떤 문제를 해결하기 위한 기술인가?DOM 조작에 의한 렌더링이 비효율적인 문제SPA(Single Page Application) 특징으로 DOM 복잡도 증가에 따른 최적화 및 유지 보수가 더 ..

  • format_list_bulleted HTML
  • · 2025. 3. 16.
  • textsms

BOM(Browser Object Model)

브라우저 객체 모델(Browser Object Model) Brower 객체Window : 모든 객체가 소속된 객체이며, 브라우저 창을 의미한다.document : 현재 문서에 대한 정보를 갖고 있는 객체이다.history : 현재의 브라우저가 접근했던 URL history를 제어할 수 있다.location : 문서의 주소와 관련된 객체로 window 객체의 프로퍼티인 동시에 document의 프로퍼티이다. 이 객체를 이용하여 윈도우의 문서 URL을 변경할 수 있고, 문서의 위치와 관련해서 다양한 정보를 얻을 수 있다.screen : 사용자의 디스플레이 화면에 대한 다양한 정보를 갖고 있는 객체이다.navigator : 실행 중인 애플리케이션(브라우저)에 대한 정보를 알 수 있다. 크로스 브라우징 이슈를..

  • format_list_bulleted HTML
  • · 2025. 3. 16.
  • textsms
SEO(Search Engine Optimization)

SEO(Search Engine Optimization)

SEOSEO(Search Engine Optimization)은 검색 엔진에 맞게 자신의 콘텐츠를 검색 사이트 상단에 위치시키는 작업을 말한다.포털 사이트에서 대부분 검색 엔진을 가지고 있는데, 검색 엔진은 크롤링(Crawling, 관련 데이터를 가져오는 과정)과 인덱싱(Indexing, 크롤링을 통해 얻은 정보를 검색 색인에 저장함)한 정보를 카테고리화하여 저장 및 표현한다.각 검색 엔진은 사용자가 '검색'을 누르면, 카테고리화된 수 많은 정보를 알고리즘에 따라 분류하여 정보를 나타냅니다. Technical SEO검색 엔진이 자사의 홈페이지를 쉽게 찾을 수 있도록 개발자와 협업하여 홈페이지를 만든다.도메인 관리 : 하나의 도메인을 여러 웹 사이트 주소로 나눠 노출하는 횟수를 늘리는 방식이다.'서브 도메..

  • format_list_bulleted HTML
  • · 2025. 3. 16.
  • textsms

DTD(Document Type Declaration)

문서 형식 선언DTD(Document Type Declaration) 또는 DOCTYPE이라고 한다.어떤 SGML이나 XML(SGML에서 파생된 언어) 기반 문서 내에 그 문서가 특정 문서 형식 정의(DTD)를 따름을 지정하는 것이다.본래 DTD에 기반한 SGML 도구를 이용해 문서 해석 가능성과 유효성을 검사하기 위한 목적으로 문서 내에 삽입되었다.HTML 문서의 규격 판 번호를 명시하는 데서 흔히 볼 수 있다. 웹 브라우저는 문서 형식 선언이 없는 HTML 문서를 쿼크 모드로 렌더링하지만 문서 형식 선언이 있는 HTML 문서를 표준 모드로 렌더링하기 때문에, 문서 형식 선언을 이용해서 어떤 웹 페이지가 모든 웹 브라우저에서 같은 레이아웃으로 제공되도록 할 수 있다. 또한 HTML5은 구조적으로 SGM..

  • format_list_bulleted HTML
  • · 2025. 3. 16.
  • textsms