Blog Index
30 Days of Functional Programming
August 1, 2019
I have long had a fascination with learning new things. However, it is generally unstructured and follows whatever the interest of the moment is. I have been and continue to be a proponent of motivation based learning, believing that we learn best when there is an internal vested interest. At least for me, one downside of this approach is a propensity for cursory knowledge on many topics without revisiting them in more depth. This large surface area of topics has resulted in consistently saying, “One day I will get back to exploring topic X in depth”. Anecdotal experience has indicates lower follow through. A Proposed Solution In a desire to explore topics in greater depth, I am engaging on a sort of gamified learning experiment. Over the…
Linked List - 20190729
July 29, 2019
The Linked List is a collection of interesting articles that I have recently read and found beneficial. Today's links cover web accessibility, upcoming features to ECMAScript, breaking down imperative vs declarative programming, and why your GraphQL APIs should embrace nullability. When Is A Button Not A Button?: Buttons have a number of built in accessibility and user interactions built in. Learn more and the dangers of trying to substitute other elements for buttons. Optional Chaining in JavaScript: This past week optional chaining entered stage 3 for TC 39 consideration. This syntax enables cleaner code for drilling without a bunch of type guards. Check out the full proposal at the link above. If you’re interested in trying it out use…
Pragmatic uses for React Context
July 24, 2019
The purpose and use case for the React Context API long eluded me. I was familiar with what it did in principle, but struggled to find a use case for it. The Context API can solve some unique problems such as: grouping localized text strings and creating a language provider. In this post I share how the Context API can help solve these problems, as well as some sample code. According to the React docs: Context provides a way to pass data through the component tree without having to pass props down manually at every level Passing Localized String Props Localized applications bring a host of various complexities, one of which being an increase in the amount of props for localized text. The removal of any hard coded text strings can quickly…
How to Resolve Accessibility Issues with React Helmet
May 28, 2019
The attribute is an essential part of the HTML element. It identifies the main language of the document's content. This is used by screen readers to determine the pronunciation of words. Screen readers have a default language setting, but will respect the language specified in the element if they differ. However, if this attribute is missing, and the language of the document is different than the screen reader's settings, the user will receive a subpar experience with incorrect pronunciations. For more information on the accessibility of this attribute, check out Deque University's detail page. React Helmet and JSX In many React development scenarios, the shell HTML template is not immediately available to the developer. In other…
Shaping JavaScript Usage with ESLint
May 23, 2019
I have used ESLint for a long time, often extending the recommended rules from various plugins. I only read a rule’s documentation if I wasn’t sure why it was being flagged in the linter. Last month I read through and manually set 381 ESLint rules, reading the accompanying docs for each rule. I discovered that ESLint is more than enforcing community guidelines on code quality. It also helps to shape use of the language as a whole and through project specific rule usage. Greater control for team objectives There are a number of rules the recommended configurations of ESLint or various plugins do not enable by default. These rules serve specific needs of a given project. They can be enabled and configured on a per project basis and provide…