찾다
기술 주변기기IT산업Eleventy Guide : 프레임 워크 공유 정적 사이트 생성기

eleventy (11ty) : Node.js 정적 사이트 생성기를 손쉬운 웹 사이트 생성 인기있는 node.js static site generator (SSG) 인 Eleventy는 정적 웹 사이트의 생성을 단순화합니다. SSG는 빌드 프로세스 중에 대부분의 렌더링을 수행하여 정적 HTML, CSS 및 JavaScript 파일을 생성합니다. 이렇게하면 runtimes 및 데이터베이스와 같은 서버 측 종속성이 제거됩니다 주요 장점 :

단순화 된 호스팅 :

html 파일 만 제공하면 호스팅을 간단하게 만듭니다 강화 된 보안 :

서버 측 구성 요소가 없으면 보안 취약점이 최소화됩니다. 예외적 인 성능 : 정적 파일은 로딩 시간이 더 빠릅니다

Eleventy의 인기가 크게 증가하여 웹 개발에서 두드러진 인물을 끌어 들였습니다. 콘텐츠 중심 사이트 및 블로그에 이상적이지만 전자 상거래 플랫폼 및보고 시스템에 적응할 수 있습니다. 이 튜토리얼은 Eleventy를 사용하여 기본 웹 사이트를 구축하여 간단한 Markdown-to-HTML 변환 이상의 기능을 보여줍니다. Eleventy가 완전한 빌드 시스템으로 기능 할 수있는 방법을 보여 주어 NPM 스크립트, 웹 팩 또는 Gulp.js와 같은 별도의 도구를 제거하면서 자동화 된 빌드 및 라이브 재 장전을 가능하게합니다. 주요 기능 및 기능 :

node.js Foundation :

효율적인 정적 파일 생성을 위해 node.js를 활용합니다 템플릿 엔진 지원 :
    동적 컨텐츠 통합을 위해 Nunjucks를 포함한 다양한 템플릿 엔진에서 유연성을 제공합니다. 프레임 워크 Agnostic :
  • 는 특정 JavaScript 프레임 워크를 요구하지 않습니다 (React 또는 Vue.js와의 통합은 가능하지만). 간소화 된 설정 : Node.js 프로젝트 작성, Eleventy 설치, 디렉토리 구조 정의 및 입력/출력 디렉토리 구성을 포함합니다. 라이브 재 장전 : 개발 중 실시간 업데이트에 BrowserSync를 활용합니다 고급 기능 :
  • 는 탐색 메뉴 작성 (탐색 플러그인 사용), 자산 변환 및 JavaScript 템플릿을 통한 이미지 최적화를 지원합니다. 컨텐츠 관리 : 컬렉션을 통해 기사를 효율적으로 관리하고, 페이지 매김, 사용자 정의 필터 및 생산 최적화를 가능하게합니다.
  • JavaScript 프레임 워크 : 필요 여부? 일부 SSGS는 클라이언트 측 JavaScript 프레임 워크 (React, vue.js)를 통합하지만 Eleventy는이를 요구하지 않습니다. 복잡한 응용 프로그램을 구축하지 않는 한 (이 경우 SSG가 최적의 선택이 아닐 수도 있음), JavaScript 프레임 워크가 불필요 할 수 있습니다. . <:> 실용적인 예 : 간단한 웹 사이트 구축 이 튜토리얼은 페이지와 블로그 게시물이있는 웹 사이트를 만들어 WordPress와 같은 플랫폼에서 종종 처리하는 작업을 통해 안내합니다. 완전한 코드는 https://www.php.cn/link/6ec3ff0c922ce84561ce5162f912b47e 에서 사용할 수 있습니다. 다음 명령을 사용하여 복제, 설치 및 실행할 수 있습니다. 다음 섹션은 사이트를 처음부터 구축하는 세부 사항입니다

git clone https://www.php.cn/link/6ec3ff0c922ce84561ce5162f912b47e
cd 11ty-starter
npm i
npx eleventy --serve

