Inspiration

We were inspired by difficult to look at and cluttered implementations of Logic Gate Simulators that we've used in our courses.

What it does

Logic-Gate-sim is a tool intended to be able to enable users build your own gates using the AND, OR and NOT gates as building blocks. A user is currently able to add any amount of these blocks onto a chip, and intended functionality will have the "Create" button store the current chip the user has created and enable them to add it to future chips as well.

How we built it

The simulation was built using HTML, vanilla JS and the PIXI.js library

Challenges we ran into

Due to both of us being unfamiliar with the Javascript ecosystem, we initially tried to keep the tech stack as narrow as possible. However, at a certain point in the project we realized that using a state management system like Redux could really help with our implementation. Despite attempting for a few hours and getting the help of a number of Hawk Hacks mentors, we were unable to get Redux or any similar libraries integrated and decided to take a different approach to the implementation.

Accomplishments that we're proud of

Despite the current iteration not demonstrating these changes on the UI as the input and output elements and activation logic are not yet linked, when we finally solved the logic behind the chaining behaviour for inputs and outputs on changes in activation, it felt triumphant.

Getting to work with an unfamiliar library for the first time and learn the toolkit that it offers and how to mold it to solve our problems was also incredibly rewarding.

What we learned

Both of us got much more familiar with Javascript and its syntax over the course of working on this project. We learnt about some of the nuances between ES and CommonJs modules through the pain and heartache of trying to resolve import errors, and we got to familiarize ourself with the tools available in the Pixi.js library.

What's next for Logic-Gate-sim

1) Connecting up activation logic with input and output node activation 2) Indicating changes in activation on UI 3) Enabling the functionality behind custom chip creation 4) Refactoring to reduce coupling between classes and increase future scalability

Built With

Share this project:

Updates