• 

  Sample View

Inspiration

I am often asked by non tech savvy family members or friends to interpret long network and security errors or warning. With digital detangler I wanted to strip a networking tool to its bare minimum, so anyone can use it.

What it does

Digital Detangler handles many concurrent network related data collection streams and unifies them into a single dashboard. In short, it monitors network health, speed, privacy and system load. Plus it even comes with some built in self monitoring productivity tools!

List of information

-Wifi SSID -Wifi signal strength -Encryption status -Security method

• Current running processes
• Active monitoring screentime
• Productivity (Based on white listed "work" apps)

- Most used app

Please keep in mind that nothing in Digital Detangler is simulated, all data gathering is real.

How we built it

Digital Detangler is built on electron with react and relies on systeminformation (Node.js system information package) as its API for lower level hardware and network monitoring. I began with some simple boiler plate that tested the electron API and added features as I went along.

Challenges we ran into

There was a lot of issues getting electron to play well with systeminformation, the needed IPC callback functions that electron uses felt esoteric and hard to grasp.

Accomplishments that we're proud of

I was able to finish my MVP goals!

What we learned

Front-end development is never fun.

What's next for Digital Detangler

Perhaps a more advanced version with all the data and information someone could need! I already had a basic implementation of screen time monitoring per app and hardware temperature. I was really tempted to make a CLI as well.

Built With

• css
• electron
• html
• javascript
• node.js
• react
• tailwind
• vite