jigsaw docs template

Jigsaw Docs 스타터 템플릿

최소한의 노력으로 프로젝트를 위한 아름답고 사용자 정의 가능한 문서 사이트를 만들기 위한 시작 템플릿입니다. 몇 가지 설정만 변경하면 바로 사용할 수 있습니다.

문서 템플릿의 미리보기를 확인하세요.

설치

Jigsaw를 설치한 후 프로젝트 디렉터리에서 다음 명령을 실행하세요.

./vendor/bin/jigsaw init docs

이 시작 템플릿에는 일반적인 페이지 유형의 샘플이 포함되어 있으며 다음과 같이 미리 구성되어 있습니다.

• 완벽하게 반응하는 탐색 모음
• 사이드바 탐색 메뉴
• Tailwind CSS는 CSS 한 줄도 건드리지 않고도 디자인을 맞춤 설정할 수 있는 유틸리티 CSS 프레임워크입니다.
• CSS에서 사용하지 않는 선택기를 제거하여 CSS 파일 크기를 줄이는 Purgecss
• highlight.js를 사용한 구문 강조
• sitemap.xml 파일을 자동으로 생성하는 스크립트
• Algolia DocSearch가 제공하는 검색 표시줄 및 무료 색인 서비스를 시작하는 방법에 대한 지침
• 사용자 정의 404 페이지

---

---

새 사이트 구성

모든 Jigsaw 사이트와 마찬가지로 구성 설정은 config.php 에서 찾을 수 있습니다. 프로젝트에 특정한 설정으로 해당 파일의 변수를 업데이트할 수 있습니다. 사이트 전체에서 사용할 새 구성 변수를 추가할 수도 있습니다. 자세한 내용은 Jigsaw 문서를 살펴보세요.

 // config.php
return [
    ' baseUrl ' => ' https://my-awesome-jigsaw-site.com/ ' ,
    ' production ' => false ,
    ' siteName ' => ' My Site ' ,
    ' siteDescription ' => ' Give your documentation a boost with Jigsaw. ' ,
    ' docsearchApiKey ' => '' ,
    ' docsearchIndexName ' => '' ,
    ' navigation ' => require_once ( ' navigation.php ' ),
];

팁: 이 구성 파일은 "컬렉션"(예: 사이트 기여자 컬렉션 또는 블로그 게시물 컬렉션)을 정의하는 곳이기도 합니다. 자세한 내용은 공식 Jigsaw 문서를 확인하세요.

---

콘텐츠 추가

다양한 파일 형식을 사용하여 콘텐츠를 작성할 수 있습니다. 기본적으로 이 시작 템플릿에서는 콘텐츠가 source/docs 폴더에 있을 것으로 예상합니다. 이를 변경하는 경우에는 navigation.php 의 URL 참조를 업데이트해야 합니다.

각 콘텐츠 페이지의 첫 번째 섹션에는 렌더링 방법을 지정하는 YAML 헤더가 포함되어 있습니다. title 속성은 각 페이지에 대한 HTML title 및 OpenGraph 태그를 동적으로 생성하는 데 사용됩니다. extends 속성은 이 콘텐츠 파일이 어떤 상위 블레이드 레이아웃으로 렌더링되는지 정의하고(예: _layouts.documentation source/_layouts/documentation.blade.php 로 렌더링됨) section 속성은 이 콘텐츠가 배치될 것으로 예상하는 블레이드 "섹션"을 정의합니다. 그것에.

---
title : Navigation
description : Building a navigation menu for your site
extends : _layouts.documentation
section : content
---

직소 레이아웃에 대해 자세히 알아보세요.

---

자산 추가

컴파일해야 하는 모든 자산(예: JavaScript, Less 또는 Sass 파일)은 source/_assets/ 디렉터리에 추가할 수 있으며, Laravel Mix는 npm run dev 또는 npm run prod 실행할 때 해당 자산을 처리합니다. 처리된 자산은 /source/assets/build/ 에 저장됩니다(이 두 번째 assets 디렉터리에는 밑줄이 없습니다).

그런 다음 Jigsaw가 사이트를 구축할 때 구축된 파일이 포함된 전체 /source/assets/ 디렉터리(및 여기에 저장하기로 선택한 이미지나 글꼴과 같은 정적 자산이 포함된 기타 디렉터리)가 대상 빌드 폴더에 복사됩니다. ( 로컬 머신의 build_local ).

처리가 필요하지 않은 파일(예: 이미지 및 글꼴) /source/assets/ 에 직접 추가할 수 있습니다.

Laravel Mix를 사용하여 Jigsaw에서 자산을 컴파일하는 방법에 대해 자세히 알아보세요.

---

사이트 구축

이제 구성 변수를 편집하고 스타일과 콘텐츠를 사용자 정의하는 방법을 알았으므로 사이트를 구축해 보겠습니다.

 # build static files with Jigsaw
./vendor/bin/jigsaw build

# compile assets with Laravel Mix
# options: dev, prod
npm run dev