tech/webdev magazine

March 30, 2021

How To Boost Media Performance On A Budget

Tuesday, March 30, 2021 Teklinks No comments

9 min read Business, Performance, User Experience Saved for offline reading Share on Twitter, LinkedIn How do we get media performance right while staying within performance budgets? Let’s take a look at the recent stats and data around performance budgets, video playback performance issues and s

Full article

March 29, 2021

SVG Generators

Monday, March 29, 2021 Teklinks No comments

In a new series of posts, we highlight some of the useful tools and techniques for developers and designers. Last weeks, we’ve covered CSS auditing tools, CSS generators and accessible front-end components. This time around, let’s look at SVG generators — for everything from shapes and backgrounds to SVG path visualizers and SVG → JSX generators.

Full article

10+ Best Node.js CMS Platforms To Use In 2021

Monday, March 29, 2021 Teklinks No comments

NodeJS is a platform built on Chrome's JavaScript runtime for easily building fast and scalable network applications. Previously, whenever someone mentioned CMS, your mind would have thought of platforms like Joomla, Drupal, etc. But now, Node.js-based CMS platforms are the talk of the town.

Full article

Upgrading to React 17 and Webpack 5

Monday, March 29, 2021 Teklinks No comments

I have been working with React for several years now. So far, after each release, it always excited to try out new features. But this wasn’t the case with React 17. It was advertised as a No New Feature release.

Full article

March 27, 2021

Cypress Web Automation

Saturday, March 27, 2021 Teklinks No comments

In this article, we will discuss Cypress, an open-source test automation tool for testing web applications. Compared to Selenium, Cypress has more advantages. Introduction Cypress is an open-source test automation tool for testing web applications.

Full article

March 25, 2021

From semantic CSS to Tailwind - Refactoring the Netlify UI codebase

Thursday, March 25, 2021 Teklinks No comments

The React codebase that powers app.netlify.com is about five years old. During these five years, the focus has mostly been on high-speed growth, as most start-ups do. For this reason, what started with organised PostCSS gradually grew to become a complex and entangled global CSS architecture with a lot of specificity and overrides.

Full article

March 24, 2021

Debugging Libraries: JavaScript Edition

Wednesday, March 24, 2021 Teklinks No comments

DevTools provide a great debugging environment, with visual breakpoints, watchers, file navigation, and more. Visual Studio Code is another great option. In order to learn more and understand which files you should be debugging, you can run npm edit to open a package in your favorite text editor.

Full article

React API evolution

Wednesday, March 24, 2021 Teklinks No comments

React is ~8 years old. I remember the day when I saw the first demo — I was amazed at how genius yet how simple it was! I still carry that excitement to this day. During this time React changed a bunch, but its core ideas have sayed the same.

Full article

Handling Text Over Images in CSS

Wednesday, March 24, 2021 Teklinks No comments

You might come across a UI component that has text above an image. In some cases, the text will be hard to read depending on the image being used. There are some different solutions like adding a gradient overlay, or a tinted background image, text-shadow, and others.

Full article

March 23, 2021

CSS Auditing Tools

Tuesday, March 23, 2021 Teklinks No comments

How large is your CSS? How repetitive is it? What about your CSS specificity score? Can you safely remove some declarations and vendor prefixes, and if so, how do you spot them quickly? Over the last few weeks, we’ve been working on refactoring and cleaning up our CSS, and as a result, we stumbled upon a couple of useful tools that helped us identify duplicates. So let’s review some of them.

Full article

Just-In-Time: The Next Generation of Tailwind CSS

Tuesday, March 23, 2021 Teklinks No comments

One of the hardest constraints we've had to deal with as we've improved Tailwind CSS over the years is the generated file size in development. With enough customizations to your config file, the generated CSS can reach 10mb or more, and there's only so much CSS that build tools and even the browser itself will comfortably tolerate.

Full article

Use Logpoints!

Tuesday, March 23, 2021 Teklinks No comments

There's sometimes a tribal attitude about how web developers should be debugging their code and solving problems. There's the console.log loyalists, then there's the debugger/breakpoint maximalists.

Full article

March 22, 2021

March 20, 2021

Canvas vs SVG: Choosing the Right Tool for the Job

Saturday, March 20, 2021 Teklinks No comments

