Skip to main content
Published in Engineering Insights

Gnarly Learnings from November

Gnarly Learnings from November
Table of contents
  1. The Javascript RORO pattern
  2. The Invisible Javascript Backdoor
  3. The Value in Value Objects
  4. State Management Showdown: Redux vs. Context API
  5. Importing SVGs as React Components
  6. Ordering NULLS in PostgreSQL
  7. Converting Large Applications to TypeScript
  8. Importing SCSS variables in Next.js
  9. What's in a name? Falsehoods That Programmers Believe About Names
  10. Contributors

We love reading, watching, and listening to constantly update our skills and learn new perspectives. Here are some of the exciting pieces we learned from this month.

The Javascript RORO pattern#

RORO ("Receive Object, Return Object") is a javascript pattern that seeks to take advantage of the benefits of ES6, making functions that have easily constructed props and easily deconstructed return values.

The Invisible Javascript Backdoor#

While hiding things in plain sight isn't really a new concept in programming, especially for attacks, I found this one interesting because of The Gnar's use of trailing commas in our style guide. Normally, the commas are good for reducing noise in git diffs, but in this case, the author demonstrates how they can be leveraged for malicious purposes.

The Value in Value Objects#

We were discussing value objects vs. reference objects for one of our projects. This article from Martin Fowler is a nice summary of how to make the decision about value vs. reference, as well as some gotchas to look out for in particular languages.

State Management Showdown: Redux vs. Context API#

When the ContextAPI was released, it showed a world that embraced reducers, and in so doing, it sidestepped redux. When is Redux still useful, and when might you want to reach for it?

Importing SVGs as React Components#

We've often seen or written React components to render SVGs, or used img tags with an SVG src attribute. This section of the Create React App documentation describes how to import React components from SVG file paths directly!

Ordering NULLS in PostgreSQL#

This section of the Postgres documentation covers sorting queries, and a particularly valuable excerpt helped sort where the records with null sort attributes are returned in the query.

The NULLS FIRST and NULLS LAST options can be used to determine whether nulls appear before or after non-null values in the sort ordering. By default, null values sort as if larger than any non-null value; that is, NULLS FIRST is the default for DESC order, and NULLS LAST otherwise.

Converting Large Applications to TypeScript#

TypeScript continues to be one of our favorite tools at The Gnar. One great feature is the ability to modulate the strictness of the TypeScript configuration in your application. In general, a stricter configuration will result in a higher incidence of program correctness but sometimes, that may not be the best option right out of the gate. One example of when a less strict configuration might be preferable is when migrating from JavaScript to TypeScript, as it allows TypeScript to be adopted incrementally. This is valuable when you have over 17,000 JavaScript files in your application, which is exactly what Etsy had to contend with when they were making the switch. Their approach is detailed in the article above.

Importing SCSS variables in Next.js#

The tooling for frontend developers is constantly evolving, and this small but "next level" feature is a great example. NextJS allows you to access SASS variables in your components easily by simply exporting them!

What's in a name? Falsehoods That Programmers Believe About Names#

Accessibility comes in many forms, and this article does a good job of taking one common aspect of modern websites (recording a user's name) and explores the many assumptions developers may have about it. It is a useful read for those looking to think critically about the kind of things we do (or do not) require and record in our applications.

Contributors#

Learn more about how The Gnar builds software.

Frequently asked questions

Where do null values sort by default in Postgres?

Null values sort as larger than any non-null value. NULLS FIRST is the default for DESC order, and NULLS LAST is the default otherwise.

Can SVG files be imported as React components?

Yes. The Create React App documentation describes importing React components directly from SVG file paths.

How can NextJS components access SASS variables?

The post says NextJS lets components access SASS variables by exporting them.

Why review assumptions about user names?

The linked resource examines assumptions developers make when recording a user's name. It encourages considering what applications require and record.

Stay In The Loop

Never miss an update. Get the latest blogs, webinars, and expert insights straight to your inbox from The Gnar.