Our mission at Tutorialzine is to keep you up to date with the latest and coolest trends in web development. That’s why every month we release a handpicked collection of some of the best resources that we’ve stumbled upon and deemed worthy of your attention.
November’s list is here and it is packed with some amazing GitHub projects. It includes new CSS frameworks, a node.js package manager from Facebook, and a couple of awesome CSS-only solutions for icons, loading spinners, and tooltips.
Wing is a minimalistic CSS framework that can be used for setting a solid base to your websites. Like all CSS frameworks these days, Wing has a 12-column responsive grid and a collection of styled components. The cool thing about this particular project is that most HTML elements are automatically styled and don’t need any extra classes.
<span>, so that your text remains in the page in its entirety. Following a trend seen in many modern libraries, Shave has no dependencies and instead offers a separate version for plugging it in with jQuery.
Wenk is a tiny library that provides CSS-only text tooltips. The whole thing is only 700 bytes, but still manages to provide a handful of customization options such as different tooltip sizes, placements, and text alignment. Probably the quickest way possible to get tooltips up and running.
CSS Loader is a very helpful library that allows developers to quickly create loading indicators out of pure CSS. There are many different spinner designs included and they can all be created using only a single
Yarn is a fancy new node.js package manager by Facebook. Its main selling points are a powerful caching system, fast install times, and a reliable file organization that keeps every instance of your project installed the same way. Although they are quite different under the hood, using Yarn is almost identical to using npm, and developers can get familiar with it quickly.
A growing collection of over 500 icons made entirely out of CSS. Using icons from this font is extremely simple, and there is even an option to animate from one icon to another. We also have to give +10 points to this project for its awesome website, that lets you see exactly what part of the CSS represents what element of the icon.
As you can tell by the title, this is a library for formatting numbers and strings to various currency standards. It supports 155 currency formats and over 700 locale definitions for country specific formatting. Also, if for some reason the format you are looking for isn’t included, you are free to define your own.
A lightweight Vue.js framework following closely the Material Design Guidelines. It offers a collection of high-quality components, many of which are designed toward mobile devices and provide native-like interactions and animations. The library is easy to implement, and doesn’t have any dependencies apart from Vue.js.
Test Cafe is a platform for running tests on your web apps. It is node.js based and doesn’t require you to install anything other than the npm package – no browser plugins, no compilators. Once you’ve written your tests, running Test Cafe will do everything else for you, including starting browsers for testing, gathering results, and creating a report.
A super lightweight CSS reset and grid system in only 1.3 kb. Core.css can be used as the base for any small web projects where you don’t need all the features of a full blown framework such as Bootstrap or Foundation.
flvjs.createPlayer() function to turn on FLV playback.