Issue #251 (ES6 Sets cont'd, Productivity, React, Git/CLI)05/10/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!
|
|
In the previous tip, I introduced ES6's new sets feature, a more practical use-case specific alternative to arrays. With that introduction in mind, here are some other things worth noting when using sets.
Sets don't coerce values when making comparisons as sometimes happens in other parts of the language. For example:
|
let set = new Set([1, "1", 2, 2, 3, 3]);
console.log(set.size); // 4
console.log(set.has("1")); // true console.log(set.has("2")); // false
|
Try it on JS Bin
Keeping in mind that a set cannot contain duplicates, notice in the above code I've included 1 and "1" as separate entries in the array. But in the final set, they are considered different, so the string "1" is not coerced into a number. The second 2 on the other hand, is a duplicate so it's removed.
Another point to take note of is what happens with duplicate objects:
|
let set = new Set(),
obj1 = {},
obj2 = {};
set.add(obj1);
set.add(obj2);
console.log(set.size); // 2
|
Try it on JS Bin
Notice here I'm using the add() method to add two objects as the only items in the set. Although the objects are exactly the same, they are not considered duplicates, so both are kept. If the objects were converted to strings, however, then they would be considered duplicates and one would be stripped out.
Finally, in addition to the methods I've already mentioned, you also have access to the delete() method, which removes a single item from a set, and the clear() method, which will clear all items from the set:
|
let set = new Set([1, 2, 3, 4, 5]);
console.log(set.size); // 5
set.delete(3);
console.log(set.size); // 4
console.log(set.has(3)); // false
set.clear();
console.log(set.size); // 0
|
Try it on JS Bin
As you can see, the third item is removed using delete() (confirmed using the size property and the has() method). Then the entire set is cleared, leaving it with zero items.
Now on to this week's tools!
|
Productivity Tools
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
Rhythm App
A simple daily markdown-based notebook, calendar, and task list.
Nudgeti
Chrome and Firefox extension that gives you a nudge when you spend too much time on certain websites. It's a gentler alternative to website blockers.
Spoke
Help desk ticketing software with a simple design and artificial intelligence (AI), for IT and HR support teams that need to stay productive and keep employees happy.
Facebook Container
Firefox extension. Isolates your identity into a separate container tab, making it harder for Facebook to track you on the web outside of Facebook.
EasyEmail
An AI that helps you quickly compose personalized emails in Gmail.
Save Text...
Chrome extension. Select whatever you want to save as PDF, Word, Excel, or email it directly to someone.
Pretzel
A smart, simple desktop app for Mac that shows and searches keyboard shortcuts based on your currently focused app.
Tet
Android app that deletes all your tasks at the end of the day. Complete your tasks before Tet deletes them.
Simple Print
Convert web articles into printable PDFs for Letter, A4, or A5 paper size.
Jitsi
A set of open-source projects that allows you to easily build and deploy secure videoconferencing solutions.
FoldingText
A markdown text editor for Mac with productivity features. Unlike other editors, does outlining, todo lists, and more.
|
|
Recommended Reading for Developers
|
React Tools
react-web-animation
React components that expose the Web Animations API.
react-check-auth
A tiny React component that helps you make auth checks declarative in your React or React Native app.
react-path-recognizer
Path recognizing component for React (that is, it captures a mouse's movement, with the ability to draw the path).
react-copy-write
An immutable React state management library with a simple mutable API, memoized selectors, and structural sharing.
react-smooth-dnd
Fast and lightweight drag-and-drop, sortable library for React with many configuration options covering many scenarios. Uses hardware-accelerated CSS transitions for animations.
React Credit Cards
Beautiful credit cards for your payment forms. A modern credit card component for React.
Create Content Loader
SVG component for React and Vue to create placeholder loading, like Facebook cards loading or also known as skeleton UI.
RecyclerListView
A high performance listview for React Native and web with support for complex layouts.
React Velocity
Application that allows you to visualize your React project's component hierarchy before exporting the requisite boilerplate code.
react-spring
A set of simple, spring-physics based primitives (as in building blocks) that should cover most of your UI related animation needs outside of CSS.
Unstated
State management so simple, it goes without saying.
|
Git, GitHub, and Command Line Tools
ink-link
Creates clickable links in the terminal.
imaging-heap
A command line tool to measure the efficiency of your responsive image markup across viewport sizes and device pixel ratios.
gitkube
Build and deploy Docker images to Kubernetes using `git push`.
Chattt
Chat without leaving your terminal.
Wunderbar
Print a horizontal bar chart with legend and chart scale straight to your terminal. Or use it as a module in your code and print the chart yourself.
asciinema
Now at version 2+. Forget screen recording apps and blurry video. Enjoy a lightweight, purely text-based approach to terminal recording.
Emma
Terminal assistant to find and install node packages.
Birdperson
Client side-only web app to monitor your (or your team's) open merge requests and pipeline status on GitLab.
GitHub Pull Request Tree
Make GitHub pull requests better with a file tree view and other UX improvements.
git-gud
A simple Git commit checker.
|
|
