Better sharing buttons, smarter caching, a cool new code editor and lots of clever interface hacks.
This month we’ve got a collection of handy utilities that help you to do things in smarter ways: better forms; better select boxes; better social media sharing buttons that don’t have annoying behaviours such as tracking the user. There’s a service worker that improves caching by only downloading changes instead of the whole file, and a tool for handling user-generated content on static sites. Enjoy!
01. Visual Studio Code
People are saying good things about this free, open-source code editor from Microsoft that has a slew of great features that make coding quicker. There’s a function called IntelliSense that provides smart completions; built-in Git commands; debugging from within the editor and much more.
02. WTF, forms?
Bootstrap creator Mark Otto has made these friendlier HTML form controls to make it easier to build forms the way you want them. Designed for IE9+ and the latest Chrome, Safari, and Firefox.
People usually use a third-party service to run things like commenting systems on static sites, but there’s another way. Staticman transforms user generated content into data files that are hosted in your GitHub repository with the rest of your content, so everything is in one place. Works well with Jekyll sites hosted on GitHub Pages.
This neat web app uses d3.js to transform images into tessellated triangles. If you’re interested in creative coding, this blog post provides some background about the methods used.
Choices is a select box and text input plugin that’s lightweight (around 15kb gzipped), customisable and have no jQuery dependency. There’s configurable sorting, flexible styling, fast search/filtering, a clean API and right-to-left support.
Here’s a really great service worker to help with continuous delivery. Without it, every time a file is changed – even if the change is only one letter – the whole new version gets downloaded, wasting bandwidth and hurting performance. SW-delta compares the new version with the cached version and makes the browser download only the changes instead of the whole file. The creator says it isn’t production ready yet, but if you think this could be of use to you it’s a great project to jump on board with.
09. SVG Porn
Don’t worry; it’s not porn made of SVG. This site has around 800 high-quality logos done in SVG for lots of different services, available for your use.
10. Jekyll Compress
This Jekyll layout compresses HTML by removing whitespace and any other unnecessary elements. It is written in Liquid, the open-source templating language created by e-commerce platform Shopify.
Originally by: Tanya Combrinck from Creative Blog.