Issue #209 (Keeping Up, CSS/HTML, Build Tools, Mobile)07/20/17
At one of my previous jobs working for a web design and development agency, one of the things that was strongly encouraged was spending at least one hour every day reading up on news, design inspiration, keeping up with new features, tools, etc.
This was around 2008-2010, so that was basically at about the time when design and development blogs started popping up everywhere. Smashing Magazine and CSS-Tricks had just started to gain popularity and many other blogs started to mimic their styles.
This was also about the time period that GitHub had launched and was gaining momentum, eventually leading to what I like to call the Cambrian Explosion of Tools, which continues to this day.
I think most places that employ web developers and designers recognize the value of spending time each day learning new tools, experimenting, or just reading some dailies and weeklies to catch up on news.
Does your workplace encourage this sort of thing? Do you like to start your day by catching up on RSS or email subscriptions? Or do you prefer to do it at the end of the day? Or maybe you're too busy most days and you like to wait until there's down time.
If you have any interesting stories to share in this regard as to what works best for you in trying to keep up with stuff, and how your employer feels about that, feel free to respond to this email and let me know.
Now on to this week's tools!
|
CSS and HTML Tools
styled-components
Now at version 2+. Uses ES6 template literals and the power of CSS to allow you to attach CSS to your React components while removing mapping between components and styles.
sakura
A minimal classless CSS framework and theme.
Behaviors.js
A set of small dependency-free JavaScript modules that allow you to define dynamic page behaviors via HTML attributes.
shed.css
Functional and customizable CSS utilities with familiar names.
coolHue
A library of hand-picked CSS gradients.
COLORION
Gradient buttons with hover effects.
Microtip
A modern, elegant and minimal, CSS-only tooltip library.
Flex Layout Attribute
Layout helper based on the flexbox specification designed to serve as a quick flexbox shorthand by using two custom HTML attributes — 'layout' and 'self'.
|
Task Runners, Build Tools, etc.
Bundle Buddy
Helps you find source code duplication across your JavaScript chunks/splits.
Bonsai
A JavaScript code analyzer that helps speed up your website by focusing on module size and the cumulative size of all downstream dependencies.
JSON Schema to TypeScript Converter
Online tool, title says it all.
Pingy CLI
Gulp, Grunt, etc., are great for complicated build workflows. Sometimes you want something simpler that doesn't take lots of configuration to get up and running.
unpkg.com/getlibs
An in-browser module loader configured to get external dependencies directly from CDN.
decaffeinate
Online CoffeeScript to ES6 converter.
Beautify Tools
A whole slew of free online converter tools, beautifiers, minifiers, validators, utilities, and lots more.
|
RWD and Mobile Tools
metro-bundler
The JavaScript bundler for React Native.
Swip
A library to create multi device experiments. You have to watch the video demos to see this in action, pretty cool stuff.
Configure.IT
Mobile app development platform that lets you build native apps in your browser, without coding.
SmartPhoto.js
Mobile-friendly image viewer (like a lightbox) plugin.
Application Craft
Visual mobile and desktop development in the cloud, for developers of all skill levels.
AppMakr
Drag and drop mobile apps for your iPhone, Android, and Mobile web customers.
|
A Tweet for Thought
Harry Roberts' advice on future-proofing your code. More discussion/tips in the original thread too.
Suggestions / Corrections
Made something? Send links via Twitter @WebToolsWeekly (details here). No tutorials or articles, please. If you have any suggestions for improvement or corrections, feel free to reply to this email.
Before I Go...
searchlibs looks like a comprehensive and easy to use JavaScript library search engine. Thanks to all for subscribing and reading!
Keep tooling,
Louis
webtoolsweekly.com
@LouisLazaris
|
|
