October 13, 2020 Smashing Newsletter: Issue #270

Editorial

For this newsletter, we are featuring some of the little tools and helpers that make your work life that bit easier. I love finding out about these applications, that are often quite tiny things, but make a lot of difference when it comes to productivity. When I switched from Mac to Windows, it was the small tools that I missed the most — as often those aren’t cross-platform. It’s great therefore to see so many cross-platform or browser-based tools that are available to everyone.

One of the tools that helped me with my platform switch is Everdo, which is a cross-platform Getting Things Done (GTD) focused task manager. I had used OmniFocus on the Mac and worried I would struggle to find a replacement. For Windows users who would like to use Mac peripherals I can also recommend Magic Utilities. I use the Magic Trackpad driver, as there really are no decent external trackpads for Windows.

This week is SmashingConf Austin online, so perhaps I will see some of your there. I’ll be chatting to Chris Coyier later today about writing for technical publications, and then tomorrow talking about new things coming to CSS. You can still grab a ticket if you are quick!

— Rachel Andrew (@rachelandrew)

1. Reduce Tab Clutter
2. Make Team Calls Without Background Noises
3. Get Stuff Done With The Command Line
4. Test Your Forms With Dummy Data
5. Preview And Debug Your Site Inside VS Code
6. Untangle Your Bookmark Mess
7. Master TypeScript In 50 Short Lessons
8. Coming Up Next on Smashing

1. Reduce Tab Clutter

How many tabs do you have open in your browser window as you read this? Too many? Well, then OneTab might be for you. The browser extension (available for Chrome and Firefox) helps reduce tab clutter and, as a result, saves you up to 95% memory.

The idea is simple yet effective: Click the OneTab icon to convert all your open tabs into a list. When you need to access them again, you can either restore them individually or all at once. In case you want to share your tabs with others or keep them for future reference, OneTab also comes with a feature that lets you upload the list into a web page. Less clutter, less CPU load. Win win! (cm)

2. Make Team Calls Without Background Noises

The dog barking, kids screaming, or a construction site right outside your window — there are a lot of noises that interrupt a call or a virtual team meeting in these times where working from home has become the new normal. If you’re surrounded by a constant hustle and bustle and are afraid that it might distract your call partners, why not let AI ease the situation?

The AI-powered tool Krisp does exactly that: By clicking a button, it removes the background noise from you to other call participants when you speak, and the other way around. Whether you want to have noise-free virtual meetings or plan to record a podcast even though your apartment is located on a busy street, Krisp works in over 800 conferencing, voice messaging, streaming, and recording apps. Audio processing happens locally which means that no voice or audio will leave the device. Worth trying out. (cm)

3. Get Stuff Done With The Command Line

For some, the command line is a coder’s best friend, to others it might feel more like a daunting enemy. Fact is, there are a lot of awesome things you can do with terminal. Marcel Bischoff curates a list that is jam-packed with useful command line apps.

The list covers everything from automation and backup to encryption, productivity, version control, and much more that is bound to make a developer’s life easier. Even games are featured to sweeten up a long coding session. Your favorite command line app isn’t part of the list yet? You are highly encouraged to contribute to it, of course. One for the bookmarks. (cm)

4. Test Your Forms With Dummy Data

Testing forms can be a time-consuming process, but, luckily, it’s a task that can easily be automated. The browser extension Fake Filler was built to do just that.

Available for Chrome and Firefox, Fake Filler helps you test your forms quickly and efficiently by filling all form inputs with dummy data and randomly selecting radio buttons, dropdown menus, and checkboxes. The tool supports the maxlength property and ignores CAPTCHA, hidden, disabled, and readonly fields. A great little addition to any developer’s digital toolkit. (cm)

5. Preview And Debug Your Site Inside VS Code

Now wouldn’t it be cool if you didn’t have to switch from your code editor to the browser all the time to see a preview of the project you’re working on? If you’re using VS Code, it’s actually possible. With the help of the “Browser Preview for VS Code” extension.

Powered by Chrome Headless, the extension enables you to open a real browser preview inside your editor that you can debug. You can have multiple previews open at the same time and even attach Chrome DevTools and Debugger for Chrome. “Browser Preview for VS Code” is available for free download in the VisualStudio marketplace, and, once installed, you can trigger the feature by clicking the button or running a short command. Another step towards a more productive development workflow. (cm)

6. Untangle Your Bookmark Mess

Do you have a dedicated system for storing all those useful tools and articles that might come in handy someday, the books you plan to read, the recipes you want to give a try, and all those other little bits of inspiration you come across when browsing the web? If your bookmarks are overflowing with precious goodies but you’ve lost track of them, a little tool is just waiting to help you untangle that bookmark mess: Raindrop.io.

Raindrop.io lets you sort your bookmarks into collections and assign tags to them that make it easier to quickly find what you’re looking for, and, if you want, you can even share these collections with team members and friends. The tool works seamlessly across devices and is also available in a premium version that comes with additional features such as a duplicate and broken link finder, full-text search for the websites you saved, a Cloud backup, and more. Nice! (cm)

7. Master TypeScript In 50 Short Lessons

In the land of Smashing news, we’ve just published a new book. We’ve teamed up with Stefan Baumgartner, a seasoned JavaScript developer who has been drawn to TypeScript for years to help us break TypeScript down in one place: Meet “TypeScript in 50 Lessons,” our shiny new book, with everything TypeScript explained, from start to finish.

The eBook is already available in Amazon Kindle, PDF and ePUB formats. We’ll start shipping printed copies in November 2020. You can download a free PDF sample and jump to the table of contents if you like. Happy reading, everyone! (vf)

8. Coming Up Next on Smashing

With Smashing Membership, you get access to goodies, eBooks, discounts and live sessions with experts — all around front-end & UX, for just one coffee a month. Coming up next:

• “All About Icons” with Marc Edwards— October 20 at 11:00 London time

We also have online workshops on front-end & UX — designed to give you the same experience and access to experts as in an in-person workshop, but without needing to leave your desk.

• Web Performance Masterclass (Oct 12–26)
• Designing for Emotion Masterclass (Oct 28–29)
• Front-End Accessibility Masterclass (Nov 6–20)
• Designing Websites That Convert (Nov 18–26)
• Smart Interface Design Patterns, 2020 Edition (Dec 1–16)
• Building A Design System With CSS (Dec 3–17)
• Build, Ship and Extend GraphQL APIs (Jan 5–19)
• Form Design Masterclass (Jan 19–27)

Or, if you’d like to run an online workshop with your team, please get in touch with Vitaly at vitaly@smashingconf.com and briefly describe what problems you’re facing and would like to solve. Get in touch — it’s that easy! (vf)

Smashing Newsletter

Useful front-end & UX bits, delivered once a week. Subscribe and get the Smart Interface Design Checklists PDF — in your inbox. 🎁

Your (smashing) email Subscribe →

Front-end, design and UX. Sent out 1× a week.
You can always unsubscribe with just one click.