You are browsing as a guest. Sign up (or log in) to start making projects!

LuminOS

  • 3 Devlogs
  • 7 Total hours

A webOS project that actually feels like a real OS. Inspired by MacOS.

Ship #1

Most WebOS submissions just look like an OS but aren't actually useful, so I tried to make one that actually is :p

It's got draggable windows, a dock, and a menu bar with a live clock, all styled like macOS but built from scratch in plain JS. The cool part is the apps actually work together: there's a File Explorer, a Terminal that really runs commands (ls, cd, cat, mkdir, tree...), and a Code Editor built on Monaco (the VS Code engine) with IntelliSense, Emmet, and ~90 languages. All three share one filesystem that saves to your browser, so make a file in the terminal, and it instantly shows up in Files and the editor. There's also a browser, a calculator, and a GitHub profile card (that leads to my profile).

Try project → See source code →
Open comments for this post

2h 48m 32s logged

Lumin OS dev log #3!

Back again, and this time the OS actually feels like an OS. (NO MORE LARP)

What did I do?

The big thing is that everything now runs on one real filesystem that saves to your browser, so your files don’t disappear when you close the tab. And all the apps share it, so a file you make in one shows up everywhere else instantly.

First new app is the File Explorer. It’s a proper file manager with folders, breadcrumbs (learned a new word! really important, I know) at the top so you know where you are, and an Up button. You can make new folders and files, rename them, delete them, all that. Double-click a folder to go in, double-click a file, and it opens right in the Code Editor. I also added Import and Save to disk, so you can pull a real file off your computer into Lumin OS, or download one back out (uses the actual File System Access API)
Then the Terminal. ls, cd, cat, mkdir, touch, rm, mv, cp, tree… they all run on the real filesystem. You can even do echo hello > file.txt to write to a file, and » to append. Type help and it lists everything, there’s arrow-key history so you can scroll back through old commands, and open file.js throws a file straight into the editor. It greets you with root@LuminOs like a proper shell :p

Oh, and the Code Editor got reworked too. Before, the files in it were basically fake/hardcoded. Now it’s hooked into the real filesystem, so it auto-saves as you type (Ctrl+S to force it), the file list on the left is the actual files in the OS, and it all stays in sync. Edit a file in the editor and the terminal sees it, delete one in Files and the editor closes the tab by itself.

So basically, you can make a file in the terminal, edit it in the editor, and manage it in Files.

You can still download Lumin OS at https://github.com/MIXIDtheSilly/LuminOS (star it pls, yes, still begging ⭐ )

If you have any ideas, drop them in the comments! I will read all of them :p:

0
0
7
Open comments for this post

1h 19m 17s logged

Lumin OS dev log #2!

Back again with more progress!

What did I do this time?

First, the small stuff: I added a menu bar at the top, as macOS has. Right now it’s mostly home to the clock, which ticks live and updates every second.

The big one is the Code Editor app. For that, I used Monaco, which is the engine that VSCode uses, so it already feels familiar. It’s got files on the left and the editor on the right, just like you’d expect.

Oh, btw, suggestions also work! (AND EMMET TOO!!!)

I used IntelliSense for JS/TS, type console. or document. And you get actual member suggestions.
Emmet in HTML/CSS, type ! then Tab for boilerplate, or div.box>p*3 for the cool expansion.
Auto-closing tags, type and it adds the for you (Monaco doesn’t do this by default, had to add it myself).
It detects the language by file extension automatically, .js, .go, .rs, .py, .html… around 90 languages, and shows the current one in a little status bar at the bottom. (holy vs code clone lol)
Open files now also show up as tabs at the top of the editor, and you can make your own files with the + button. Used JetBrains Mono font. Maybe one day I’ll get the actual web VSCode running in here or maybe someone can do it for me >:P, but for now this does the job :p

You can still download Lumin OS at https://github.com/MIXIDtheSilly/LuminOS (go star it fr fr again…)

If you have any ideas, drop them in the comments!

1
0
36
Open comments for this post

2h 33m 28s logged

Lumin OS dev log #1!

I’ve started working on the WebOS mission. I saw some other submissions, but it seems most of them are for show and don’t actually function like an OS. My friends liked the look of it lol, and suggested a couple of things like being able to access VSCode inside of it (because there is a web VSCode) or run Doom (one of my friends told me there is a JS Doom port, so ima check it out). Yeah, but the goal of this OS is to be useful :p

What did I do today?

Started by creating windows and adding a wallpaper (yes, it is the one from macOS, and im using it currently). Then added a GitHub app to show my profile card; it’s not linked to an API yet, but I might do it. Then I made a browser by displaying content in an . And because I couldn’t load some websites, Google, for example, I added a fallback. I added some websites that didn’t work to a list, and instead of trying to load them, the app tells you that the website cannot be embedded and shows a button that opens that page in a new window. last think i’ve added today was the calculator app, and I don’t think I need to explain how a calculator works lol. And yes, it has protection for dividing by 0.

You can already download Lumin OS at https://github.com/MIXIDtheSilly/LuminOS (and you should star it fr)
Oh, I forgot to mention that the OS name came from my VR dev team’s name, Luminera, and an AI assistant I made for the team, called Lumin.

I would’ve made a dev log sooner, but I started making this project at school. (still no summer break in Poland 😭 )

If you have any ideas, make sure to comment! I will appreciate it!

0
0
15

Followers

Loading…