Perceptron

A recreation of this https://www.youtube.com/watch?v=l-9ALe3U-Fg

Jeremy Heminger [email protected]

																						ᓚᘏᗢ

I wanted to build this in React and to build the assets using CSS where possible.

The switches and knobs will be stored in a SQLite database.

I like to try to build these things on my own without any tutorials typically.

I would rather try to reverse engineer it based on abstract explanations.

I did this with a K-nearest algorithm several years ago: K-Nearest

In this case I decided to build this: ChatGPT is made from ...

References

• ChatGPT is made from ...

• The Coding Train 10.x

• WIKI - Multilayer perceptron

• K-Nearest

Dependancies

• Vite React : Typescript

• Prisma : SQLite

• Bun

Instructions

1. Install the dependencies listed above as appropriate for you machine.

2. From the CLI, navigate to the /app directory.

3. bun install

4. bun run dev

5. In the browser, navigate to; http://localhost:5173/.

6. The database should already be setup trained with a T.

7. Flip switches to make other letters or to draw the letter T in other locations.

8. For a T anywhere on the stage the microamperes should be above zero.

9. Anything other than a T should be less than zero.

10. To train the perceptron.

11. Turn off all the switches.

12. Turn on switches that match the letter or character to train on.

13. Modify the corresponding knobs to match the switches.

14. Modify the bias to get the highest possible value.

TODO

• Refactor

• Comment

• Allow users to specify the number of switches

• Multi-layer perceptron

Versions

📅 September 27, 2025

⬆️📅 October 27, 2025

• 1.0.0.9

• 1.0.0.8.3

• 🐱 Add MIT License

• 1.0.0.8.2

• 🐱 add screenshot

• 1.0.0.8.1

• 🐱 move README.md to root

• 1.0.0.7.2

• 🐱 Added the basis for an admin section

• 1.0.0.7.1

• 🐱 Added isActive to schema in anticipation of allowing users to specify the number of nodes

• 1.0.0.6.2

• 🐱 Updated schema for Knob and Switches to handle multiple perceptrons ( in a way that makes more sense )

• 1.0.0.6.1

• 🐞 meter.tsx the wrapper for the needle was overcompensating and producing too low resolution

• 1.0.0.5.5

• 🐱 added activation and gain to Perceptron.Get

• 1.0.0.5.4

• 🐞 fixed calculation in Perceptron.Node

• 1.0.0.5.3

• 🐱 added wrapAngle function to meter.tsx

• 1.0.0.5.2

• 🐱 Based on the new ... the knob +/- needed to be revered

• 1.0.0.5.1

• 🐱 Moved Perceptron.PopulateNodes() to App.tsx so the data would be populated as soon as app runs

• 1.0.0.4.1

• 🐞 The Store was not storing the initial values for all the settings

• 1.0.0.4.1

• 🐞 I forgot to hook up the bias bool on the knob and it was adding a new knob each time

• 1.0.0.3.2

• 🐱 hook toggle switches to lights

• 1.0.0.3.1

• 🐱 centralize communication between each component

• 1.0.0.2.2

• 🐱 better naming convention for GET and SET

• 1.0.0.2.1

• 🐱 Tied the toggles to the database

• 1.0.0.1.1

• 🐱 Decided to build the whole contraption in CSS only as much as possible

• 1.0.0.0.2

• 🐱 Create the micrometer in HTML and CSS

• 1.0.0.0.1

• 🐱 Create the knobs in HTML and CSS to be used in a module

• 1.0.0.0

• 🐱 Setup the basic project including React and Prisma and the schema