2023-10-14 22:52

HTML 전처리기 알아보기 with text 자동생성기능

HTML 전처리기는 웹 페이지를 작성할 때 사용되는 HTML 코드를 변환하고 처리하기 위한 도구입니다. 전처리기는 주로 템플릿 엔진이나 CSS 전처리기와 함께 사용되며, 코드의 재사용성과 유지보수를 향상시킬 수 있습니다. 예를 들어, 전처리기를 사용하면 변수, 조건문, 반복문 등을 HTML 코드에 적용할 수 있습니다. 이를 통해 동적인 웹 페이지를 만들 수 있으며, 개발 작업을 더욱 효율적으로 수행할 수 있습니다. HTML 전처리기 중에서는 주로 Pug, Haml, Slim 등이 사용됩니다. (AI가 생성했어요!)

기본 HTML

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"/>
		<title>HTML preprocessor</title>
	</head>
	<body>
		<h1>html</h1>
		<h2>preprocessor></h2>
	</body>
</html>

Haml(함엘)

!!! 5
%html
	%head
		%meta(charset="utf-8")
		%title HTML preprocessor
	%body
		%h1 html
		%h2 preprocessor

슬림(Slim)

doctype html
html
	head
		meta charset="utf-8"
		title HTML preprocessor
	body
		h1 html
		h2 preprocessor

퍼그(Pug)

doctype
html
	head
		meta(charset="utf-8")
		title HTML preprocessor
	body
		h1 html
		h2 preprocessor

참고자료 : [도서] 아는만큼 보이는 프런트엔드 개발

html

전처리기