Building things @logicandrhythm
📖: Sputnik Sweetheart, Haruki Murakami
🎧: Orlando Weeks, Hop Up
📺: Westworld & Better Call Saul
About
A creative developer who loves to learn and play around with new technologies. Currently learning and building with Remix.
Side Projects
An app where you can collect and organise your recipes and prepare your shopping list.
Built with:
- Remix
- SQLite
- Tailwind
- Prisma
- Fly.io
Features:
- User authentication
- Add, edit and delete recipes
- Autofill information when adding a new recipe based on the provided link
- Add/remove a recipe to/from your shopping list
- Easily view and check off items on your shopping list when you've got them
This project stems from something I've wanted for a while... an app where I can quickly add recipes from websites that I like and easily create a shopping list where I can check off items whilst shopping. No more writing lists and opening a tonne of recipe bookmarks.
I completely rebuilt my personal site, moving away from Next.js in favour of Remix. What this included:
- Adding self authentication so only I can access the admin area of the site.
- Creating my own CMS, using Planetscale as my database and Prisma as the ORM to interact with it.
- Moving my content away from notion and being able to to add, edit and delete content in the admin.
- Set up a cache layer, using Upstash, to make my back-end quicker and my pages snappier.
- Transform any markdown content into HTML and cache it.
- Instantly see any updates made from the admin in the UI.
- Move away from CSS-in-JS in favour of using UnoCSS, making my CSS simpler, more succinct and easier to navigate.
and much more...
Writing
Unsure on how to style your Remix app? Get Remix up and running with UnoCSS, the instant on-demand Atomic CSS engine, and build interfaces quicker than ever.
I've moved away from Next.js and completely rewritten my site in Remix. Find out some of the reasons why and some of the new technologies I've adopted. Featured in: React Status, React Newsletter and This Week in React
Render your first CodeMirror 6 editor in React and take it from a basic setup to something more complex, functional and all together more impressive.
Take full control of your sites statistics by switching from Google Analytics to Umami. Improve performance and create a safer space for your visitors.
Create your first Storybook story using Vite and React. Jump start your component library and enjoy complete confidence in your UI.
Improve your SEO by showing when your posts got last updated. Perfect for Gatsby and Next.js sites using Markdown or MDX for their content.
Work Experience
Education
Contact
Teams
