SlimStarterkit uses a combination of a Sass architecture for quick and unopinionated style starter, handlebars for templating, .htaccess
and 404
file templates, and an automated server/build process using Gulp. This kit is quick, unopinionated, and provides a simple starting point for website projects.
- Open Terminal
- Navigate to the project folder
npm i
installs the dependencies (You only need to do this once)gulp
starts the server- This process will automatically open the site in your default browser
- Write code. Enjoy browser refreshing and live CSS injection.
- Use
gulp build
for production build - Upload the content from the
/dist
folder to your hosting
- Create partial files inside the
/partials
folder, suffix file with.hbs
- Reference a partial using
{{> partial-name}}
- Create new pages directly in the
/src
directory - Read the [Handlebars documentation](https://handlebarsjs.com/ "Handlebarsjs.com) to learn more about using the library.
- Check your finished site against Front-End Checklist
- If you need a CMS, or website management system (WMS) for your project, check out Pagesimple.io
- Build a
theme.json
file - Submit site to Pagesimple.io
- Build a
- Attach GA or some sort of analytics tracking
- Launch your site!
- Sitemap generator?
- Integrate HTML minifier
- Update
documentation
to provide information about site structure and templating - Create build task to generate
theme.json
file
Updates - v0.3.5
- Naming conventions are now consistent (dash-separated class names)
- Remove loop from
globalMeta
- Add
-hide-bp-sm
and-show-bp-sm
classes - Move
/img
folder out out/assets
because it's not necessary
Updates - v0.3.0
- Integrate Handlebars templating system to support usage of partials and separate data
- Add
assets
folder tosrc
, moveimg
folder intoassets
- Template all meta data for ease of use. Just fill out the
data.json
file to fill data across a whole template - Update documentation language
- Add navigation sidebar to documentation
- Add
.htaccess
example
Updates - v0.2.0
- Moved to Gulp for faster build process
- Added image compression to build process
- Added SVG sprite builder to build process
- More complete
container
classes - More complete set of
media-queries
and breakpoints - Cleaner class naming conventions
- Button utlity classes
Updates - v0.1.7
- A better build process for production files
- Toggle component can now specify targets
- Toggleable navigation menu (mobile)
Updates - v0.1.4
- Styled buttons, tables, cards
- Defined basic typography scale
- Designed color functions for color palette generation
- Added
container
classes - Added
positioning
classes - Added
responsive-break
classes to grid system
Updates - v0.1.1
- Introduced new SCSS structure
- Commencing planning phase
Updates - v0.0.8
- Updated
media-query
mixins to reflectmin
values on defaults mixins. - Added a mobile navigation menu to the HTML boilerplate
- Added Twitter Card meta, and standard meta tags
- Moved grid system to Flex
- Added default colors
- Added new files to the SCSS structure for
containers
,colors
,typography
.
Updates - v0.0.5
- Removed Grunt Bake dependency - because it's old, and Jekyll is awesome
- Cleaned up GruntFile.js
- Re-wrote the
README.md
Updates - v0.0.4
- Cleaned up GruntFile.js
- Removed the pretentious
readme.md
- Modified SCSS Reset
- Updated from Autoprefixer-Core to Autoprefixer PostCSS Module