Seven
Seven
Eleventy template using Bootstrap, Sass, Webpack, Vue.js powered search, includes lots of other features
Overview:
Seven is a template for building websites using the Eleventy static site generator. It features a Vue.js powered search functionality, pagination, animations, and more. The template comes with pre-processing for styles and includes overrides for customization. The JavaScript includes a section for changing the way Bootstrap's jQuery components work and a Vue.js instance that powers the search. The template files are organized in a structure similar to a website root folder, with templates in the _templates folder and main layouts in the _layouts folder. The _data folder contains the metadata file with variables used to build the site.
Features:
- Vue.js powered search functionality for posts and courses
- Pagination for easy navigation through content
- Pre-processing for styles with the option to customize with overrides
- jQuery script section for modifying Bootstrap's jQuery components
- Easy setup with clone/download, npm install, and npm start commands
- Express
Express.js is a simple Node.js framework for single, multi-page, and hybrid web applications.
- Vue
Vue.js is a lightweight and flexible JavaScript framework that allows developers to easily build dynamic and reactive user interfaces. Its intuitive syntax, modular architecture, and focus on performance make it a popular choice for modern web development.
- Bootstrap
Bootstrap is the most popular CSS Framework for developing responsive and mobile-first websites.
- SCSS
SCSS is a preprocessor scripting language that extends the capabilities of CSS by adding features such as variables, nesting, and mixins. It allows developers to write more efficient and maintainable CSS code, and helps to streamline the development process by reducing repetition and increasing reusability.
- Webpack
Webpack is a popular open-source module bundler for JavaScript applications that bundles and optimizes the code and its dependencies for production-ready deployment. It can also be used to transform other types of assets such as CSS, images, and fonts.