joshwcomeau/dark-mode-minimal

Stars
170
Rank 223,357 (Top 5 %)
Language
JavaScript
License
MIT License
Created over 4 years ago
Updated almost 2 years ago

joshwcomeau/dark-mode-minimal

joshwcomeau

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Gatsby Dark Mode (minimal example)

This codebase creates an "MVP" version of rehydration-safe, flicker-free Dark Mode. It's described in more detail on my blog:

https://joshwcomeau.com/gatsby/dark-mode/

You can also play with it live (though, fair warning, it's not a terribly exciting application): https://trusting-bose-add650.netlify.app

Notable files:

• gatsby-ssr.js • src/components/ThemeContext.js • src/constants.js

react-flip-move

Effortless animation between DOM changes (eg. list reordering) using the FLIP technique.

guppy

🐠A friendly application manager and task runner for React.js

use-sound

A React Hook for playing sound effects

waveforms

An interactive, explorable explanation about the peculiar magic of sound waves.

panther

Discover artists through an infinite node graph

new-component

⚛ ⚡ CLI utility for quickly creating new React components. ⚡ ⚛

redux-vcr

📼 Record and replay user sessions

key-and-pad

🎹 Fun experiment with the Web Audio API 🎶

Tello

🐣 A simple and delightful way to track and manage TV shows.

tinkersynth

An experimental art project. Create unique art through serendipitous discovery.

beatmapper

A 3D editor for creating Beat Saber maps

blog

OLD VERSION of the joshwcomeau.com blog. Kept for historical purposes.

react-retro-hit-counter

🆕 Go back in time with this 90s-style hit counter.

redux-sounds

Middleware for playing audio / sound effects using Howler.js

dream-css-tool

react-collection-helpers

A suite of composable utility components to manipulate collections.

redux-favicon

Redux middleware that displays colourful notification badges in the favicon area.

nice-index

Atom package to rename `index.js` files to their parent directory names

react-europe-talk-2018

fakebook

A front-end Facebook clone, built with React and Redux

talk-2019

Slides for my 2019 talk, "Saving the Web 16ms at a Time"

understanding-react

Daily exploration of the React source code

talon-commands

return-null

My React Europe 2017 lightning talk

explorable-explanations-with-react

word_dojo

react-boston-2018

My ReactBoston 2018 talk, The Case for Whimsy (Extended mix)

netlify-serverless-demo

css-for-js-flow-layout

whimsical-mail-client

ColourMatch

Search by Colour. Find photos with matching palettes.

talk-2020-react-europe

react-europe-workshop-confetti

plot

Experiments in pen plotting and generative art

sandpack-bundler-beta

react-play-button

react-europe-workshop-travel-site

deployed-screensaver

Uncover

📚 Aggregate new releases from your favourite authors. Built with Vuejs and Node

redux-vcr-todomvc

ReduxVCR integrated into TodoMVC.

react-letter-animation

A take on Mike Bostock's General Update Pattern, using React Flip Move.

Perseus

Gather info about your stargazers. Uses the GitHub GraphQL API

gatsby-preview-demo

Gatsby starter for a Contentful project.

words-with-strangers-redux

A universal redux version of my Meteor attempt at Words with Friends (online scrabble).

leitner

Keep track of your position in the 64-day Leitner calendar

empowered-development-with-gatsby

My Gatsby Days LA 2020 talk!

react-floaters

Spring-based scroll animation experiment with React.js

datocms-Gatsby-Portfolio-Website-demo

tetris

A simple tetris clone, in React and Redux, using Redux Saga

katas

A bunch of CodeWars challenge solutions. Part of an ongoing blogging effort at https://medium.com/@joshuawcomeau

react-europe-workshop-twitter-like

joshbot

The Discord bot for my Course Platform's community.

unlikely-friends

Don't mind me. Experiments with Gatsby themes

dont_eat_here_toronto

A Chrome extension that displays Toronto DineSafe restaurant inspection stuff on Yelp restaurant pages.

script-search

Find code used on the world's top sites

basilica

yger

🚀⚡️ Blazing fast blog built with Gatsby and Cosmic JS 🔥

gatsby-dark-mode

Mars-Rover-HTML

An HTML/CSS Mars Rover simulation

generic-portfolio

An example of a generic portfolio (what NOT to do)

ember-todo

Don't mind me! Just a toy app to familiarize myself with Ember

mono-gatsby-apps

Aracari

A simple-as-possible budgeting web app. Because I suck at budgeting.

temp-project-wordle

AngelHack_rando

1st Place @ AngelHack TO. Built in 24h.

tree-shake-test

gatsby-personalization

ssr-repro

react-fluid-window-events

React component for smooth, efficient resize/scroll handling.

Percentext

a jQuery plugin that lets you style text elements by width.

RequestKittens

The only API ridiculous enough to let you find cats by emotion.

book-demo

Demo of Git fundamentals

HungryBelly

An extension of the winning 24-hour project created for AngelHackTO

art

Generative art experiments

elevator-simulator

RAFT

Utility for efficient, organized window-level event handlers

CLYWmparison_blogembed

A Yoyo Comparison tool, used by Caribou Lodge Yoyo Works

TicTacToe

TeeVee

A simple Meteor app to help me keep track of which episodes of TV shows I've seen.

RequestKittensDocs

The documentation / sales site for the RequestKittens API

foodshow

A silly weekend project, using the Unsplash API to display a food slideshow.

egghead-optimized-images-1

react-simple-canvas

React components that replicate the SVG interface, but renders to an HTML5 Canvas

munsell-colors

joshwcc

My portfolio/blog. Nowhere close to done yet.

egghead-optimized-images-2

learn-webgl

Experiments for education with WebGL. Don't mind me.

Crowdfunder

A Kickstarter clone. Bitmaker Labs final assignment.

MEAN_stack_starter

A ready-to-go initialized MEAN stack with tons of customizations.

egghead-videos

pixelminer

An idle game (à la cookie clicker), built to help me experiment with flowtype.

huddle

A Meteor app that aims to help patients have better access to their medical files, and get second opinions from physicians on the platform.

joshwcc_ver2

Attempt #2 at the joshw.cc portfolio site.

Some-new-project

Advent-of-Code-2016

confetti-temp

redux-server-persist

Tori

Twitter, but for haikus.

classroom-q

Gatsby experimentation

fntest