Ad blocking is one of the hot topics in website design and development right now. Adblock Identifier is a sweet little tool that detects ad blocking software and creates an alert for users that functionality will be disabled if the ad block is left running.
Installation is key with this tool and you should follow the instructions carefully. Customization options include the title, description and theme for how the message looks. It comes with light and dark options with a light default. You have a few customization options to think about, including the text in the alert message. The tool allows you to keep users from specific content if they are using ad block software or just warn them for next time.
Requirements: –
Demo: https://github.com/balajmarius/Adi.js
License: License Free
Copying text to the clipboard shouldn’t be hard. It shouldn’t require dozens of steps to configure or hundreds of KBs to load. But most of all, it shouldn’t depend on Flash or any bloated framework. That’s why clipboard.js exists. This library relies on both Selection and execCommand APIs. The second one is supported in the following browsers: Chrome 42+, Firefox 41+, IE 9+, Opera 29+, Safari X.
Requirements: JavaScript Library
Demo: http://zenorocha.github.io/clipboard.js/
License: MIT License
ESLint is an open source JavaScript linting utility originally created by Nicholas C. Zakas in June 2013. Code linting is a type of static analysis that is frequently used to find problematic patterns or code that doesn’t adhere to certain style guidelines. There are code linters for most programming languages, and compilers sometimes incorporate linting into the compilation process.
The primary reason ESLint was created was to allow developers to create their own linting rules. ESLint is designed to have all rules completely pluggable. The default rules are written just like any plugin rules would be. They can all follow the same pattern, both for the rules themselves as well as tests. While ESLint will ship with some built-in rules to make it useful from the start, you’ll be able to dynamically load rules at any point in time. ESLint is written using Node.js to provide a fast runtime environment and easy installation via npm.
Requirements: JavaScript Library
Demo: http://eslint.org/
License: License Free
Vectr is a Free Design App For Web + Desktop. Today, Vectr’s desktop apps require an internet connection, but eventually Vectr’s desktop apps will be updated to run fully offline just like any other desktop app. There is Live Exports support, link your website’s graphics to Vectr documents, then update them forever without touching code. Just insert a Vectr document with an <img> tag, adding .svg, .jpg, or .png to the Vectr document’s url.
You can also Share Vectr document urls for quick visual feedback – anyone with the link will see your changes in real-time. Annotate an image, mock something up, or share a high-fidelity designs with others – no more email attachments. Don’t let Vectr’s simple interface fool you. Vectr is pro-calibre design software – but without the learning curve.
Requirements: –
Demo: https://vectr.com/
License: License Free
Modernizr has redesigned and built the site from the ground up to give the website a refresh as well as make the builder a whole lot more powerful for beginners and advanced users. From just creating a simple build to grabbing a config, to implementing in your build process, through to a really cool solution of dynamically creating a custom package that can be installed via bower. The internal structure of Modernizr has been completely revamped, making it easier to contribute to and easier to customize/extend Modernizr’s licensing has changed: they have moved from a BSD license to MIT.
Requirements: –
Demo: https://modernizr.com/
License: MIT License
Notion is an expressive and collaborative document editor that gives your ideas a place to grow. Beautiful. Lightweight. Always organized. You can create from an assortment of building blocks: to-dos, files, videos, code snippets, and more. Notion helps you work the way you think.
Tired of messy folders? They have also invented a new and intuitive way to organize: just drop one page inside another. Let your ideas grow organically. You can share your work with anyone with Notion as well. See what others are doing on your page. It’s like having your collaborators in the same room with you.
Requirements: –
Demo: http://early-access.notion.so/
License: License Free
Imagine a situation – your HTML markup renders at backend side, it contains some list of data. At one point you need to implement search by this list. It can be easily achieved by using Jets.js with a browser’s native search speed.
The main idea is not to affect attributes of each tag in the list while filtering. Instead apply dynamic CSS rule in only <style> tag and browser will decide which item of list to show or hide. Since it’s just CSS – Jets.js may be applied to any tag, whether it’s a table or UL, OL, DIV… Jets.js is a native CSS Search Engine.
Requirements: JavaScript Framework
Demo: http://nexts.github.io/Jets.js/
License: MIT License
Telepat is an open-source backend stack, designed to deliver information and information updates in real-time to clients, while allowing for flexible deployment and simple scaling. Telepat empowers modern apps for the real-time age.
Classic Web APIs deliver on-demand, static information snapshots to clients. Data soon gets outdated, and cannot be synced between multiple clients. Instead of working with data snapshots that get stale, Telepat pushes all new information from the central node to all subscribed devices, instantly.
Requirements: –
Demo: http://telepat.io/
License: Apache License
HoverCards is a chrome extension that lets you preview social links from youtube, twitter, reddit, soundcloud, imgur, & instagram. So next time your friend sends a video you’re too lazy to click, just hover for cards. HoverCards is a browser extension that gives you more context to links when you hover over them. It’s similar to how PH shows a preview of people when you hover over their images.
Requirements: –
Demo: http://hovercards.com/
License: License Free
UpUp is a tiny javascript library that makes sure your users can always access your site’s content, even when they’re on a plane, in an elevator, or 20,000 leagues under the sea. Mobile-First has become the de-facto standard for building modern sites. But in a world where everyone is mobile, an always-on connection isn’t something we can rely on. It’s time to start thinking Offline First. With UpUp you control the content your users see, even when they are offline. And you can do it with just a single JavaScript command.
Requirements: –
Demo: https://www.talater.com/upup/
License: MIT License