HTML5 Canvas and SVG are both standards-based HTML5 technologies that you can use to create amazing graphics and visual experiences. The question I’m asking in this article is the following: Should it matter which one you use in your project? In other words, are there any use cases for preferring HTML5 Canvas over SVG?

Full article

The State of User Research 2021 Report

Saturday, March 20, 2021 Teklinks No comments

For our 2021 report, we collected responses through our newsletter and social media channels (Twitter, LinkedIn, and Facebook) and by posting in Slack, Facebook, and LinkedIn communities. The breakdown of responses from our own channels versus external communities was an even 50/50 split.

Full article

How to Screen Record on Your Chromebook

Saturday, March 20, 2021 Teklinks No comments

Recording your smartphone or computer’s screen can be useful, but sometimes you have to download third-party apps to do it. Fortunately, Chromebooks have a built-in tool that makes it easy to create screen recordings with no extra software required.

Full article

March 19, 2021

Awesome Git Aliases

Friday, March 19, 2021 Teklinks No comments

Git is an amazingly powerful tool. It can keep track of all the code you write, let you organize your work into different branches, help you seamlessly work with other developers, and even let you time travel and make changes.

Full article

March 17, 2021

March 16, 2021

March 14, 2021

Multi-Tenant Architecture

Sunday, March 14, 2021 Teklinks No comments

In a multitenancy environment, multiple customers (tenants) share the same application, running on the same operating system, on the same hardware, with the same data-storage mechanism. The distinction between the customers is achieved during application design.

Full article

NFTs are both priceless and worthless

Sunday, March 14, 2021 Teklinks No comments

It is no longer possible to ignore NFTs, the crypto off-shoot that can tie intangible assets to specific, unalterable tokens. Interest in NFTs (non-fungible tokens) has spiked over the last year, and is now breaking into the mainstream with several headline-grabbing deals.

Full article

March 13, 2021

March 10, 2021

10 Ways to Combat Project Burnout

Wednesday, March 10, 2021 Teklinks No comments

Have you ever been on a project where you can’t seem to catch up? You’re limited on time but there is too much to do? Or you’re struggling to make progress on a hard or nebulous problem? If so, you may be on the road to burnout.

Full article

March 9, 2021

SmolCSS

Tuesday, March 09, 2021 Teklinks No comments

Create an intrinsically responsive grid layout, optionally using a CSS custom property to extend to varable contexts. Each column will resize at the same rate, and break to a new row if the width reaches the --min value.

Full article

March 7, 2021

REST vs GraphQL: Making the Right Choice

Sunday, March 07, 2021 Teklinks No comments

Understand the core differences between REST and GraphQL when designing APIs, and consider four simple points to help you decide between these options. Origins in a Facebook Case Study In order to better understand the "REST vs. GraphQL" debate, it is useful to look at where GraphQL originates.

Full article

March 6, 2021

Elegant Frontend Architecture

Saturday, March 06, 2021 Teklinks No comments

Software design and architecture is not something you can install with npm. If you disagree, nothing is stopping you from installing an opinionated JavaScript framework that can solve all your problems with a CLI generator.

Full article

Let’s Create a Custom Audio Player

Saturday, March 06, 2021 Teklinks No comments

HTML has a built-in native audio player interface that we get simply using the audio element. Point it to a sound file and that’s all there is to it. We even get to specify multiple files for better browser support, as well as a little CSS flexibility to style things up, like giving the audio player a border, some rounded corners, and maybe a little padding and margin. But even with all that… the rendered audio player itself can look a little, you know, plain.

Full article

March 4, 2021

Manage technical quality

Thursday, March 04, 2021 Teklinks No comments

If there's one thing that engineers, engineering managers, and technology executives are likely to agree on, it's that there's a crisis of technical quality. One diagnosis and cure is easy to identify: our engineers aren't prioritizing quality, and we need to hire better engineers or retrain the ones we have.

Full article

March 3, 2021

Better git diffs with FZF

Wednesday, March 03, 2021 Teklinks No comments

The setup instructions in this article are for Mac, but you should be able to do this on Linux and Windows Subsystem for Linux. Hat tip to Kevin LaFlamme for showing what’s possible with FZF. You should follow him here. Sometimes I find the git diff command a little inconvenient.

Full article