1×
Become a member
to unlock all features

Level Up!

Access all courses & lessons on egghead today and lock-in your price for life.

Autoplay

    Bootstrap an eleventy project

    Khaled GarbayaKhaled Garbaya
    11ty11ty

    In this video, you will learn to bootstrap an eleventy project.

    we'll start from an empty directory, initialize it as an npm package, install @11ty/eleventy package and create the website entry point.

    Eleventy can compile multiple file formats, HTML, markdown, liquid, and njk.

    Check out the eleventy docs for more information.

    Code

    Code

    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson
    Discuss

    Discuss

    Transcript

    Transcript

    Khaled Garbaya: 0:00 First let's install Eleventy. Next let's go to the package.json and add two scripts. One is start, this will be "eleventy --serve." The second will be build, this will be "eleventy." Let's hit Save.

    0:33 Let's create a page and call it index.html. Let's add our h1. Here we can do "Hello world." Let's run npm start.

    0:53 Now we can go to our website in here. Let's copy this and go to our browser, and this is our Eleventy project running.

    1:05 Eleventy also supports Markdown. If we rename this file to index.md, you can see it still works. We can change this to use Markdown, and save. You can see it's still parsing the page and displaying it.