Issue #249 (Computed Obj Props, Uncats, JSON, JS Utils)04/26/18
Secure and Manage Your Apple Devices
Jamf Now is a device management solution for Apple devices. It's cloud-based, so you can manage devices from anywhere. Not tech savvy? It's easy to manage Apple devices with Jamf Now and your first 3 devices are free, forever!
Create your account!
|
|
As you might be aware, properties of objects can be defined using variables or even as strings with spaces in the property names, as long as you use square brackets, as in the following:
|
var myObj = {},
myProp = 'example property';
myObj['other prop'] = 'example value';
myObj[myProp] = 'another value';
console.log(myObj);
// {other prop: "example value",
// example property: "another value"}
|
View JSFiddle
The first property of myObj contains a space and the second property is defined using an existing variable. But the problem here is you can't access these property names using dot notation. This is because of the space in the property name.
You can also use a space for the property name in an object literal, as follows:
|
var myObj = {
'example prop': 'example value'
};
|
But if you try to drop a variable on the left side of the colon, it won't work. You won't get the value of the variable, you'll just have a property on that object equal to that variable's name. See this JSFiddle for an example.
ES6 now allows you to include computed property names in object literals. So the following is now valid (notice the square brackets):
|
let myVar = 'example prop';
let myObj = {
[myVar]: 'example value'
};
console.log(myObj);
// {example prop: "example value"}
|
View on JSFiddle
Notice, in contrast to the previous demo, the myVar property name now computes to the value it holds. This means you can also use string concatenation within the square brackets to define the property name.
Yet another minor but convenient feature that makes JavaScript just a little easier to work with.
Now on to this week's tools!
|
The Uncategorizables
Jamf Now
A device management solution for Apple devices. It's cloud-based, so you can manage devices from anywhere. Not tech savvy? It's easy to manage Apple devices with Jamf Now and your first 3 devices are free, forever! sponsored via Syndicate
Text2MindMap
Online tool to convert indented lines of text into a "mind map" (a diagram used to visualize information).
Site Palette
Chrome extension to generate comprehensive color palettes from a website. Provides Sketch and Adobe Swatch downloadables.
Lunacy
Native Windows app that works offline and supports .sketch files.
Figma Web API
Enables apps, websites and internal tools to integrate directly with the real-time state of design in Figma from a robust Web API and open JSON format.
Caramella
A modern blog platform with 80+ templates or just a blank slate. Responsive layouts, private drafts, 20+ content widgets.
Hearth
Aims to be your decentralized website publisher. Publish your personal websites and share files, quickly and easily, without relying on third parties.
Triplebyte
Helping engineers find great startups. No resumes or whiteboard. Apply to multiple top tech companies at once.
MongoDB Stitch
Backend as a service. Configure your application backend in the cloud.
Google Apps Script
Create add-ons for Google Sheets, Docs, Slides, or Forms, automate your workflow, integrate with external APIs, and more.
Noderize
Create a Node app with one command in less than 30 seconds. Get started on coding and forget about configuration.
Cockpit
A server manager that makes it easy to administer your GNU/Linux servers via a web browser.
|
|
Recommended Reading (Affiliate Links via Amazon)
|
Databases, JSON, etc.
BizarroDevs
A curated newsletter with all the cool, wacky and the obscure tech news on a weekly basis (you’ll get it on Tuesdays). Is free and will help you earn the most Slack reactions in your office. sponsored
JMESPath
A query language for JSON, based on a complete specification and has a compliance test suite.
devalue
Like JSON.stringify, but handles cyclical references, repeated references, undefined, Infinity, NaN, -0, regular expressions, dates, and Map and Set.
JSON Viewer
Chrome extension. A port of Firefox's JSON Viewer. Open a JSON file in the browser and it's parsed and given syntax highlighting and object collapse/expand.
Onomics
Paste tab-delimited CSV (straight from Excel, for example) to generate a chart.
UnQlite
Library that implements a self-contained, serverless, zero-configuration, transactional NoSQL database engine. It's a document store database similar to MongoDB, Redis, etc.
Prisma
Turn your database into a GraphQL API. A real-time GraphQL database layer. Connect directly from the front end or build your own GraphQL server.
jasonette.agent
Microservices on the front end. A new architecture for building native mobile apps that utilizes JavaScript technologies without sacrificing native performance and user experience.
Xmysql
One command to generate REST APIs for any MySQL database.
Mark Notation
A simple and unified notation for both object data, like JSON, and markup data, like HTML and XML.
Select Transform
Query any JSON tree to select exactly the subtree you are looking for. Transform any JSON object to another by parsing with a JSON template.
|
JavaScript Utilities and Modules
immutad●t
A set of immutable functions using dot notation. Gives you a short and meaningful syntax to apply operations on immutable structures.
TypeWiz
Automatically discover and add missing types in your TypeScript code.
Prompts
Lightweight, beautiful and user-friendly interactive prompts.
ScrollBooster
Enjoyable content drag-to-scroll library. Try the demo to see exactly what that means. Pretty neat.
loaderz
A very easy-to-use asset loader using Promises. Supports images, audio, and video.
FilePond
JavaScript library that can upload anything you throw at it, optimizes images for faster uploads, and offers a great, accessible, silky smooth UX.
Rematch
Redux best practices without the boilerplate. No more action types, action creators, switch statements or thunks.
Typa
A super-simple dependency-free JavaScript type checker.
Peekaboo
Fires a one-time event whenever elements of your choice are about to scroll into the viewport. Perfect for triggering animations or for lazy loading assets.
normalize-url
Useful when you need to display, store, deduplicate, sort, compare, etc, URLs.
|
A Tweet for Thought
The recent "the dots matter" Gmail problem that was discovered by James Fisher was discussed extensively in this Twitter thread, including some comments from Google and Netflix engineers.
Send Me Your Tools!
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...
If you're building an app, you might want to use The-Big-Username-Blacklist, which provides an opinionated list of words you shouldn't allow users to register as usernames.
Thanks to all for subscribing and reading!
Keep tooling,
Louis
webtoolsweekly.com
@LouisLazaris
|
|
