Inspiration

I was creating content on my channel (https://www.youtube.com/channel/UCOxbcakysLMm7PSIU096cuA) when i thought of a way to visualize ideas using diagrams and icons. That's when i got inspired to create S.A.M. to help convey ideas and give an overview of my video all within one glance of a diagram

What it does

S.A.M allows you to create projects, manage them by creating todos with requirement list and create timelines to illustrate each step and idea in the project. I can also record your screen and export the recording to others.

How I built it

I build it using the React and Electron web frameworks. React for creating the UI and most functionalities that can be done on the DOM. Electron to transform the web app into a native desktop app and as well provide some IPC(Inter Process Communication) between each other

Challenges I ran into

Unfortunately, they both use the webpack server. Hence I could not use all of electron apis. I had to access some using window.require from the render process.i.e.

const { ipcRenderer } = window.require('electron');
ipcRenderer.emit('close');

Accomplishments that I'm proud of

I mastered React and its hooks

What I learned

I learned about React Hooks and how to style a desktop app really well

What's next for S.A.M

S.A.M is going to try to make ideas easier to grab just by using short text and icons

Built With

  • clsx
  • electon
  • electron
  • electron-db
  • material-ui
  • node-sass
  • react
  • react-paystack
  • react-router-dom
Share this project:

Updates