Fresh Resources for Web Designers and Developers (November 2014)

As web developers, it’s important for us to stay in touch with what’s going on in terms of new technology and the new programs available. Sometimes, this can be a bit difficult with so much information being out there.

Fear not, as I’ve done the work and have put together some more fresh resources for the month ahead that will hopefully come in handy. We have for you a new bunch of goodies to choose from. From an online compiler for Sass and SCSS to a jQuery plugin that can lend a typing effect to your website, take a look for yourself.

Shine

Shine is a JavaScript library that lets you generate interactive shadows; e.g. the demo website shows how the spread of the shadow follows the movement of the pointer, which is really fascinating. Shine.js is a great alternative for generating shadow on top of CSS box-shadow or text-shadow property. The shadow can be applied to both text and elements.

ShineJS

SassMeister

SassMeister is an online compiler for Sass and SCSS. You don’t need to install the Sass gem or deal with the terminal. Simply write the Sass syntax and SassMeister will instantly generate it. On top of that, you can include and use some popular Sass libraries such as Bourbon, Susy, and Foundation. SassMeister is a good tool for authors to provide quick examples or instructions for using Sass/SCSS.

SassMeister

Tethr

Tethr is an essential design-kit for mobile designers. Tethr comprises of hundreds of various templates and UI components of common design patterns in iOS mobile applications. You can use Tethr as a starting point for your mobile design, or to build a mockup quickly. Tethr comes in PSD format.

Tethr

Ideal Image Slider

Ideal Image Slider, as the name suggests, proposes an ideal solution for presenting an image slider or carousel. It’s a JavaScript library, built by Gilbert Pellegrom, who happens to be the same developer that built Nivo Slider (one of the most popular jQuery plugins for image slider). The library runs independently, built purely with JavaScript, and ships with the essential features you need such as HTML5, SEO friendly, responsive, touch-enabled, and retina support.

Ideal Image Slider

CSS Shorthand

Shorthand, in CSS terminology, is the short version of a property. For example, instead of declaring both background-color and background-image, you can simply use background property and declare both the color and the image through it. Using the shorthand version of the property will make your CSS look leaner and reduce the file size. This tool can help you accomplish that easily.

CSS Shorthand

WPComJS

WPComJs is the official JavaScript library to interact with WordPress.com API. You can integrate the library with a Node.js application or simply link the library in an HTML file using the script tag. To use it, you will need a token number, which you can obtain from your WordPress.com account. Afterwards, the library allows you to access almost anything from your WordPress.com account, including the posts and pages. You can even upload an image.

WordPress.com API

Typed

Typed.js is a jQuery plugin that allows you to create a typing effect on your website, as you can see in the demo website. You can configure the word or sentence that you would like to animate as well as how fast the animation is. Enhance your website with Typed.js.

Typed JS

Page Speed

You got it! This is an extensive article on how to optimize your website for speed. The article is split into 6 chapters, covering specific topics on the subject. So, if you want to speed up your website, this article has got you covered.

Crud Admin Generator

Do you hate the outdated dull UI of phpMyAdmin? If so, you might want to install Crud Admin Generator. With it, you can generate a separate new backend for your MySQL databases with a much nicer UI.

phpMyAdmin Generator

StockUp

Today, there are a lot of websites that brings free high-quality images, like Unsplash for example. Yet, looking through all these websites is certainly a cumbersome task. Instead, you can search through them in one place, StockUp. In this site, you can search for high-quality images from 6 difference sources at once.

Stock Up Image

WebsiteFacebookTwitterInstagramPinterestLinkedInGoogle+YoutubeRedditDribbbleBehanceGithubCodePenWhatsappEmail