How to get started with Bower

One of the things we struggle everyday as programmers is productivity; we want to do things better and at the same time faster, everyday. This is something we can’t control, we now have more to do: more scripts to download, to install, and even more frameworks to work with. In every project we end up downloading at least one jQuery plugin and even jQuery itself; every time this happens we need to go the plugin’s website, download it, or link to it. Even though we’re used to this, and it doesn’t even...

How to create a color picker with picker.js

Color pickers are everywhere on the Web today, we see them in a lot in forms and in customization tools. Even though it’s possible to create this with HTML, JavaScript is a better solution because it provides greater support. Today, we’ll use picker.js to create a simple color picker that you can use in your applications. The first step towards creating this simple interface is to have our HTML ready, in this case I simply created a button and a span in which we will present the color to the user: <button...

How to create Google Chrome extensions

Google Chrome is the most widely used browser, and for good reason: it’s fast, reliable, has a great set of developer tools and to top it all off, it has literally hundreds of extensions in the Google Store you can take advantage of. The other amazing thing is that you can build your own extensions using just HTML, CSS and JavaScript, so it’s not like you need to even learn any new languages. You already know this, you only need to figure out how to apply it to Chrome. There are times you need something specific...

How to use Bootstrap Tour

Right now web applications are stronger than ever and even though some of them are simple to understand others are really complex applications that need some understanding before use.One approach these applications take is to give us a tour of the product, usually with little pop ups that we can skip or leave until the end.That is exactly what Bootstrap Tour does in a simple and clean way.Getting started ... This plugin was at first aimed at being a simple and easy to use Bootstrap tour plugin but now we...

How to use Yeoman Generator

By this time you’ve probably already heard of Yeoman and chances are you have used it once or twice, it’s a great automation tool that pretty much gives your entire workflow a push in the right direction. If you have used it, you know that Yeoman runs on Generators; you pick one and Yeoman does the work of scaffolding your application based on your needs. There are more than 600 generators listed on the website but sometimes you need one that meets your requirements precisely, and if you can’t find...

How to use HTML Imports

Web Components have really come a long way since they were first introduced, but one aspect of components that could really change how we code websites is HTML Imports. This way of working allows us to import HTML documents into other HTML documents. It was possible with Ajax, but HTML Imports is a cleaner method. Browser support ... HTML Imports are a very new technology and as of the time of writing, are only supported in Chrome 31 and later. Even then, you’re required to activate the feature. To do so...
CSS

How to use Cute Grids

This is a golden age for frameworks, with dozens for us to choose from. We have great options like Bootstrap and Foundation, but sometimes these frameworks deliver more than we want. Sometimes, all we need is a clean, and responsive grid. Cue: Cute Grids. Why use Cute Grids? ... The idea behind Cute Grids is to get you away from a full featured framework, and focus on just the grid. Cute Grids take a mobile-first approach, so that all of your websites work on mobile as well as desktop. The framework is completely...

How to create text animations with Textillate

Using CSS we can create all kinds of animations. Whether we’re working with text or with elements, animations and transitions are a much simpler task with CSS. It’s all possible with vanilla CSS, but there are a number of plugins that make our life simpler, one of which we’re going to look at today: Textillate.js. Getting started ... In order to start using this plugin we need firstly to head over to its website and download the latest version. One thing to keep in mind is that this plugin has 3 dependencies:...
Load more
Home CSS Deals HTML HTML5 Java JavaScript jQuery Miscellaneous Mobile MySQL News PHP Resources Security Snippet Tools Tutorial Web Development Web Services WordPress