(튜토리얼의 나머지 부분은 문구와 문장 구조를 변경하면서 원래 의미를 유지하기 위해 원본 텍스트를 비슷한 방식으로 조정하여 모든 이미지와 원래 형식을 다음과 같이 유지해야합니다. 지시에 따라. http://localhost:8080

위 내용은 Eleventy Guide : 프레임 워크 공유 정적 사이트 생성기의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
2025 년에 가입 할 Top 21 개발자 뉴스 레터2025 년에 가입 할 Top 21 개발자 뉴스 레터Apr 24, 2025 am 08:28 AM

이 최고의 개발자 뉴스 레터와 함께 최신 기술 트렌드에 대해 정보를 얻으십시오! 이 선별 된 목록은 AI 애호가부터 노련한 백엔드 및 프론트 엔드 개발자에 이르기까지 모든 사람에게 무언가를 제공합니다. 즐겨 찾기를 선택하고 Rel을 검색하는 데 시간을 절약하십시오

AWS ECS 및 LAMBDA가있는 서버리스 이미지 처리 파이프 라인AWS ECS 및 LAMBDA가있는 서버리스 이미지 처리 파이프 라인Apr 18, 2025 am 08:28 AM

이 튜토리얼은 AWS 서비스를 사용하여 서버리스 이미지 처리 파이프 라인을 구축함으로써 안내합니다. ECS Fargate 클러스터에 배포 된 Next.js Frontend를 만들어 API 게이트웨이, Lambda 기능, S3 버킷 및 DynamoDB와 상호 작용합니다. th

CNCF ARM64 파일럿 : 충격 및 통찰력CNCF ARM64 파일럿 : 충격 및 통찰력Apr 15, 2025 am 08:27 AM

CNCF (Cloud Native Computing Foundation), Ampere Computing, Equinix Metal 및 Actuated 간의 공동 작업 인이 파일럿 프로그램은 CNCF Github 프로젝트를위한 ARM64 CI/CD를 간소화합니다. 이 이니셔티브는 보안 문제 및 성과를 다룹니다

See all articles

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

Video Face Swap

Video Face Swap

완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!

뜨거운 도구

mPDF

mPDF

mPDF는 UTF-8로 인코딩된 HTML에서 PDF 파일을 생성할 수 있는 PHP 라이브러리입니다. 원저자인 Ian Back은 자신의 웹 사이트에서 "즉시" PDF 파일을 출력하고 다양한 언어를 처리하기 위해 mPDF를 작성했습니다. HTML2FPDF와 같은 원본 스크립트보다 유니코드 글꼴을 사용할 때 속도가 느리고 더 큰 파일을 생성하지만 CSS 스타일 등을 지원하고 많은 개선 사항이 있습니다. RTL(아랍어, 히브리어), CJK(중국어, 일본어, 한국어)를 포함한 거의 모든 언어를 지원합니다. 중첩된 블록 수준 요소(예: P, DIV)를 지원합니다.

Atom Editor Mac 버전 다운로드

Atom Editor Mac 버전 다운로드

가장 인기 있는 오픈 소스 편집기

SecList

SecList

SecLists는 최고의 보안 테스터의 동반자입니다. 보안 평가 시 자주 사용되는 다양한 유형의 목록을 한 곳에 모아 놓은 것입니다. SecLists는 보안 테스터에게 필요할 수 있는 모든 목록을 편리하게 제공하여 보안 테스트를 더욱 효율적이고 생산적으로 만드는 데 도움이 됩니다. 목록 유형에는 사용자 이름, 비밀번호, URL, 퍼징 페이로드, 민감한 데이터 패턴, 웹 셸 등이 포함됩니다. 테스터는 이 저장소를 새로운 테스트 시스템으로 간단히 가져올 수 있으며 필요한 모든 유형의 목록에 액세스할 수 있습니다.

Eclipse용 SAP NetWeaver 서버 어댑터

Eclipse용 SAP NetWeaver 서버 어댑터

Eclipse를 SAP NetWeaver 애플리케이션 서버와 통합합니다.

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.