𝐁𝐚𝐲𝐚𝐧 𝐁𝐞𝐧𝐧𝐞𝐭𝐭

Sign in

Sometimes you need to separate what goes on the page with information that is needed to generate the page.

Accompanying video

File Timestamps Not Tracked by Git


How I used NextJS, MaterialUI, and a recursive React component to make a page tree

Accompanying video

Exploring Material UI’s Tree

<TreeView>
<TreeItem>
<TreeItem />
</TreeItem>
<TreeItem>…

and using the JavaScript Proxy class

Accompanying video

Looking at Web Workers


Structure, a hook, and a higher order component

Video version of this post

Folder Structure


Using react-markdown to turn code blocks into code editors

Video version of this post
  • Only one code block per page.
  • Difficult to add additional (non-code) content to the page.


Reading .js files and injecting the code as page content

Video version of this post

Dynamic Routing in NextJS


Creating a uniform style and colour palette

  • @codemirror/highlight
  • @codemirror/matchbrackets

Bringing a non-React project into a React project

What Should I Use?

Creating the Editor Component

import React from "react";export const…

Is it wizardry or trickery?

Video version of this post
  • Uploading from WebStorm to GitHub
  • Semantic Versioning
  • Conventional Commits

First Iteration Behaviour


Photo by Chris Ried on Unsplash

GitHub, Semantic Versioning, and Conventional Commits

Video version of this post

Creating a GitHub Project from WebStorm

𝐁𝐚𝐲𝐚𝐧 𝐁𝐞𝐧𝐧𝐞𝐭𝐭

My goal is to serve humanity and to bring happiness to others. I want to understand the problems around us and help find solutions. https://www.bayanbennett.com

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store