https://github.com/kjbrum/weave
Prototyping made easy.
https://github.com/kjbrum/weave
front-end prototyping sass twig
Last synced: 20 days ago
JSON representation
Prototyping made easy.
- Host: GitHub
- URL: https://github.com/kjbrum/weave
- Owner: kjbrum
- License: mit
- Created: 2017-03-23T19:55:26.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2020-01-16T22:00:40.000Z (over 5 years ago)
- Last Synced: 2025-02-12T07:55:19.322Z (2 months ago)
- Topics: front-end, prototyping, sass, twig
- Language: CSS
- Size: 776 KB
- Stars: 3
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE.md
Awesome Lists containing this project
README
# Weave
> Prototyping made easy.
## Features
- [Twig](http://twig.sensiolabs.org/) - Create pages/templates/partials
- [Sass(SCSS)](http://sass-lang.com/) - Preprocess CSS
- [Node-sass](https://github.com/sass/node-sass) - Compile and minify Sass
- [PostCSS Plugins](https://github.com/postcss/postcss)
- [Autoprefixer](https://github.com/postcss/autoprefixer) - Vendor prefix CSS
- [Pixrem](https://github.com/robwierzbowski/node-pixrem) - Generate pixel fallbacks for rem units
- [Flexibility](https://github.com/7rulnik/postcss-flexibility) - Flexbox polyfills
- [SVG Symbols](https://github.com/svgstore/svgstore-cli) - Combine SVG files into symbols
- [SVGO](https://github.com/svg/svgo) - Cleanup and minify SVG files
- [Browserify/Babelify](http://browserify.org/) - JavaScript bundling
- [Browsersync](https://www.browsersync.io/) - Synchronised browser testing
## Getting Started
1. __Clone the project__
```
$ git clone [email protected]:kjbrum/weave.git
```
1. __Install the dependencies__
```
$ npm install
```
1. __Development__
```
$ npm run dev
```
1. __Staging/Production__
```
$ npm run build
```
## Development Notes
__New Pages__
- New site pages should be placed in the `src/pages` folder with the a `.twig` extension.
- These Twig files will be compiled to `dist/` and will be accessible as static pages.
__Page Data__
- The `src/data/default.json` file can be used for supplying data to all pages.
- Each page in the `src/pages` folder can have an accompanying JSON data file.
- This data file will be placed in the `src/data` folder with the same hierarchy and name as the page.
`src/pages/news/_entry.twig` ==> `src/data/news/_entry.json`
__Include and Extends__
- Twig includes will need to be passed the relative path to the partial you would like to include.
```
{% extends '../partials/base/_layout.twig' %}
{% block content %}
{% include 'path/to/partial.twig' %}
{% endblock %}
```
## License
Copyright © [Kyle Brumm](http://kylebrumm.com). Weave is free to use on whatever and may be redistributed under the terms specified in the [license](LICENSE.md).