🍀컴파일 방식의 실행 속도 고급 언어로 작성된 코드 ⇒ 기계어로 한꺼번에 바꾸는 방식 빌드 : 기계어 코드 조각을 하나로 합치고 프로그램 실행을 위한 준비 작업을 하는 과정 ▶ 컴파일 방식은 한번 빌드하면 다시 실행할 때 빠르게 실행 그러나 수정하는 경우 다시 빌드해야함
🍀인터프리터 방식의 실행 속도 코드를 한 줄씩 번역하므로 컴파일 방식보다 실행 속도가 느림 ⇒ GPU 제어 기능(그래픽 카드를 이용해 복잡할 계산을 병렬 처리)으로 단점 극복
3. 프로그래밍 언어 버전의 중요성
오래된 버전으로 개발 ⇒ 기술 부채가 쌓임.
기술 부채 : 당장 빠르고 편한 방법을 채택함으로써 발생하는 추가적인 재작업 비용
▶기술 부채가 쌓이는 상황을 막으려면 최신 버전에 가까운 안정적인 버전을 선택 ⇒ LTS 버전
2. 프론트엔드 개발 언어 : HTML, CSS, 자바스크립트
1. HTML
HTML 태그
<태그명> 내용</태그명> ⇒ 마크업 언어 : 태그를 이용해 문서의 구조를 나타내는 언어
1️⃣ <head> : HTML 문서 자체에 대한 정보를 작성하는 태그 2️⃣ <meta> : HTML 문서에 대한 메타데이터(기본 정보)를 제공하는 역할 3️⃣ <title> : HTML 문서의 제목을 기록하는 태그 4️⃣ <h1>~<h6> : 콘텐츠의 제목 5️⃣ <p> : 본문 작성 6️⃣ <strong>, <i> : 본문 내용 중 문장이나 단어 강조 7️⃣ <ul>,<li> : 목록 표현 8️⃣ <table> : 표 삽입 9️⃣ <a> : 링크를 거는 태그 시멘틱 태그 : 태그만 보고도 웹 페이지를 구성하는 요소의 의미와 구조를 이해
🍀시맨틱 태그의 이점
SEO 최적화 : 검색 엔진이 태그의 목적에 부합하게 설계되어 있는 구조의 사이트를 더욱 빨리 효율적으로 정보를 파악할 수 있어 검색 결과의 노출에 유리하게
웹 접근성 : 스크린 리더와 같은 환경에서는 웹 접근성과 사용성을 향상
유지 보수 : 태그의 이름만 보고도 어떤 영역인지 바로 확인이 가능 ⇒ 해당 태그 역역의 특성에 맞는 작업을 구분하여 진행하기 용이
🍀시맨틱 태그의 종류
index.html 파일: 웹 서버가 index이라는 이름의 파일을 맨 먼저 탐색하고 열도록 기본으로 설정
2. CSS
CSS(Cascading Style Sheets) : HTML 문서를 꾸미는 스타일 시트 언어
CSS 브라우저 호환성
인앱 브라우저 : 특정 애플리케이션이 종속된 웹 브라우저로 CSS 코드가 인앱 브라우저에서 작 동작하지 않을 수 있음.
3. JavaScript
정적 웹 페이지 : 사용자의 상호 작용 없이 고정된 콘텐츠를 표시하는 웹 페이지 ⇒ 웹 1.0 시대
동적 웹 페이지 : 사용자의 상호 작용이나 서버의 응답에 따라 실시간으로 콘텐츠가 변하는 웹 페이지 ⇒ 웹 2.0 시대
자바스크립트 ⇒ HTML 태그를 조작해 프론트엔드에서 동적 웹 페이지를 구현할 수 있음. (DOM 모델을 조작)