You can Get notified when a DOM element enters or exits the viewport with in-view.js. It’s a small (~1.9kb gzipped), dependency-free, javascript utility for IE9+. With in-view, you can register handlers that are called when an element enters or exits the viewport. Each handler receives one element, the one entering or exiting the viewport, as its only argument. As a small caveat, in-view utilizes MutationObserver to check the visibility of registered elements after a DOM mutation. If that’s functionality you need in IE9-10, consider using a polyfill.
Requirements: –
Demo: https://camwiegert.github.io/in-view/
License: MIT License
Most tools focus on delivering information to you today, but do not help in recording, retrieving and making use of it. Candy does. You can drop the meaningless links, lost articles in read later silos, and copy-pasting into docs. Candy helps you capture ideas in an easy and beautiful way.
Your highlights are recorded and placed on cards together with key information. A card is called a Candy. The whole article, including images and links, is archived by the Candy app and remains accessible instantly in a built-in reader. You can add Candys to collections the way you add songs to playlists. We call collections Storylines. You can re-arrange cards in Storylines in your order anytime.
Requirements: –
Demo: https://www.candybank.com/
License: License Free
Scrollanim is a CSS3 and JavaScript library to create stunning scroll animations that work everywhere. It’s open-source (MIT), free and easy to use Oh, and it’s 9KB. Also, this is possible to add the animations using the JavaScript API. Scrolanim has many CSS3 animations to use. No JavaScript animations, better performance. Works on desktop and portable devices perfectly. Scrollanim controls all elements with an extra care. You can attach events to almost all possible positions of an element on the page.
Requirements: CSS3 & JavaScript
Demo: http://scrollanim.kissui.io/
License: MIT License
Cloudinary, a provider of solutions for managing images and video in the cloud, is offering HTTP/2 support, enabling developers to further optimize the user experience. To take advantage of HTTP/2, Cloudinary users don’t have to do a thing – it’s been automatically integrated into the online tools.
Websites have changed dramatically over the past several years, featuring more images and video. But the underlying HTTP protocol hadn’t kept pace, until the IETF’s recent approval of the HTTP/2. The goal of HTTP/2 is to improve website performance, reducing the amount of bandwidth required and latency, while making it easier for developers to use secure connections.
The adoption of HTTP/2 was initially slow. But since January 2016 more sites have announced plans to move to HTTP/2 or are offering true support of the protocol. For example, both Wikipedia and Blogspot announce in May that their sites are now supporting HTTP/2. The graphic below from HTTP/2 Dashboard illustrates the greater adoption since the beginning of the year, and enables you to interactively see how many domains have announced support for HTTP/2, and those that offer partial or true support at any given time. Read the rest of this entry »
Have you ever stopped to look back at what your job was like 10 years ago? It’s common knowledge that web designers’ responsibilities have changed over the years.
In the past, you either needed some serious coding skills to be a website designer, or you had to rely on coding help from others. You needed creative skills as well. That need hasn’t changed. Your creativity is now focused on design and visualization, with a touch of marketing expertise thrown in. You also need to have a basic understanding of how WordPress works.
All this hasn’t made your work any easier. It may in fact be harder. To be competitive, you have to keep up with the the latest design trends and constantly work at improving your design skills.
You have the tools you need, but it’s how you use them that adds value to a project.
Read this article to discover how buying a 0.28$ website, like this one, will be the smartest purchase you’ll make this month.
When you buy a WordPress theme, are you really paying attention to the value for money?
A WordPress theme can be one of the most useful products you can buy to build a website. WordPress themes relieve you of most of the technical aspects of building a website. And you can concentrate on creativity, making smart design choices, and working with your clients.Â
Most WP themes do this for you, but some contain features you don’t need. Or features you need, but require hours of learning. For efficiency’s sake, you would greatly prefer a WP theme that offers most of what you need, and little or nothing more.
That’s what value for money is all about. Purchasing a product that offers the most in efficiency and effectiveness. In other words, a smart buy. Read the rest of this entry »
Splitting up large codebases into separate independently versioned packages is extremely useful for code sharing. However, making changes across many repositories is messy and difficult to track, and testing across repositories gets complicated really fast.
To solve these (and many other) problems, some projects will organize their codebases into multi-package repostories (sometimes called monorepos). Projects like Babel, React, Angular, Ember, Meteor, Jest, and many others develop all of their packages within a single repository. Lerna is a tool that optimizes the workflow around managing multi-package repositories with git and npm.
Requirements: –
Demo: https://lernajs.io/
License: MIT License
Choosing an eCommerce theme puts you on the right track for building a quality online store. But making that choice is only half the battle. The look and feel of your online store is critical. Your eCommerce theme can perform the tasks to make that happen, but you have to tell it what you want done.
What do you need to consider when designing your online store?
- Give your store a familiar look. This makes it easier for shoppers to go where they want to go. Krug’s first law of usability puts it nicely – “Don’t make me think.†Don’t make your visitors have to think in order to find their way around your store.
- Don’t overdo your homepage banner. A knockout banner is nice, but it’s really unnecessary. If it’s too loud or flashy, it will simply drive customers away.
- Think about how you want to display your products. A traditional or conventional display tends to work best. Make sure the product images are compatible with the website’s style and brand.
- Think mobile first. Half of your potential customers do their shopping from mobile devices, and before long, the majority will be doing so. Make their visit a pleasant one.
- Make owning a lightweight, fast eCommerce theme a priority. It will be easier to work with, and it will help you build fast and reliable websites.
XStore-Responsive WooCommerce Theme
If it’s a priority to find a theme that gets the job done, yet is delightfully easy to work with, XStore is an excellent choice. It is also an excellent choice if you plan to take Krug’s first law of usability to heart. If you spend a few moments browsing their demos, it’s apparent that this theme’s authors have done just that.
That is why the demos have such a familiar look. Familiarity gives your shop a trustworthy, professional appearance, plus your customers don’t have to think. By hovering over one or more of the demos, you should be able to come up with some great ideas for how you want your own store to look.
XStore is responsive, RTL-ready, and Visual Composer compatible. It is also 100% WooCommerce compatible. You’ll like working with its Theme Options feature. It gives you the flexibility to build whatever is on your mind. Support is excellent, and video tutorials are there to assist you with installation and settings management.
Merchandiser
Merchandiser is minimalist, fast, and reliable. The exact opposite of an over bloated theme that tends to be loaded down with functionality, bells, and whistles that you have no need for. Merchandiser’s authors follow the principle that simplicity is the ultimate in sophistication – and it shows. Merchandiser is packed with features, but only as many as you need – nothing more.
The Theme Customizer/Visual Composer Drag and Drop Page Builder features combine to create a potent web-building force. Visitors to your online shop will appreciate features like the off-canvas shopping cart and off-canvas quick view, along with the ability to choose how they want to view your products as they shop.
Merchandiser gives you the ability to sell anything online, including digital products, or you can open an affiliate business if you wish. It all happens with simplicity in mind. Read the rest of this entry »
Even the most talented developer knows that a great website is time-consuming to build and a challenge to maintain. The reason: You need to meet graphic design requirements for every device according to current design trends, while ensuring that your website performance is optimized for any browser.
Cloudinary can eliminate many of the problems you experience when dealing with images. The cloud-based solution takes care of the entire image management pipeline, enabling image upload; providing a rich set of manipulation and optimization capabilities; and offering cloud storage, administration and super-fast CDN delivery.
With our interactive demo, you can see Cloudinary in action as we walk you through examples of visual image manipulation and optimization, as well as some popular website implementations. In addition, you’ll ready-to-use code samples in Ruby on Rails, PHP, Node JS, Angular JS, jQuery and more. Read the rest of this entry »
Do you remember Monstroid, a huge multipurpose WordPress theme we reviewed around a year ago? Since then, it’s grown even more as a result of multiple updates. Today, we’d like to review the latest one and give away 5 licenses for Monstroid. You can find a lot of WordPress themes designed specifically for blogs, portfolios, online stores, whatever, but Monstroid provides a versatile solution for any project. So, make sure you take this opportunity to obtain it for free. Find out how to win it and read more info about its latest update below.
Terms and Conditions of the Giveaway
The giveaway of Monstroid starts on August 12, 2016, and ends on August 16, 2016. We will pick 5 winners at random and reward each of them with a license for the theme. There are three simple steps to take in order to win it. You’ll need to spend literally just a few moments of your time.
- Go to the Monstroid page and read about its functionality in detail or view the theme in action.
- Choose the coolest feature or child theme and mention it in the comments to this post.
- Leave your valid email. We will use it to contact you and tell you how to get the license for Monstroid.
That’s all. The whole process is very fast and easy, isn’t it? Read the rest of this entry »
Cleave.js has a simple purpose: to help you format input text content automatically. The idea is to provide an easy way to increase input field readability by formatting your typed data. By using this library, you won’t need to write any mind-blowing regular expressions or mask patterns to format input text. However, this isn’t meant to replace any validation or mask library, you should still sanitize and validate your data in backend. It supports Credit card number formatting, Phone number formatting (i18n js lib separated for each country to reduce size), Date formatting, Numeral formatting, Custom delimiter, prefix and blocks pattern, CommonJS / AMD mode, ReactJS component port.
Requirements: –
Demo: http://nosir.github.io/cleave.js/
License: Apache License
