11ty와 같은 정적 사이트 생성기를 사용하면 웹사이트를 빠르고 효율적으로 시작하고 실행할 수 있는 매우 강력한 도구가 될 수 있습니다. 정적 사이트 생성기는 웹사이트를 실행하는 데 필요한 모든 파일과 구조로 웹사이트를 만들 수 있습니다. 11ty를 사용하여 3개의 웹사이트를 만들 것입니다.

헬로월드 웹사이트:

내 저장소에 대한 링크를 찾을 수 있습니다here.
명령 프롬프트에 다음을 입력하십시오.
echo '# Page header' > README.md
npx @11ty/eleventy
코드 편집기에서 "Hello World"를 포함하도록 README.md 파일을 다음과 같이 편집합니다.



그런 다음 11ty 사이트를 실행하려면 다음을 입력하십시오.
npx @11ty/eleventy --serve
작업을 보려면 웹사이트가 실행되는 동안 터미널에서 이것을 출력합니다. 로컬 주소를 복사하여 브라우저에 붙여넣은 다음/README( http://localhost:8080/README )를 입력하세요.



결과는 다음과 같아야 합니다.


이제 11ty 사이트를 시작하고 실행하는 방법에 대해 이해했으므로 2개의 예를 더 살펴보겠습니다.

11ty를 사용하는 블로그 사이트

내 저장소에 대한 링크를 찾을 수 있습니다here.

Here은 개인 요구 사항에 맞게 조정할 수 있는 기본 블로그 템플릿입니다. 코드 편집기에서 폴더를 열고 블로그를 나만의 것으로 만들 수 있는 다양한 파일을 탐색할 수 있습니다. 이 스크린샷에서는 이전 블로그 게시물 중 하나를 추가하기 위해 firstPost.md 파일을 편집하고 있습니다.


실행하고 진행 상황을 확인할 준비가 되면 명령 프롬프트에서 다음을 실행합니다.

npx @11ty/eleventy --serve
그런 다음 로컬 주소를 브라우저에 복사하십시오.


완료되면 다음과 같이 표시되어야 합니다.

이력서 웹사이트

최종 리포지토리에 대한 링크는 here입니다.

템플릿을 찾을 수 있습니다here

이 웹사이트의 경우 코드 편집기에서 열고 편집하십시오.

 data, here I am adding my contact info
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/v7o2z964mx6zqrbqbd5w.png)


Like the other ones, when you are ready to run it run

 ```npx @11ty/eleventy --serve```

 and then copy the local address into your browser
The result is as such 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ulcu6kwys48inaxtxobn.png)

That's it for the basics of 11ty, a lot of it comes from playing around with the different file structures to create your own website. 

GH Pages:
None of these would work I have no idea why, they work locally but I can't get them to publish on GH. Coming soon