Semantic HTML 웹 표준에서는 HTML을 시멘틱(semantic)하게 작성하는 것의 중요성을 강조한다. 그렇다면 시멘틱 HTML이 어떤 의미일까? 시멘틱 HTML은 영단어인 semantic과 HTML의 합성어이고, 각 단어의 의미는 다음과 같다. semantic: 의미의, 의미가 있는 이라는 뜻의 영단어 HTML: 화면의 구조를 만드는 마크업 언어 시멘틱 HTML의 필요성 개발자 간 소통 검색 효율성 웹 접근성 자주 사용되는 시멘틱 요소의 종류 페이지나 요소의 최상단에 위치하는 머리말 역할의 요소 메뉴, 목차 등에 사용되는 요소 문서와 연관은 있지만, 직접적인 연관은 없는 내용을 담는 요소 이름 그대로 문서의 메인이 되는 주요 콘텐츠를 담는 요소 게시글, 뉴스 기사 등 독립적으로 구분해 재사용할..

UI 사람들이 컴퓨터와 상호 작용하는 시스템 화면상의 그래픽 요소들 외에도 컴퓨터와 상호작용을 위한 시스템인 키보드, 마우스 등의 물리적 요소. UX 사용자가 어떤 시스템, 제품, 서비스를 직 간접적으로 이용하면서 느끼고 생각하는 총체적 경험 서비스 그 자체에 대한 경험. 홍보, 접근성, 사후처리 등 말 그대로 총체적 경험. 프론트엔드에서 UX에 가장 영향을 많이 끼치는 것은 UI 만약 홈페이지가 정렬도 안되어있고, 글자 크기도 뒤죽박죽이면 UX가 좋지 않다. UI UX 차이점 UX는 UI를 포함한다. UI UX는 서로 보완하는 역할 UX가 좋지 않은 곳을 찾아냄으로 UI개선점을 찾아낼 수 있고, UI를 개선함으로 UX가 좋아지기도 함

MVC 패턴이란? MVC 패턴은 소프트웨어 디자인 패턴 중 하나로, Model-View-Controller의 약어입니다. 이 패턴은 소프트웨어의 구성 요소들을 세 가지 역할로 분리하여 각각의 역할에 따라 코드를 작성하고 유지보수할 수 있게끔 합니다. Model: 데이터와 데이터를 처리하는 로직을 담당합니다. View: 사용자 인터페이스(UI)를 담당합니다. Controller: Model과 View를 연결하여 사용자의 입력에 따라 데이터를 업데이트하고 UI를 갱신합니다. 사용자가 Controller를 조작하면 Controller는 Model을 통해 데이터를 가져오고 그 데이터를 바탕으로 View를 통해 시각적 표현을 제어하여 사용자에게 전달하게 됩니다. 이러한 패턴을 성공적으로 사용하면, 사용자 인터페이..

MPA MPA (multi page application)는 여러 페이지로 구성된 웹 어플리케이션입니다. 사용자의 클릭과 같이 인터렉션이 발생할 때마다 서버로부터 새로운 html을 받아와서 해당 링크로 이동하여 페이지 전체를 새로 렌더링하는 전통적인 웹 페이지 구성 방식입니다. SPA SPA (Single Page Application)는 하나의 페이지로 구성된 웹 어플리케이션입니다. 브라우저에 최초에 한번 페이지 전체를 로드하고, 이후부터는 특정 부분만 Ajax를 통해 데이터를 바인딩하는 방식입니다. SPA는 현재 웹 개발의 트랜드로 볼 수 있고 react, vue, 앵귤러와 같은 자바스크립트 프레임워크등이 SPA의 방식을 가지고 있습니다. CSR CSR (Client Side Rendering)은 렌..