CSS Framework 실습

최대 1 분 소요

Insert CSS

  • Inline CSS
    • 하나의 특정 element에만 스타일을 적용
    • style 속성 사용
  • Internal CSS
    • 한 페이지 내 여러 elements에 같은 스타일 적용
    • <style> 태그 사용
  • External CSS
    • 여러 페이지에서 사용하는 스타일을 하나의 파일로 생성
    • <link>로 참조하여 사용

Insert JS

  • Inline JS
    • 하나의 특정 element에 이벤트 추가
    • 직접 코딩으로 사용
  • Internal Js
    • 한 페이지 내 <script> 태그를 사용
    • 여러 elements에서 사용 가능
  • External JS
    • 여러 페이지에서 사용하는 JS를 하나의 파일로 생성
    • <script> 태그 참조

CSS Frameworks

  • 반응형
  • 모바일 웹 프로젝트 개발을 위한 프레임워크
  • 미리 정의된 디자인과 HTML, CSS, JS를 제공
  • Front-end 웹페이지를 빠르게 제작 가능
  • 전체 기능 중 10%를 사용한다면 불필요한 90%도 로딩해야함 (무거운 프레임워크)
  • 프레임워크 사용을 위한 학습 필요
  • Ex) Bootstrap, Foundation,…

JS Frontend framework

  • 체계적인 코드관리 -> 유지보수 용이
  • 기본설계 및 다양한 라이브러리 제공 -> 개발 생산성 향상
  • 코드 재사용성, 추상화 코드 사용 -> 확장성
  • 학습난이도가 높음
  • 사용하지 않는 기능 라이브러리도 포함하여 로딩
  • 자유로운 개발의 어려움
  • Ex) jQuery, React, angular, Vue.js…

카테고리:

업데이트: