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

LighterWebUI

  • 10 Devlogs
  • 38 Total hours

A lightweight local AI client based around Ollama. It can run open source models on-device with a local database, meaning your data doesn't have to leave your network.

Open comments for this post

3h 1m 5s logged

# I FINISHED THE MAIN PAGE’S FEATURES!!!

I added a create and remove user function. I also entirely overhauled how they’re stored.

Time for the boring dev talk:
Before, the DB ref was (‘/LighterWebUI/users/’) and now it’s (‘/LighterWebUI/users/${userId}’), meaning I can modify them as I need without having to first fetch the array, modify it and then re-send it to the db.
It’s a TINY bit more efficient, and a lot easier to use.

Also, STATISTICS! I took a few measurements, here are the results.

<100MB idle (about 95MB)
Idling with 10 browser tabs running it took it way up to… 105MB :pepe-thumbsup:

According to my very thorough single Google search, the average idle for OpenWebUI is 400-650MB, making mine 4-6x less RAM usage!

I also improved some of the logic surrounding the presets for API endpoints.

UX improvements too!

I MASSIVELY improved the UI of certain things like the user profile system, which now doesn’t display the currently selected profile as an option (not super significant, but nice). I also added the option to add new users.

The chats list now (finally) shows which chat you’re active in.

It highlights it in a lighter gray.

I also made it so that when you use the “override model selection”, the options disappear so you don’t have an empty element :)

I fixed the colours and improved continuity across colourful elements (before I had like 4 different blue colours that were basically identical XD)

I feel like the UI is kinda Discord-esque on the user page, which I quite like :D
I also added a lil function to close all menus, which streamlines all the others instead of manually closing every one of them.
As far as I can remember that’s basically it!
OH WAIT NO I added a new settings menu! It’s totally different now. :)

I organised some things and split it into two sides, regular and advanced.

I’m very close to finishing the project! Probably <10 hours left on it.
(I’m gonna fix the weird text spacing soon DW lol)

I’ll also add a ‘cancel’ option to the New User menu.
As usual, if I remember anything else I’ll add it in the comments :D
Thanks for reading guys! <3
Happy hacking!

1
0
28
Open comments for this post

4h 47m 36s logged

The grand settings, backend and UX update of ’26!

I added a bunch of backup logic behind the custom route fetching!
It’s working great now! I then also had to fix a bunch of things with the guest route, because that was all messed up from the settings stuff.

I added a new tool! The AI can now run endChat() to stop the user and delete the chat if they ask/say something harmful. I would like to stop it before it reaches my API provider, but I don’t think HC would appreciate me putting a “slurs.txt” file into my repo :pepeclown:
When the AI calls the function, it fetches the current chat and simply deletes it. It also notifies the user through a simple error system I’ve made. From there, the user can currently create a new chat. I’m prepared to keep it this way for now, since I don’t want to limit other people from using their own local models for whatever they might want. I’m also considering providing the option to rely solely on the model’s guardrails.

I’ve just gotta hope nobody wants to test that feature upon shipping…
Speaking of which, I’ve massively changed my mind on how I’ll handle that! It’s NOT going to be hosted on-device for the ship, which I know sounds ironic (and frankly, is, given it’s a local AI client), but I don’t want any users saying “this local 0.5B AI is terrible, it must be a bad project!”, and will thus use Ollama’s official cloud API.
Also, if my Pi were to receive multiple prompts at once, it would likely… Die. This would A: suck, because I’d need to restart it frequently and B: prevent any users from rating it while it’s off. If it dies at midnight, I won’t know until I wake up!

Ollama’s Cloud API has seemingly good uptime (I couldn’t find any stats online, but it seems decent!) and provides me with much larger models, up to 120B (and likely higher) without having to pay. That brings me to one of the largest things I had to figure out!

If a user selects an unavailable model (Kimi K2.6, for instance), the server returns an error (which was surprisingly difficult to actually parse/decode!) and fails.
I created a system to return that the prompt failed, then check that the fallback model is different from the current model. If so, it warns the user, then goes to the fallback model and regenerates by itself, automatically. The default fallback is Gemma4:31B, since it’s a free Ollama model. I’m providing my own key, so users don’t need to enter their own.
If the fallback is the SAME as the current, it’ll show an unexpected error.

I also added auto scrolling, although I couldn’t figure it out, so I debugged using Gemini and managed to fix it.
It’s a ChatGPT-style scrolling system! It binds you to the bottom while it’s generating, but if you scroll up, it’ll sever that binding, letting you scroll freely. If you want to continue following the AI’s text stream, simply scroll back down!

I am considering adding a button to do so as well, since that could be a very easy feature to add and improve overall UX.

Oh right, I also fixed the displaying of when the AI uses tools! I found out that the Vercel AI SDK has a new system for it in the newest version and used that instead.

I think I added some more stuff, but I can’t really remember it all right now! Most of the time spent was debugging the things I broke while adding new features. I’ll add anything I remember as a comment on this devlog!

Also check the changelog if you wanna see more stuff (and specifics!) :)

I acknowledge that this is my longest devlog so far, but I just wanted to be thorough! If you have any questions, I’d love to answer them in the comments!!!

2
0
6
Open comments for this post

4h 34m 9s logged

URL UPDATEEEE!

I FINALLY added custom URLs!

I mentioned wanting to do that in the last devlog, but now you CAN!
I finished the settings page’s content, including adding an entire auth system (painful) and trying to make the UX nicer (also painful), alongside encountering a TON of other bugs and having to fix those.

I also made a system to generate passwords randomly to access the admin controls.

It OFFICIALLY works with other APIs!
Simply enter the route (e.g, https://ollama.com/api) and your API key and it’ll handle the rest.

This is just the main feature I added, but I added a TON of other things too!

ANYWAY!

Still on the “//TODO:” list:

A TON OF STUFF!
I plan to add customisable temperature next, then the into/“welcome” screens, then all the scrolling and animation stuff.

I think I can do this in time though, which is a great feeling having coded less recently.

0
0
5
Open comments for this post

4h 29m 14s logged

Hey!

Added web search integration, a settings menu, and I’m working on an admin page!

I also added text formatting, which was a pain to test with the 0.5B model because of how disobedient it can be :heavysob:

I plan to allow the user to change the API route (and key) through a locked admin page.

I’m working through security issues with that, and spent a fair amount of time thinking of how to fix that.

My current plan is:
Generate a secret “key” during setup that unlocks the admin page.

When the user visits the page, ask them for the key to submit the changes.

If the user hasn’t been authenticated, do not allow them to change settings. The main concern is that they could use devtools to just toggle the variable, hence fetching it directly within the function.

I think it’ll work, but I’ll need to do some testing. :)

I also added a little icon if the user hasn’t got a Tavily API key for web search functionality.

The image currently shows the route editable within the client side. I might go with that and have the same logic behind it on the home page instead of a separate /admin page.

In all honesty, I’m kinda overwhelmed. This is the biggest project I’ve ever made, and I feel like I keep accidentally switching features and missing stuff out.

Anyway, it’s still really fun, so I’m still going for that Flipper Zero and TRMNL kit! :D

Thanks for reading!!!

0
0
4
Open comments for this post

3h 11m 36s logged

MASSIVE overhaul of the backend!

As you may recall, I previously spent a few hours trying (and failing) to implement tool calling.

I did a bit of research (Google Gemini helped with the research portion!) and found that the Vercel AI SDK has the ability to stream text while tool calling, with WAY less code than doing it manually!

The great conversion of ’26…

That SUCKED!!! It worked great until I noticed that the database no longer worked…
Anyway, as of 5 minutes ago, I just fixed that!

I completely removed my local “messages” array and replaced it with chat.messages.

I LOVE THE VERCEL AI SDK!! It’s amazing.
I just need some tool ideas of what to add..

(Currently, there’s just a short pause and a gap above the messages to indicate a tool was used, but I plan to replace that with a nice “Tool used: ____” now!

I also did a TON of other things, including fixing many bugs with the new user system, but that seems to OFFICIALLY be working now!!
Only took me 20+ hours to get a working AI client T_T

But now I can start getting it NICE! :)

I’ll improve UI, add a TON of pages, etc!
If you have any default tool suggestions, please do give them.

0
0
5
Open comments for this post

3h 14m 43s logged

I FINISHED THE USER SYSTEM after a ton of uhh.. Pain and suffering! :D

JK, it wasn’t too bad. I did, however encounter a loop of failing code that I couldn’t figure out! Turns out, my localStorage thingy was broken! I accidentally set it wrong!
Anyway, after finally fixing that, I kept going!
I removed the DB from github too lol.
Unfortunately I’ve made no UI changes yet, so there’s really nothing interesting to see.

AI usage:
I debugged a few errors using Gemini, finding the solution. Still no AI code was used.
I found that I could use return functions with $effect runes, which I somehow missed before! That came in handy with the fancy system I added to not entirely break the website if you leave during a stream. :)

For some reason, the page is UNBELIEVABLY slow to initially load on development mode, so that sucks… It works instantly on release though, so that’s great!
I added a few new messages to the main screen. Some backups too, one of which is visible below. It tells you instantly what profile you’re on.
I’ll consider varying that each time like most AI websites do, but I’ll make sure to keep it as small as possible.
I have a LOT to do on my Trello board still, which is ironic. The more work I do, the more issues I find! The board gets longer each devlog T_T

Somewhat interesting update:
I’m gonna add some docs (likely on Github, unless I feel inclined to code them!) in which there’ll be an error code section. I’m making my own error codes, specific to the website. :)

Currently got:
A1: user error (not logged in, corrupt data, etc.)
U1: unknown error
M1: unavailable model
P1: invalid prompt

I plan to maybe add profanity filtering to the prompt validity checker (which I’ve also yet to implement)!

I can also make a nice customisable theme across pages.

Exciting devlog, because now I can get back onto the FUN STUFF!!!
No more ‘why account no work T_T’ stuff!

Thanks for reading, happy coding!

0
0
2
Open comments for this post

4h 31m 57s logged

More work! :D

As the image shows, I just finished implementing ‘guest’ mode and have started on the user profile system (on the right)
I plan to:
Finish adding it, fixing the UI, etc.
Add it to the setup process :O

Anyway, other things (massively summarised to fit a devlog… If you want to know more, check the repo!)

I designed an icon! That wasn’t logged for time. :) I implemented the logo (it doubles as a guest profile picture thing on the top right!)
It’s a bit generic, very “AI company”-esque, but still - pretty nice for my first Inkscape logo :D

I’ve added some nice icons, as you can see in the sidebar.
I forced alignment of the title, so that’s fixed! :)
I fixed the bug where the user could enter a prompt without having a user object assigned to them.
For Guest detection, I basically just say “if(!user.userId)”, since the Guest is the only profile that will NEVER have an automatically assigned user ID.

I’ve totally revamped the user system:
It’s now a JSON object called user, with various items like userName, userId, and userPlainNum. PlainNum is for ordering, and I was pretty sure I had something in mind, but I can’t remember why I added it so it might be removed.
I’m at 571 lines of code!
I made several new JS backend files for this user system, so I’m very excited to introduce it! I am posting this devlog only part of the way through coding that system.

Suffice to say my Trello board is FULL!

Also, heh… Embarrassing story:
I kinda committed the database :)

BUT! It wasn’t public anyway, so it’s just my debugging “uhhh… hello? HELLO??? Are you there?” prompts. Nothing secret.

Also probably best that it happens during development and before I have users!
Anyway, since I’m HORRIBLE with Git commands, I used Gemini to help fix it. Hopefully that worked. As I said in the AI declaration thingy, none of the code is copy-pasted from AI, and is all Capy-written :D
(PS, I probably skipped over 500 tiny bug fixes and a few bigger features, but we’d both be here for a while if I hadn’t.)
Thanks so much for reading my devlog! Happy coding!

1
0
3
Open comments for this post

5h 6m logged

I added a BUNCH of stuff!

I was so locked in that I forgot to make a devlog!

Let’s make this one shorter:
I added the left panel
I added multiple new backend files for the DATABASE!!!
I added a database (AceBase!)
I improved the UI
I’m testing with another AI model for now

Okay, onto the detailed stuff. AceBase! :happy: It’s a really nice database package thingy! It has FireStore-like syntax but without the annoying stuff. :) I’ll definitely use it in future projects too! Anyway, using that I made a system to create, fetch, etc new chats! Now they’re stored in the database alongside their associated crypto-UUID key. That’s passed as a search parameter (kinda like YouTube videos!) and fetched, then the messages are loaded. I did way more that honestly can’t fit into this devlog, so that’s the main stuff out of the way. :)

To do:
UI! It’s still got some smaller issues (the title is off-centre :O)
Fix a BUNCH of backend bugs
Add auto-chat naming (just the first few words of the user’s prompt for now :D)
Add a user profile system (like Netflix :O)
Add a “guest mode” account.
Make the URL customisable (in case someone’s hosting at a different address)
Make a customisable system prompt!
Decide what models are suitable for release.
Add some nice (lucide.dev) icons!
And a BUNCH more! Thanks for reading! :D Happy coding!

0
0
2
Open comments for this post

4h 34m 13s logged

Devlog #2!

This one was a challenge… I started by spending an hour or two trying to figure out a nice system for function calling, before coming to the sad realisation that it wouldn’t be very useful. I then experimented with AI models, and realised that SmoLLM is a nice balance between intelligence and size! I also discovered that Ollama (by default) doesn’t allow two prompts at once. I plan to keep this functionality, despite its obvious drawbacks. If I didn’t have it in place, two users using different (or even the same) models could totally crash the Pi. That would leave the site down for hours on end if I’m not available to fix it. With Ollama’s prevention, worst case scenario: one user waits a few extra seconds. Anyway, I also started working on the UI! I’ve also implemented a nice system that fetches the available models, which seems to work great! I’m currently getting a nice input box. The images of UI from the last devlog were the Figma designs, but now it’s time to actually make them in HTML and CSS! I’ve done a lot of other backend stuff, playing around with various experiments, but now I’m back to working on the frontend for now. One last thing: I’m still deciding how the website will work. I might add Firebase authentication. This would allow easy saving of chats. It would also, however make the development experience more complicated and the app itself less streamlined. Another concern is that people run local AI for security, so posting everything they’ve said off to Google is a little pointless. I’ve got two other options: local JSON (or SQL :P) database, and no storage at all. I think the SQL database will have to be made. :) Thanks so much for reading the devlog! Sorry I made it so long… Also! A feature I’m super proud of! The title card at the top of the image isn’t just a title! Each word lights up when you hover. If you click, it takes you to a page detailing the feature of the site. (E.g, ‘lighter’ will take you to the page describing how I made the site efficient and lightweight!)
Thanks for reading!

0
0
6
Open comments for this post

23m 39s logged

First devlog! I FINALLY got the text streaming working! Unfortunately, Wakatime didn’t work for the first almost 2 hours of coding! Oh well! Not much I can do XD I am really happy with it! Currently running Qwen 2.5 coder 3B, which works great! This is all running on my Raspberry Pi 5 4gb (which I got from the last Hackclub event!!!), so I’m super grateful that my projects could get me such amazing hardware, thank you Hackclub! ❤️

0
0
3

Delete project?

Are you sure you want to permanently delete this project? This action cannot be undone.

All devlogs, followers, and associated data will be removed.

Followers

Loading…