DEV Community

smm7530
smm7530

Posted on

11ty

How to get start

As I never used 11ty before, I started with making a 11ty folder (mkdir eleventy) and in the folder, I did npm init -y to generate an empty npm project without going through any process. And then, I use npm install --save-dev @11ty/eleventy to install and save 11ty. To process markdown, I first created default-layout.njk.

Image description

Blogs

I created a folder called blog and have three markdown files in it. I can change my layout, title, date, teaser and tag as the way I want. By modifying teaser, I can change my blog contents.
Image description

To successfully load the blog to the website, I also need to create a index.njk.

Image description

Plug-in

To install the plug-in for data, I added the code npm install --save-dev eleventy-plugin-date. To run eleventy, type npx @11ty/eleventy --serve.

Image description

To load the plugin, add a .eleventy.js file.

Image description

Open a browser and put the link: http://localhost:8080. to load the page.

Image description

To check

the link for repo
The link for webpage

Top comments (0)