A rather geeky/technical weblog, est. 2001, by Bramus
This resource came in quite handy when setting up React in combination with ES6 ES2015, Webpack and Babel. Installing all the required dependencies: # Install Webpack npm install –save-dev webpack # Install the Babel Loader, for use with Webpack npm install –save-dev babel-loader # Install the es2015 and react presets, for use with Babel npm …
Continue reading “Setting up React for ES6 ES2015 with Webpack and Babel”
In this article, we won’t focus on what numerous Grunt plugins do to your actual project code, but on the Grunt build process itself. We will give you practical ideas on: How to keep your Gruntfile neat and tidy, How to dramatically improve your build time, And how to be notified when a build happens. …
Speed comparison between Grunt and the aforementioned Gulp All Gulp plugins are just duplex streams that read in data and output data. Everything can be processed in memory, with the output of one stream piped as input to another. Much like Unix pipes. This gives Gulp a huge speed advantage over Grunt, because I/O is …
gulp.task(‘sass’, function() { return gulp.src(‘src/styles/main.scss’) .pipe(sass({ style: ‘compressed’ })) .pipe(autoprefixer(‘last 2 version’, ‘safari 5’, ‘ie 8’, ‘ie 9’, ‘opera 12.1’, ‘ios 6’, ‘android 4’)) .pipe(gulp.dest(‘dist/assets/css’)) }); Gulp is a build system and performs tasks such as the ones we do using Grunt: minify, concat, prefix, uglify, etc. Main difference: Gulp allows you to input your …
Let’s face it: Grunt is one of those fancy newfangled things that all the cool kids seem to be using but at first glance feels strange and intimidating. I hear you. This article is for you. Great introduction to Grunt on 24ways. A must read for anyone starting out with it. Grunt for People Who …
Continue reading “Grunt for People Who Think Things Like Grunt are Weird and Hard”
Writing a modern web app these days can sometimes feel like a tedious process; frameworks, boilerplates, abstractions, dependency management, build processes..the list of requirements for a front-end workflow appears to grow each year. What if however, you could automate a lot of this? Extensive set of slides by Addy Osmani. Solid gold for those wanting …
Where possible, it’s best to try automating image optimization so that it’s a first-class citizen in your build chain. To help, I thought I’d share some of the tools I use for this. Not only contains a list of grunt plugins one can use, but also a few command line and online tools. I’ve been …