october.md

October 2020

Accessibility

• Andrew Coyle (2020), Form Design Best practices → https://medium.com/nextux/form-design-best-practices-9525c321d759
• Manuel Matuzovic (2020), Test the accessibility of a page in different scenarios with a11y-tests.css → https://github.com/matuzo/a11y-tests.css
  • See also Manuel's CSS with a11y in mind on codepen → https://codepen.io/collection/XpqyvJ
• Doug Schepers (2020), Reliable and Valid SVG Accessibility → https://fizz.studio/blog/reliable-valid-svg-accessibility/
• Joel Strohmeier (2020), How to build accessible cards–block links → https://www.nomensa.com/blog/2020/how-build-accessible-cards%E2%80%93block-links
• Web Axe (2020), Resources for developing accessible cards/tiles → http://www.webaxe.org/resources-for-developing-accessible-cards-tiles/

CSS Colors

• Bennett Feely (2020), CSS Scales → https://bennettfeely.com/cssscales/

Folders

• Vasyl Boroviak (2014), From folder structure to microservices (slides) → https://docs.google.com/presentation/d/1aN2DIclCnf9oc_mlUeSoXWcqe6LWus-E7RY5HXXsPUk/edit#slide=id.p
  • see also Gleb Bahmutov (2018), Use subfolders installed as NPM dependencies to avoid long relative paths in require. → https://glebbahmutov.com/blog/subfolders-as-dependencies/

Functional

• Sebastien Filion (2020), Common Functional Programming Algebraic data types for JavaScript → https://github.com/sebastienfilion/functional

Git

• Seth Robertson (date unknown), On undoing, fixing, or removing commits in git → http://sethrobertson.github.io/GitFixUm/fixup.html
  • fairly comprehensive guide to recovering from what you did not mean to do when using git.

Partial Ordering

• Mikito Takada (2012), Vector clock implementation in JavaScript → https://github.com/mixu/vectorclock

Performance

• Jeremy Wagner (2020), radEventListener: a Tale of Client-side Framework Performance → https://css-tricks.com/radeventlistener-a-tale-of-client-side-framework-performance/

Reactive State for Data & DOM

• Andrea Giammarchi (2020), Reactive State for Data & DOM → https://medium.com/@WebReflection/reactive-state-for-data-dom-78332ddafd0e
• @WebReflection (2020), An all-in-one implementation of the Reactive State for Data & DOM patterns → https://github.com/webreflection/reactive-props
• Andrea Giammarchi (2020), uce-template: Inspired by Vue 3 "One Piece", uce-template provides a custom builtin <template> element to define components in a Vue fashion. → https://github.com/WebReflection/uce-template

Web Components

• Duet Design System, duetds.com (2020), Duet Date Picker → https://duetds.github.io/date-picker/
  • NB: Accessiblility issues
• Danny Moerkerke (2019), Material Design Web Components → https://dannymoerkerke.github.io/material-webcomponents
  • NB: Accessiblility issues

The Ugly Side of React

• Nir Yosef (2020), The Ugly Side of React Hooks → https://medium.com/swlh/the-ugly-side-of-hooks-584f0f8136b6
• Nir Yosef (2017), The Ugly Side of Redux → https://codeburst.io/the-ugly-side-of-redux-6591fde68200
• Ondrej Polesny (2020), Why is Next.js my ultimate choice over Gatsby, Gridsome, and Nuxt? → https://kontent.ai/blog/gatsby-vs-next-gridsome-nuxt

  • [Gatsby] was my first experience with React, and I hated it. It was so complicated to do just tiny bits of functionality.

  • If you can live without GraphQL, Next.js will do everything Gatsby does and more.

  • [S]lightly inclined to Next.js over Gatsby... The top feature for me is the file-based routing that also supports dynamic routes and compatibility with Sourcebit, which allows me to switch the data source or SSG any way I want in the future without reimplementing everything from scratch.

Fixing the React Eco-system

• Albert Gao (2020), The evil pattern of Redux that reduces boilerplate → https://www.albertgao.xyz/2020/09/22/evil-pattern-of-redux-that-reduces-boilerplate/
  • Uses @redux/toolkit's createSlice(), e.g., slice.actions.setState(nextState) - more at https://redux-toolkit.js.org/api/createSlice
• Luna Ruan (2020), Introducing the New JSX Transform → https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html

  • With the new transform, you can use JSX without importing React.

• Nick Scialli (2020), Learn the Basics of Redux by Writing Your Own Version in 30 Lines → https://dev.to/nas5w/learn-the-basics-of-redux-by-writing-your-own-version-in-30-lines-1if3

The Ugly Side of TypeScript

• Dave Schinkel (2020), Including Custom TypeScript Declaration files with Mocha.js → https://www.linkedin.com/pulse/including-custom-typescript-declaration-files-mochajs-dave-schinkel/

  • I use TypeScript for tests and production code for my site WeDoTDD.com, however I'm not a big fan of it because it becomes pretty cumbersome to maintain it and to continually make TypeScript "happy" in my opinion.