-
Notifications
You must be signed in to change notification settings - Fork 9
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
2 changed files
with
144 additions
and
144 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,50 +1,50 @@ | ||
|  | ||
|
|
||
| # Brick - A **solid**, modern, not-so-opinionated front-end boilerplate. # | ||
|
|
||
| <a href="https://www.youtube.com/watch?v=Sagg08DrO5U"><img src='http://img.shields.io/badge/gandalf-approved-61C6FF.svg'></a> | ||
|
|
||
| ### Docs | ||
| For a more detailed documentation, check the <a href="http://riccardo-zanutta.github.io/brick/">official website</a>. | ||
|
|
||
| ### Introduction | ||
|
|
||
| Brick will give you a solid starting point to develop your next awesome project. | ||
| It includes: | ||
| * A painless, non-intrusive CSS library, written in <a href="http://sass-lang.com/">Sass</a>; | ||
| * A solid and extendible development environment with <a href="http://gulpjs.com/">Gulp</a>, <a href="https://www.browsersync.io/">Browsersync</a> and a production environment. | ||
|
|
||
| ### Getting started | ||
|
|
||
| ```sh | ||
| # Clone this repository | ||
| $ git clone https://github.com/Riccardo-Zanutta/brick.git your_next_awesome_project | ||
| $ cd your_next_awesome_project | ||
|
|
||
| # Install dependencies | ||
| $ npm install | ||
| # Run tasks and serve | ||
| $ npm run start | ||
| # or | ||
| $ gulp --pretty | ||
| ``` | ||
|
|
||
| <a href="https://www.browsersync.io/">Browsersync</a> will mount a web server for you and opens a tab in your browser at localhost:4001 (this is the default port, you can change it in the <a href="https://github.com/Riccardo-Zanutta/brick/blob/master/config.json">config.json</a> file). | ||
|
|
||
| ### Additional infos | ||
|
|
||
| ```sh | ||
| # Go in production | ||
| $ gulp production // this creates a ./dist folder insider your project | ||
| # You can view all of your available tasks with: | ||
| $ gulp help | ||
| ``` | ||
|
|
||
| ### Contributing | ||
|
|
||
| If you have any suggestions about the css and js structure/best practices, new gulp tasks and so on, please contribute and make a pull request. | ||
|
|
||
| * Fork the original repo | ||
| * if you have to test some new css/js feature, type ``` npm run start ``` which will start the dev server. | ||
| * Make a pull request | ||
| * Feel proud to contribute to the open source world :) | ||
|  | ||
|
|
||
| # Brick - A **solid**, modern, not-so-opinionated front-end boilerplate. # | ||
|
|
||
| <a href="https://www.youtube.com/watch?v=Sagg08DrO5U"><img src='http://img.shields.io/badge/gandalf-approved-61C6FF.svg'></a> | ||
|
|
||
| ### Docs | ||
| For a more detailed documentation, check the <a href="http://riccardo-zanutta.github.io/brick/">official website</a>. | ||
|
|
||
| ### Introduction | ||
|
|
||
| Brick will give you a solid starting point to develop your next awesome project. | ||
| It includes: | ||
| * A painless, non-intrusive CSS library, written in <a href="http://sass-lang.com/">Sass</a>; | ||
| * A solid and extendible development environment with <a href="http://gulpjs.com/">Gulp</a>, <a href="https://www.browsersync.io/">Browsersync</a> and a production environment. | ||
|
|
||
| ### Getting started | ||
|
|
||
| ```sh | ||
| # Clone this repository | ||
| $ git clone https://github.com/Riccardo-Zanutta/brick.git your_next_awesome_project | ||
| $ cd your_next_awesome_project | ||
|
|
||
| # Install dependencies | ||
| $ npm install | ||
| # Run tasks and serve | ||
| $ npm run start | ||
| # or | ||
| $ gulp --pretty | ||
| ``` | ||
|
|
||
| <a href="https://www.browsersync.io/">Browsersync</a> will mount a web server for you and opens a tab in your browser at localhost:4001 (this is the default port, you can change it in the <a href="https://github.com/Riccardo-Zanutta/brick/blob/master/config.json">config.json</a> file). | ||
|
|
||
| ### Additional infos | ||
|
|
||
| ```sh | ||
| # Go in production | ||
| $ gulp production // this creates a ./dist folder insider your project | ||
| # You can view all of your available tasks with: | ||
| $ gulp help | ||
| ``` | ||
|
|
||
| ### Contributing | ||
|
|
||
| If you have any suggestions about the css and js structure/best practices, new gulp tasks and so on, please contribute and make a pull request. | ||
|
|
||
| * Fork the original repo | ||
| * if you have to test some new css/js feature, type ``` npm run start ``` which will start the dev server. | ||
| * Make a pull request | ||
| * Feel proud to contribute to the open source world :) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,94 +1,94 @@ | ||
| /** | ||
| * BRick | ||
| * https://github.com/Riccardo-Zanutta/brick | ||
| * Copyright 2016 Riccardo Zanutta (@RiccardoZanutta) | ||
| * Released under the MIT license (http://mit-license.org) | ||
| */ | ||
|
|
||
| 'use strict'; | ||
|
|
||
| import gulp from 'gulp'; | ||
| import config from './config.json'; | ||
| import pkg from './package.json'; | ||
| import gulpLoadPlugins from 'gulp-load-plugins'; | ||
| import browserSync from 'browser-sync'; | ||
| import del from 'del'; | ||
| import runSequence from 'run-sequence'; | ||
| import { argv } from 'yargs'; | ||
|
|
||
| const $ = gulpLoadPlugins(); | ||
| const reload = browserSync.reload; | ||
|
|
||
| // List all tasks and subtasks | ||
| gulp.task('help', $.taskListing); | ||
|
|
||
| // Sass compile, autprefixer, minify, sourcemaps | ||
| gulp.task('styles', () => { | ||
| return gulp.src(config.sass_src) | ||
| .pipe($.if(argv.pretty, $.sourcemaps.init())) | ||
| .pipe($.sass({ | ||
| precision: 10, | ||
| includePaths: ['.src/css/'] | ||
| }).on('error', $.sass.logError)) | ||
| .pipe($.autoprefixer(config.autoprefixer_options)) | ||
| .pipe($.if(!argv.pretty, $.cssnano())) | ||
| .pipe($.size({title: 'Styles'})) | ||
| .pipe($.if(argv.pretty, $.sourcemaps.write('./'))) | ||
| .pipe(gulp.dest(config.sass_dest)) | ||
| }); | ||
|
|
||
| // Concat, sourcemaps and minify js files | ||
| gulp.task('scripts', () => { | ||
| gulp.src(config.js_src) | ||
| .pipe($.if(argv.pretty, $.sourcemaps.init())) | ||
| .pipe($.babel()) | ||
| .pipe($.concat(config.js_file_name)) | ||
| .pipe($.if(!argv.pretty, $.uglify({preserveComments: 'some'}))) | ||
| .pipe($.if(argv.pretty, $.sourcemaps.write('.'))) | ||
| .pipe($.size({title: 'Scripts'})) | ||
| .pipe(gulp.dest(config.js_dest)) | ||
| }); | ||
|
|
||
| // Clean the dist/ folder | ||
| gulp.task('clean', () => { | ||
| return del.sync([ | ||
| config.del_folder | ||
| ]) | ||
| }); | ||
|
|
||
| // Copy the content from the src/ folder to the dist/ one | ||
| gulp.task('copy', ['clean'], () => { | ||
| return gulp.src(config.src_folder) | ||
| .pipe($.size({title: 'Copying ./src content in ./dist'})) | ||
| .pipe(gulp.dest(config.dist_folder)) | ||
| }); | ||
|
|
||
| // Serve the content, live reload with browsersync | ||
| gulp.task('serve', ['styles', 'scripts'], () => { | ||
| browserSync.init({ | ||
| notify: false, | ||
| server: { | ||
| baseDir: './src' | ||
| }, | ||
| port: config.port | ||
| }); | ||
|
|
||
| gulp.watch('./src/*.html').on('change', reload); | ||
| gulp.watch(['./src/css/**/*.scss'], ['styles', reload]); | ||
| gulp.watch(['./src/js/vendor/*.js', './src/js/build/*.js'], ['scripts', reload]); | ||
| }); | ||
|
|
||
| gulp.task('production', ['styles', 'scripts'], () => { | ||
| runSequence('copy'); | ||
| }); | ||
|
|
||
| // This is the default task :) | ||
| gulp.task('default', ['clean'], () => { | ||
| const startTime = Date.now(); | ||
| runSequence('serve', () => { | ||
| console.log('\x1b[42m************************************\x1b[0m\n'); | ||
| console.log('\x1b[32m BRick is ready to Rock!\x1b[0m\n'); | ||
| console.log('\x1b[42m************************************\x1b[0m\n'); | ||
| console.log('[\x1b[32mBRick\x1b[0m]', `All finished in \x1b[35m${Date.now() - startTime} ms` ,'\x1b[0m\n'); | ||
| }) | ||
| }); | ||
| /** | ||
| * BRick | ||
| * https://github.com/Riccardo-Zanutta/brick | ||
| * Copyright 2016 Riccardo Zanutta (@RiccardoZanutta) | ||
| * Released under the MIT license (http://mit-license.org) | ||
| */ | ||
|
|
||
| 'use strict'; | ||
|
|
||
| import gulp from 'gulp'; | ||
| import config from './config.json'; | ||
| import pkg from './package.json'; | ||
| import gulpLoadPlugins from 'gulp-load-plugins'; | ||
| import browserSync from 'browser-sync'; | ||
| import del from 'del'; | ||
| import runSequence from 'run-sequence'; | ||
| import { argv } from 'yargs'; | ||
|
|
||
| const $ = gulpLoadPlugins(); | ||
| const reload = browserSync.reload; | ||
|
|
||
| // List all tasks and subtasks | ||
| gulp.task('help', $.taskListing); | ||
|
|
||
| // Sass compile, autprefixer, minify, sourcemaps | ||
| gulp.task('styles', () => { | ||
| return gulp.src(config.sass_src) | ||
| .pipe($.if(argv.pretty, $.sourcemaps.init())) | ||
| .pipe($.sass({ | ||
| precision: 10, | ||
| includePaths: ['.src/css/'] | ||
| }).on('error', $.sass.logError)) | ||
| .pipe($.autoprefixer(config.autoprefixer_options)) | ||
| .pipe($.if(!argv.pretty, $.cssnano())) | ||
| .pipe($.size({title: 'Styles'})) | ||
| .pipe($.if(argv.pretty, $.sourcemaps.write('./'))) | ||
| .pipe(gulp.dest(config.sass_dest)) | ||
| }); | ||
|
|
||
| // Concat, sourcemaps and minify js files | ||
| gulp.task('scripts', () => { | ||
| gulp.src(config.js_src) | ||
| .pipe($.if(argv.pretty, $.sourcemaps.init())) | ||
| .pipe($.babel()) | ||
| .pipe($.concat(config.js_file_name)) | ||
| .pipe($.if(!argv.pretty, $.uglify({preserveComments: 'some'}))) | ||
| .pipe($.if(argv.pretty, $.sourcemaps.write('.'))) | ||
| .pipe($.size({title: 'Scripts'})) | ||
| .pipe(gulp.dest(config.js_dest)) | ||
| }); | ||
|
|
||
| // Clean the dist/ folder | ||
| gulp.task('clean', () => { | ||
| return del.sync([ | ||
| config.del_folder | ||
| ]) | ||
| }); | ||
|
|
||
| // Copy the content from the src/ folder to the dist/ one | ||
| gulp.task('copy', ['clean'], () => { | ||
| return gulp.src(config.src_folder) | ||
| .pipe($.size({title: 'Copying ./src content in ./dist'})) | ||
| .pipe(gulp.dest(config.dist_folder)) | ||
| }); | ||
|
|
||
| // Serve the content, live reload with browsersync | ||
| gulp.task('serve', ['styles', 'scripts'], () => { | ||
| browserSync.init({ | ||
| notify: false, | ||
| server: { | ||
| baseDir: './src' | ||
| }, | ||
| port: config.port | ||
| }); | ||
|
|
||
| gulp.watch('./src/*.html').on('change', reload); | ||
| gulp.watch(['./src/css/**/*.scss'], ['styles', reload]); | ||
| gulp.watch(['./src/js/vendor/*.js', './src/js/build/*.js'], ['scripts', reload]); | ||
| }); | ||
|
|
||
| gulp.task('production', ['styles', 'scripts'], () => { | ||
| runSequence('copy'); | ||
| }); | ||
|
|
||
| // This is the default task :) | ||
| gulp.task('default', ['clean'], () => { | ||
| const startTime = Date.now(); | ||
| runSequence('serve', () => { | ||
| console.log('\x1b[42m************************************\x1b[0m\n'); | ||
| console.log('\x1b[32m BRick is ready to Rock!\x1b[0m\n'); | ||
| console.log('\x1b[42m************************************\x1b[0m\n'); | ||
| console.log('[\x1b[32mBRick\x1b[0m]', `All finished in \x1b[35m${Date.now() - startTime} ms` ,'\x1b[0m\n'); | ||
| }) | ||
| }); |