Ramblings on React, TypeScript, Design Systems, frontend things, and occasionally other stuff by Spencer Miskoviak.
Typescript explained in Javascript: extends
Exploring TypeScript's extends keyword using JavaScript.
typescript, extends
TypeScript explained in JavaScript: keyof
Exploring TypeScript's keyof operator using JavaScript.
typescript, keyof
Make more things into Components
Encapsulating more logic and concepts into components.
react, components
Named Parameters in JavaScript
A quick look at how to use named parameters and the benefits.
javascript, named parameters, named arguments
Design System Principles
General principles for building and maintaining a design system.
design systems, principles, rules
The Hard Thing About Simple Words
A hard thing explained using only the ten hundred words people use the most often.
webpack, illustrated, simple words
React Concurrent Mode with TypeScript
Getting started with React Concurrent Mode and Suspense with TypeScript.
react concurrent mode, react suspense, typescript, type definitions, @types
Creating a custom transform for jscodeshift
Using a jscodeshift transform to update automatically Font Awesome imports to enable tree shaking.
jscodeshift, abstract syntax tree, codemod, font awesome, tree shaking
Check for missing dependencies with yarn and webpack
A plugin to check if there are missing or incorrect packages installed with yarn as a webpack plugin
webpack plugin, yarn
Contributing to DefinitelyTyped for the first time
A guide to add missing type definitions to the DefinitelyTyped repository
typescript, definitely typed, @types, first time contributing
Server side rendering icons with Font Awesome
Avoid Font Awesome flickering large icons on initial load with server side rendering
server side rendering, react, font awesome
Code splitting with webpack and TypeScript
An overview of code splitting with webpack, in a TypeScript and React app
webpack, typescript, react, code splitting, dynamic import
Tree Shaking Font Awesome Icons
An overview of tree shaking dead code with webpack and a specific example with Font Awesome
webpack, tree shaking, font awesome
Separating webpack from the Rails Asset Pipeline
An approach for decoupling a webpack build process from the Rails Asset Pipeline build process
webpack, rails asset pipeline, build process
Measuring Frontend Performance (in modern browsers)
The supported browser APIs and polyfills for measuring frontend performance.
frontend performance, time to interactive, first input delay, first paint, first contentful paint, typescript
Techniques for effectively using Object Factories for Testing
A few patterns for effectively using object factories for testing.
object factory, testing, typescript, best practices
Hello Gatsby, Goodbye Medium
Moving my personal content to skovy.dev with Gatsby.
gatsby, netlify
Creating a CLI with TypeScript
The tooling and steps to create a command-line npm package written in TypeScript.
typescript, command line interface, npm, yarn
Generating TypeScript definitions for CSS Modules using SASS
Tooling and approaches for integrating CSS Modules, SASS, and TypeScript to add additional type-safety when importing the styles.
react, css modules, typescript, sass
Migrating a design system to a dedicated repository
An overview of the benefits, general patterns, and tooling for maintaining a design system in its own repository.
design systems, react, semantic-release, typescript
Introducing Rubber Ducking: A Podcast about all things “frontend”
Chris Schmitz and I are excited to share Rubber Ducking, a podcast about React, TypeScript, CSS, Design Systems, GraphQL and anything related.
podcast, react, typescript, design systems
Using React Hooks with TypeScript
useTypeScript(); A few quick examples of what it will look like to use Hooks with TypeScript.
react, hooks, typescript
Using Code Generators to Share and Document Best Practices
Code generators are a great way to automate the small repetitive decisions and save time among many other advantages.
react, generator, rails, typescript, javascript
Using component dot notation with TypeScript to create a set of components
The advantages of using component dot notation (accessing sub-components from a top-level component), a few gotchas and some examples.
react, components, dot notation, typescript
Object factories for testing in TypeScript
Introducing cooky-cutter, an object factory package written to be type-safe with TypeScript.
object factory, typescript, testing
Writing maintainable styles and components with CSS Modules
An overview of CSS Modules and some of the advantages the styling approach can provide.
css, styling, css modules
Thoughts after creating my first React app with ReasonML
My initial impressions after making a small web app written in ReasonML.
reasonml, javascript, react
Scaling data selection on the client
What is a selector? How do they help 'scale' querying data on the client?
react, redux, reselect
A Simple Blog with GraphQL, Apollo, React Router & styled-components.
An exploration into some of the other trending technologies in the JavaScript and React ecosystem today through a small web app.
graphql, apollo-client, styled-components, react-router