MineGuardian-Frontend

Omg, I didn’t log for so long. Sorrrrrryyyyyy!!! In the almost 7hours, I got every part of the site that I didn’t like and just redesigned it. I added RAM and CPU usage trackers using API endpoints, I added an install server button (and an uninstall one). And made a simple homepage to have at least something.
But what I definitely like the most is this new open source React component that I found, that provides you a lot of animated icons and components, and you can notice them all trough tout the front, and I’m definitely going to use more of it.

Holla guys! I have refractured some Api to match with the backend, and, the most important change, I modified the online players counter so that it shows a picture of the players online, and if hovered, it shows their username! I am so, so happy with how this turned up.
I don’t really have anything else to say, so, as usual, thank you for reading, have a great day and bye!

Well well well, only one hour and 47 minutes, hmmm…. Something ain’t right. But it doesn’t matter, because I’m super happy with how this turned up until this point, and im sure you are going to love it. I made the console bar retract down, and now I used a react library for different icons, which are also very good. I really don’t know how I want the final website to look, but I’ll see what I like more, and I’m sure that you’ll like what I come up with.
Thanks for reading and have a great day!
Bye!

Alright, so I worked a little bit, made the code more usable and understandable (for both me and you), and added these quick commands tool you can see in the video, they just start and stop the server (and restart, ofc). Now I think I want to figure out how to structure the page, because you can only fit so many elements on a page and it has to be pretty organized.

Ok, it’s been more then 1h and 30m, it’s been actually like 3h but who counts? (me) So anyway, now the webpage actually uses this WebSocket thing. I searched and documented about it and let me tell you what it does. It is a protocol (fancy term, i know, it means a way of transferring data from one server to another) which allows you to send data at the same time to one another with no time limit. It’s the same thing you use to chat on WhatsApp or to call someone. The thing is, it’s complicated to set up (it’s also my first time, but still, it was hard!), but I got it working. The client and the server will establish a WebSocket connection, providing at the handshake moment (the moment when they connect) the server id of which you wish to have access it’s console. For now, I didn’t connect the console, but that’s going to be easy-peasy compared to this WebSocket thing.
Also, I made a UI look kinda better, I still didn’t add those features I mentioned in the last devlog,. My next goal is to go to sleep I think, and I’ll see y’all tomorrow!

First devlog!!! Ok, so, I made a very simple webpage with reactjs, and used a library which seems pretty well known to fetch APIs. I used it to get a list of minecraft servers installed on the actual server. It isn’t anything big, but it can fetch data and im happy about it. I made a button so you can even refresh it yourself. I think im going to work a little tiny bit on the UI, then add some features like accessing the minecraft server console from the browser (I’m scared of that because I think I have to use WebSocket, even though I have no ideea how to use it or what it is🥲). But for now, I’m excited!
P.S: Im logging almost 2h of work so my bad for that, and also, in the video, you will see that I tried refreshing the server list. I assure you it worked, but it was just the same:)