What Gives?

I’ve always felt a little intimidated when it comes to fully learning JavaScript, mostly because there are so many different frameworks and libraries already established and associated with the language. Don’t get me wrong, it’s incredible to see the thriving, active JS community with all the npm packages and frontend frameworks (React, Vue, Angular), however,_that definitely doesn’t help for a semi-beginner _(like me) wanting to dive into the world of JS.

I’ve also wanted to write my own app (whether it be on desktop or mobile) ever since I’ve started programming. Python is great and simple (and is, f.y.i, my first language), but is probably not the best pick for creating GUIs; I’ve known Tkinter and other python GUI frameworks, but I’ve personally found it requires much more effort to create fluid and unique UIs with them.

So, that’s when I coincidently heard of Electron, which goes by this phrase:

Build cross-platform desktop apps with Javascript, HTML, and CSS.

No way, I’ll be killing two birds with one stone over here: I’ll be getting the customization power that comes with HTML/CSS, while finally learning more intermediate Node.js JavaScript! The gist of how Electron works goes as follows: you are essentially rendering some HTML and CSS on a disguised chromium window, and all lower-level logic is handled in an entry-point JavaScript file.

The Final Product

After giving a week and a half, I came up with this:

Image for post


Put simply, eyePause is an app that will notify you (the user) when to take breaks from your screen — simple and nifty if you’d ask me. I’m sure the name could have some improvements, but I suppose it’s good enough. If you would like to view the source code, click below:


From this, I’ve certainly learned a lot more not only about JS, but also the basics of app/software development. Here, I’m sharing three main points I’ve gotten out of this mini-project.

#software-development #apps #javascript #programming #software-engineering

What I Learned From Building My First Electron JS App
1.10 GEEK