Benevolent Bytes

by Seth Corker

Become a better React developer, CSS wizard, JAMStack master, library explorer.

This is a space to help you learn about JavaScript, animate React components and, navigate the ever-changing world of the web.

Latest Articles

Cartoon person halfway in a portal seeing 3 bottom halves of different people stuck in portals

Using Traefik for routing paths to web apps

Setup a reverse proxy to simplify routing

Magnifying glass on a pale red background with abstract shapes surrounding

The best option for picking one-off icons

Finding icons for your project

Cartoon person seeing an idea lightbulb in their mind's eye on a light blue cloud background

Thoughts on Tailwind CSS

What CSS utility libraries gets right

The image gallery we'll add animations to with Framer Motion

Create an image gallery in Framer Motion

Animating between components in React

Illustration of the GitHub logo and NPM logo on either side of a person holding a file

The importance of the README

What I look for in a library

Two people playing a block stacking game on top of the React logo

How to organise React components

Embracing locality for react file structure

Three logos in a row, from left to right, the CSS 3 logo, JavaScript logo with a red diagonal line through it and the HTML 5 logo

How it feels to write a web page from scratch in 2020

Shedding the burden of modern tooling

4 logos in a diamond layout on a black background. In a clockwise direction starting from the top, the M1 chip, HTML5, JacaScript, CSS3

The implications of M1 Apple Silicon for Web Developers

How architecture will affect daily development and what the future holds

There's plenty more articles to choose from, 63 in fact.
So why not check them out!

Read all articles

Coding in Framer series

Watch my free tutorial series on how to get started coding in Framer.
We'll use the popular design and prototyping Framer Web to craft beautiful user interfaces but we'll make them more rich and interactive with code. I'll take you from your first code component in React, smooth animations with Framer Motion and handoff into a code project.

Title card showing a screenshot of the bank app project and the title "Code Components | Episode 1 - Coding in Framer" on a purple background
Code Components - 1

Create your first code component from scratch in Framer Web. This tuto

Title card showing a screenshot of the bank app project and the title "Property Controls | Episode 2 - Coding in Framer" on a purple background
Property Controls - 2

Use property controls to make your code components in Framer Web more

Title card showing a screenshot of the bank app project and the title "Interactions & Overrides | Episode 3 - Coding in Framer" on a purple background
Interactions & Overrides - 3

Learn how to turn design elements and code components in Framer Web in

Title card showing a screenshot of the bank app project and the title "Animations & Overrides | Episode 4 - Coding in Framer" on a purple background
Animations & Overrides - 4

Framer Web excels at providing easy ways to animate components. We’ll

Title card showing a screenshot of the bank app project and the title "Designing with Data | Episode 5 - Coding in Framer" on a purple background
Designing with Data - 5

Create complex interactions by leveraging the Data instance in the Fra

Title card showing a screenshot of the bank app project and the title "Handing off to Framer Motion | Episode 6 - Coding in Framer" on a purple background
Handing off to Framer Motion - 6

Your prototype in Framer Web can make the leap into a codebase. Web de

Common Questions