An open API service indexing awesome lists of open source software.

https://github.com/webpixels/bootstrap-starter-kit

Minimal starter template for websites using Bootstrap 5 and Webpixels CSS next to the Eleventy static site generator.
https://github.com/webpixels/bootstrap-starter-kit

bootstrap bootstrap5 eleventy nextjs starter-template template vue webpixels

Last synced: 8 months ago
JSON representation

Minimal starter template for websites using Bootstrap 5 and Webpixels CSS next to the Eleventy static site generator.

Awesome Lists containing this project

README

          

# Bootstrap Starter Kit

Minimal starter template for websites using Bootstrap 5 and Webpixels CSS next to the Eleventy static site generator.

[](https://app.netlify.com/start/deploy?repository=https://github.com/webpixels/bootstrap-starter-kit)

## Features

* Includes Eleventy static site generator for building the layouts and pages
* Includes Bootstrap (currently using v5) source files via npm
* Includes Webpixels CSS as our design system based on Bootstrap 5
* Includes npm scripts for compiling and autoprefixing Sass, compiling JS, watching for changes, and starting a basic local server
* Example stylesheet (scss/main.scss)
* Example JavaScript file (js/main.js) showing how to import all Bootstrap
* HTML, CSS, and JS minification

## Requirements

* [**Bootstrap 5**](https://getbootstrap.com/docs)
* [**Webpixels CSS**](https://webpixels.io/docs/css/)
* [**Eleventy**](https://www.11ty.dev/docs/)
* [**Nunjucks**](https://mozilla.github.io/nunjucks/templating.html)
* [**Parcel**](https://parceljs.org/docs/)
* **Autoprefixer**
* **Post CSS**

## Getting Started

For easier asset management we've chosen [Parcel](https://parceljs.org/). If you want to see all the npm scripts included for this starter kit, open the `package.json` file.

Next, navigate to the root folder of the site and run:

```
npm install
```

To run a local server and watch for changes:

```
npm start
```

To build for production:

```
npm run build
```

There is also a tutorial available on our website that explains the most important steps for the setup process. Read more about thow to [build JAMstack-ready sites with Bootstrap and 11ty (Eleventy)](https://webpixels.io/blog/how-to-get-started-with-bootstrap-and-eleventy).

## Building modern interfaces

Explore, copy, use and mix hundreds of carefully crafted components made just for Bootstrap. [Explore components](https://webpixels.io/components)

## Community

Get updates on the development of our CSS tool and chat with the project maintainers and community members.

- Follow [@webpxs](https://twitter.com/intent/user?screen_name=webpxs) on Twitter
- Read and subscribe to [The Official Webpixels Blog](https://webpixels.io/blog)
- Join [Github Discussions](https://github.com/webpixels/css/discussions)

## Thank you

* [Zach Leatherman](https://11ty.dev)
* [Mark Otto and the Team](https://github.com/twbs/bootstrap)

## Copyright

Made with ❤️ by [Webpixels](https://webpixels.io). Open-sourced software licensed under the MIT license.