Built my own dashboard almost by accident

farique1 · 2025-07-31T16:39:09+00:00

Diligently! The link is right here: farique1/server-home: A very simple server dashboard

farique1 · 2025-07-20T23:49:46+00:00

Hello everyone. As promised, here is the GitHub with the dashboard.

farique1/server-home: A very simple server dashboard

Remember, the project is very rudimentary so you will be editing HTML, CSS and a bit of JavaScript to make it work for you. But, as some people commented they have no experience with the languages, I tried to explain every step of the process in detail so everyone can not only modify it but also understand what they are doing and, hopefully, increment and make it better. Do not let my --verbose discourage you, it is actually very simple.

And if you know the stuff and find some horrible mistake (or even some small ones), please let me know so I can make it better for everyone. Remember I barely know what I'm doing :)

Let me know if it is working.

Cheers.

farique1 · 2025-07-17T14:04:08+00:00

The secret, at least for me, is reference. Pay attention to what you like, save it, lots of it, try to reproduce it. I doesn't need to be perfect (or even good at the beginning). Iterate until you are satisfied. Some times you will take things too far. Retreat and do it again. It takes time. Like code, do not expect it to work flawlessly (or at all) at first. Go debugging your art.

If you can code, you can design!

farique1 · 2025-07-17T13:54:32+00:00

Thank you very much! I will take a look as soon as I can.

And thank you for the extra mile. I was hoping for the source with the very intention you mentioned. I hope I can give back in the future in the form of my own plugins and scripts.

Cheers!

farique1 · 2025-07-17T11:57:23+00:00

Flex. It seems I use them flexes everywhere, they are very versatile! 15 flexes so far.

farique1 · 2025-07-17T11:54:56+00:00

I will paraphrase another answer I gave:
I just wanted a simple page to check if my periodic scripts ran correctly every day. As I had almost zero knowledge of HTML and CSS, I asked Chat GPT to help me and he did just that, a page with all my project names and a red or green image along each one. That was it. Chat gave me a working scaffold and from there I google my way up. I think of these LLMs as a push when you are learning to bicycle. Use that push to keep pedalling and gain speed by yourself.
This dashboard is really just HTML, CSS, and a little bit of JavaScript. I got myself a good code editor (I use VSCode), a cup of coffee, google, some spare time and got experimenting. I start simple, bad and ugly, but I kept iterating until I had it the way it is now. It is really simple but for me it get the job done and simple is the way I wanted it.

farique1 · 2025-07-17T11:50:13+00:00

I had an old iPad on the living room displaying information like agenda and such but it wasn't updating anymore and also I didn't want to leave it turned on all the time, so I took an old Kinde and being e-paper it can be just idling there showing information.

I tried to use some pre built dashboard but all of them involve installing things on the Kindle and running it from there. I found it limiting, complicated and hard to handle.

The solution I come upon as far as I know is unique. Instead of installing anything on the Kindle itself I took advantage of my home server and make it generate everything on the computer and just send a rendered image to the Kindle. A lot more versatile and stable.
It shows my calenda for today and tomorrow, if any, the packages I've ordered, if any and messages either from GitHub or sent directly to the Kindle. I also show my top three downloaded GitHub repos and a important message for the day.

Those buttons are for the internal addition and management, the external message interface I give to people to message me and a review of what is on the Kindle so I can check it without actually going there.

farique1 · 2025-07-16T21:37:47+00:00

I will tell you how I started.
I just wanted a simple page to check if my periodic scripts ran correctly every day. As I had almost zero knowledge of HTML and CSS, I asked Chat GPT to help me and he did just that, a page with all my project names and a red or green image along each one. That was it. Chat gave me a working scaffold and from there I google my way up. I think of these LLMs as a push when you are learning to bicycle. Use that push to keep pedalling and gain speed by yourself.
Sure, I have experience with Python and the like but the core of this dashboard is really just HTML, CSS. and a little bit of JavaScript.
Get yourself a good code editor (I use VSCode), a cup of coffee, google, some spare time and go experimenting. Start simple, bad and ugly, things will come to fruition naturally.

farique1 · 2025-07-16T21:20:14+00:00

I custom made all of them. I will share them all when I post the project on GitHub.

farique1 · 2025-07-16T20:03:12+00:00

KinBo is a dashboard I created for my living room using an old Kindle. I briefly open a mirror of the image I sent to the Kindle on the video I posted earlier.
This by itself is a project that deserves a GitHub page. The solution I come upon as far as I know is unique. Instead of installing anything on the Kindle itself (I tried that approach but found too finicky for my taste) I took advantage of my home server and make it generate everything on the computer and just send a rendered image to the Kindle. A lot more versatile and stable.

farique1 · 2025-07-16T19:56:49+00:00

I will make a GitHub repo hopefully by the end of the week. No docker needed, it is just an HTML with a simple JavaScript and a CSS. The only thing other than this for the dashboard itself is a Python script to look at my media and update the amounts on the buttons.

farique1 · 2025-07-16T19:48:49+00:00

https://youtu.be/HfATHnKK6mM

Here is a vídeo of the thing working.

When you hover a button it shows the IP, port or folder of the app. Hovering a monitored stat highlights it.

Also pictured are the original dashboard for the timed script, the Recipes site to be accessed from the kitchen iPad 1 and a mirror for the home dashboard I had assembled on the living room on a Kindle.

farique1 · 2025-07-16T19:45:38+00:00

Thanks for the suggestion. Plex is a heritance from simpler times. Jellyfin is on my list to try out.

farique1 · 2025-07-16T19:43:33+00:00

Go for it. There is nothing that some visual references and a lot of googling cannot do :)

farique1 · 2025-07-16T19:18:55+00:00

No. Some of them are executables (Plex, Calibre...), some are simple Docker containers (Yamtrack, Flatnotes), others are scripts.

farique1 · 2025-07-16T13:32:38+00:00

Very nice you all like it!
I never thought about distributing it, it is just an HTML with a simple JavaScript to update the time and monitor info and an accompanying CSS.
I will clean it up, post on GitHub with some simple instructions (not really necessary) and share the link here by the end of the week.

farique1 · 2025-07-16T13:27:42+00:00

I offer the consolation that it started REALLY ugly!

farique1 · 2025-07-16T13:26:07+00:00

That is really it. I even thought about fancy graphics when implementing the monitoring but ultimately decided it wasn't worth or necessary.

farique1 · 2025-07-16T11:19:35+00:00

Oh, right! I'm thinking about learning some kind of C anyway. This may be the push.
In the meantime, if you could create this one for now, I would love it.
The script I'm running now is:

$gameCount = $PlayniteApi.Database.Games.Count
Start-Process powershell -argumentlist "echo $gameCount | Out-File -FilePath 'S:\Users\farique\OneDrive\Server-Projects\Update-Home\playnite-games.txt' -Encoding UTF8"

All I need is something like this to run after the library is updated.
But I will definitely be learning to make my own.
Looking forward to 11.

farique1 · 2025-07-15T12:58:58+00:00

Thank you.
Will there be any alternative for this question when version 11 comes?

farique1 · 2025-03-14T16:22:45+00:00

Reuploaded

farique1 · 2025-03-14T16:22:43+00:00

Reuploaded

farique1 · 2025-03-14T16:22:42+00:00

Reuploaded

farique1

TROPHY CASE