Smashing Newsletter #270: Little Helpful Tools and Browser Extensions

Little time savers to remove background noise, reduce tab clutter, test forms with dummy data, and preview and debug in your text editor. Issue #270 Tue, Oct. 13, 2020 View in the browser 💨

Smashing Newsletter

Dear Friend,

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)


Table of Contents

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
9. New On Smashing Job Board
10. Our Current Most Popular Articles

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.

OneTab

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?

Krisp

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.

Awesome 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)


From our sponsor

Get Unlimited Access To Over 1 Million Fonts & Graphics For Just $1

Creative Fabrica is the leading creative marketplace offering access to over 1 million fonts & designs from 5000+ designers worldwide. Each day 4000+ new resources are added.
Creative Fabrica is the leading creative marketplace offering access to over 1 million fonts & designs from 5000+ designers worldwide. Each day 4000+ new resources are added.

You can now get unlimited access for the first month for just $1 (normally $29). Not a fan? You can cancel anytime.


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.

Fake Filler

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)


From our sponsor

Build In-Demand Skills In Northwestern’s Online MS In Information Design And Strategy

Work at the Intersection of Data, Design and Technology. Earn your master’s degree online at Northwestern Information Design and Strategy.
Earn your master’s degree online.


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 bookmark manager

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.

Master TypeScript in 50 Short Lessons

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

Practicing skills matters. Meow!
Meet Smashing Online Workshops on front-end and UX with Cassie Evans, Christian Nwamba, Harry Roberts, and many others.

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.

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)


9. New On Smashing Job Board


10. Our Current Most Popular Articles


This newsletter issue was written and edited by Cosima Mielke (cm), Vitaly Friedman (vf), Rachel Andrew (ra) and Iris Lješnjanin (il).


Sent to truly smashing readers via Mailchimp.
We sincerely appreciate your kind support. You
rock.

Follow us on Twitter Join us on Facebook


unsubscribe update preferences view in your browser


Older messages

Master TypeScript in 50 Short Lessons

Wednesday, October 7, 2020

Our new book on TypeScript, how it works, and how you can make it work for you. With code walkthroughs, hands-on examples and common gotchas. TypeScript, from start to finish! TypeScript in 50 Lessons

Smashing Newsletter #269: Git, Design Systems, TypeScript, CSS clamp()

Tuesday, October 6, 2020

With linear scale with CSS clamp(), TypeScript, Git cheatsheets, design systems and 3D keyboards. Issue #269 • Tue, Oct. 6, 2020 • View in the browser 💨 Smashing Newsletter Dear Friend, Our experiences

Smashing Newsletter #268: UX Edition

Tuesday, September 29, 2020

With disabled buttons, bottom navigation, flags and online banking. Issue #268 • Tue, Sept. 29, 2020 • View in the browser 💨 Smashing Newsletter Dear Friend, This week, our theme is user experience

Smashing Newsletter #267: Accessibility, Inspiration and Debugging Strategies

Tuesday, September 22, 2020

With tips on accessibility, design inspiration, and strategies to help you debug. Issue #267 • Tue, Sept. 22, 2020 • View in the browser 💨 Smashing Newsletter Dear Friend, I never get tired of being

Smashing Newsletter #266: JavaScript Edition

Tuesday, September 15, 2020

With free JavaScript libraries, debugging and scrolling elements into view Issue #266 • Tue, Sept. 15, 2020 • View in the browser 💨 Smashing Newsletter Dear Friend, Last week was Smashing

You Might Also Like

Cascade, HTMX, Sponge Furniture, Meaning of Color, Flipbook

Friday, April 26, 2024

The 5 best design links, every day. Curated by a selection of great editors. Email not displaying properly? View browser version. Sidebar April 26 2024 A primer on the cascade and specificity piccalil.

9 Trends From Milan We Can’t Stop Thinking About

Thursday, April 25, 2024

View in your browser | Update your preferences ADPro Even More From Milan Design Week Each year, the design world convenes in Milan—and that applies to us at AD, too. For the third year running, our

Subframe, Attributes vs Properties, Front End Handbook, aspect-ratio, GenAI

Thursday, April 25, 2024

The 5 best design links, every day. Curated by a selection of great editors. Email not displaying properly? View browser version. Sidebar April 25 2024 Subframe subframe.com Subframe is a design-to-

Ritmo, Climate Change, Icons & Typefaces, Click Wheel JS, CarPlay

Wednesday, April 24, 2024

The 5 best design links, every day. Curated by a selection of great editors. Email not displaying properly? View browser version. Sidebar April 24 2024 Meet Ritmo, Musixmatch's cross-platform

Why Jake Arnold Doesn’t Text Clients

Tuesday, April 23, 2024

View in your browser | Update your preferences We've had a remodel! From now on, you'll be hearing from AD PRO in your inbox twice a week—once with a deep dive into trends to watch and subjects

The secret ingredient to media success

Tuesday, April 23, 2024

PR tips from our founder Nora Wolf In this month's edition is all about *the most important* element of successful media outreach—photography. You may have some photos, but if the backgrounds are

#453: Design Systems

Tuesday, April 23, 2024

Design system generator, types of design systems and how to consolidate design systems. Issue #453 • Apr 23, 2024 • View in the browser Smashing Newsletter Buổi tối vui vẻ Smashing Friends, Ah, design

👨‍🏫 Striking Educational Website Designs + 🏆 Challenge Updates

Tuesday, April 23, 2024

Your UpLabs Design Updates Await! Let's Get Going! 🎨 Firstly, let's congratulate Mariana Gameiro, the winner of our latest 👩‍💻 SheCodes Website Redesign Challenge! Congratulations!! Secondly,

Code Connect, JS Naked Day, Shape of AI, Product Design, CSS Grid Level 3

Tuesday, April 23, 2024

The 5 best design links, every day. Curated by a selection of great editors. Email not displaying properly? View browser version. Sidebar April 23 2024 The Right Code for Your Design System figma.com

Accessibility Weekly #393: When Security and Accessibility Clash

Monday, April 22, 2024

April 22, 2024 • Issue #393 View this issue online or browse the full issue archive. Featured: When security and accessibility clash: Why are banking applications so inaccessible? "While using