Giter VIP home page Giter VIP logo

11ty-test-blog's Introduction

Netlify Status

Eleventy Netlify Boilerplate

What is it?

A simple template for building a fast, pre-generated HTML website using the Eleventy static site generator. With Netlify CMS baked-in, ready to deploy to Netlify in a couple of clicks.

Use it as a starter for your own JAMstack projects, or as an easy way to get started building websites with Eleventy.

Based on the Eleventy Base Blog repo (see there for additional info on Eleventy usage).

๐Ÿ”ฅ This project is featured on Netlify's official template showcase ๐Ÿ”ฅ

Features

  • NEW: Added maintenance-free post author archives
  • Uses the official Eleventy Navigation plugin to build menus
  • Sample pages and a blog with tag support
  • Netlify CMS with editor previews (thanks @biilmann!)
  • Includes a working contact form
  • CSS 2kb minified, inlined for fastest page render
  • Optional pipeline for minified inline JS
  • Pre-builds and minifies your HTML too
  • Uses Markdown files for content
  • Uses Nunjucks (or Liquid) templates for layout
  • 100% Javascript framework free
  • Continuous Deployment workflow via Netlify

Want to try it out now?

Deploy to Netlify

Clicking the button above will deploy a copy of the demo website to your Netlify account (you can create an account during this process if you don't have one) and everything needed for running the CMS:

  • A new repository in your GitHub account with the code
  • Full Continuous Deployment to Netlify's global CDN network
  • Control users and access with Netlify Identity
  • Manage content with Netlify CMS
  • Process form data with Netlify Forms

Setup authentication

After deploying this project, Netlify Identity will add you as a CMS user and will email you an invite. It is not necessary to accept this invite if you wish to use an OAuth provider (e.g. Github) to manage authentication for your CMS. It is recommended to use this method of authentication as it removes the need for an email & password to log in to the CMS and is generally more secure. You will need to add an OAuth provider in your Netlify app settings under "Settings" > "Identity" > "External providers".

Once you've added an OAuth provider, navigate to /admin on your site, select your provider from the list, and you should then be logged into your CMS. Cool huh?

Now you're all set, and you can start editing content!

Gotchas

If you change the repo that was created at deploy time from public to private, you'll need to regenerate your token, as the token generated using the deploy to Netlify button can only access public repositories. To regenerate your token, head to "Settings" in your Netlify site dashboard, go to the "Identity" section, then scroll to "Services" where you'll see an "Edit settings" button. Click that and you'll see a text link to "Generate access token in GitHub".

If you need any help with setting up Netlify CMS, you can reach out to the Netlify team in the Netlify CMS Gitter.

Local development

1. Clone this repository:

git clone https://github.com/danurbanowicz/eleventy-netlify-boilerplate.git my-blog-name

2. Navigate to the directory

cd my-blog-name

Specifically have a look at .eleventy.js to see if you want to configure any Eleventy options differently.

3. Install dependencies locally

npm install @11ty/eleventy

4. Edit _data/metadata.json

This file contains your site title and author details, and can be used to store any other commonly used site data.

5. Run Eleventy (builds the site)

npx @11ty/eleventy

Or build automatically when a template changes:

npx @11ty/eleventy --watch

Or in debug mode:

DEBUG=* npx @11ty/eleventy

Bug reports, feature requests, etc

This is an ongoing project and I welcome contributions and suggestions! Feel free to submit a PR.

If you need any help with setting up Netlify CMS, you can reach out to the Netlify team in the Netlify CMS Gitter.

11ty-test-blog's People

Contributors

twhite96 avatar

Watchers

 avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.