A few weeks ago after reading through Head First Design Patterns and learning about the observer pattern, I experimented with trying to manage state in React with it.

It was a fun experiment but I really didn't like the fact I was using classes in the React components and I wondered if I could get it working using React hooks.

I came back to the project, and after a bit of tinkering I got it working with a hooks implementation. I then wondered if I could go a little further and turn it into a simple state management library by removing all the boilerplate code and stripping it down to its essentials.

This I achieved and I am really happy with the results.

I think working on side projects really is one of the best ways to learn new skills and develop.

Here is some of the things I learnt / used along the way:

• TypeScript generics
• Extending classes
• Extending functions
• Checking memory usage, chrome dev tools
• Run a NPM package locally for testing, using both Link and NPM pack
• Publishing a TypeScript package to NPM
• Publish a NPM package to Yarn
• Put a HTML only site on Vercel
• Better understanding of CSS Flexbox
• Svelte basics
• Testing Svelte
• Design
• Git Submodules - create and update

Here is the outcome:

Site

NPM Package

Yarn Package

GitHub Repo