Architecture, Node.js, React.js, HTML5, Javascript, Angular, Responsive Design, Java, Mac OS

  I love ESLint. It’s a pluggable linter that’s going to tell you if you’ve imported something and not used it, if your function could be short-handed, and loads of other little gotchas that you can fully configure. I really think that it makes me a better developer — I know the things it normally picks me up on, so I learn not to do them! Let’s go through how I get up and running in a new React project with ESLint installed. In reality though, this setup could be used for any Javascript application. I’m going to assume you already have   npm and node   installed. Starting a New React App There are a whole bunch of React starter projects out there, but Facebook’s own —  create-react-app  is one of the simplest. All you need to do is  create-react-app app-name  and you have a React starter with a local server, Babel, Webpack and Jest. It's a super easy way to get setup, and naturally  Facebook have some great documentation . Installing ESLint Insta...

ES2015 (ES6) introduces a really nice feature that punches above its weight in terms of simplicity to integrate versus time saving and feature output. This feature is the arrow function. Before we dive into the features of the arrow function and what it actually does for us, let’s understand what an arrow function is  not . It’s not a replacement for the  function  keyword, at all. This means you can’t do a find and replace on every single  function  keyword and everything works perfectly, because it likely won’t. Table of contents Syntax Hint: arrows are anonymous Syntax: single line expressions Syntax: single argument functions Functionality: lexical scoping “this” If you’re competent with the way  JavaScript scope  works, and have a great understanding of lexical scope, the  this  keyword and Prototype methods such as  .call() ,  .apply()  and  .bind() , then you’re in good hands to continue reading. ...

What’s Grunt used for? Automating front-end and JavaScript workflow tasks. Refreshing the browser when you change a script. Minifying and concatenating. Running tests. Think   rake   and   guard , if you’re coming from the Ruby world. Enter Grunt by Example! A blow-by-blow tutorial. Just the way I like it. Let’s dive in. The catch - Grunt configuration files can be fairly convoluted at first glance, usually due to the fact that developers add more and more steps to their workflow over time. Grunt is just a task runner. Every unit of functionality that you would want is usually achieved with a separate npm package (a grunt “plugin”). npm search grunt  to view literally every grunt plugin available. Get the command line interface:  npm install -g grunt-cli Add the actual grunt task runner as a development dependency to your project ( --save-dev  adds the package as a dependency to  package.json ): npm install --save-dev grunt Let’s fol...