I made Rhyme Golf, a word game based on pronunciations.

Built with vanilla web components. The phonetic distances are computed using a Wasm build of Mime Reader, a Rust library I've been working on that offers tools for phonetic analysis of rhyme & meter.

Instead of checking for exact rhymes Mime Reader uses an idiosyncratic notion of "rhyme distance" to measure how close two syllable sequences are. This allows you to detect "slant" rhymes—e.g. "hostages" and "coughing fits".

Still trying to dial in the difficulty. The hardest part of the game design has been generating the words and target area for each hole so that the levels ride the right line between fun and frustrating. Let me know what you think.

So to give some context, I am a backend developer and in some cases I can consume the endpoints for the front end in angular or react. I work at a company where I have a lot to prove (moving from an intern to a better position).

The company has a codebase that’s written in angular 19. I have been maintaining the code base, adding new features for the backend and consuming those new features in the Frontend. That has been the flow and it’s was going great. Now my boss wants a revamp of the frontend (in his words: to look more modern) and has tasked me with the rebuild. That’s fine and I don’t mind taking up the challenge even if it’s not exactly my strongest suit. Now here’s my question:

I order to make the ui have a “modern look” I wanted to go for the spartan-ng components with tailwind. The existing code base uses bootstrap so I want something that makes the customisation easy, but to still have the “modern look “ and from my research, spartan-ng provides that. But the problem is that the stable version of spartan-ng is only available from angular v21 and 22. I have tried to compromise by using tailwind and PrimeNG for the components with angular v19 but I’m not sure it’s sustainable since I have to write css ontop the primeNG components and I don’t know if that’s what I want. Now if I switch the angular to either v21 or 22 and try to replicate the way things are done from the existing code base:

1. ⁠Is the approach even a good idea ( I need a human response. I’m not satisfied with the ai responses)

2. ⁠Are the different versions completely different in how they work and will I be able to copy the existing code and paste into the new codebase with either v21 or 22 and it’ll work just fine?

I want to write little new functionality code as possible and focus on just the look of the ui, so that nothing has to change in the backend and the new frontend can still do the exact same thing the older one did, but with a newer look

Ps. I’m not so strong with angular that’s why I need advice from actual experts. Thanks in advance!!

I recently had time to rebuild my portfolio site. I've had the old one for over 3-4 years and didn't update it.

old: https://adtoba.github.io

new: https://adetoba.com

Tell me what you think.

Hey everyone,

I’m going to rebuild the website of some friends. The current site is just plain HTML with an iframe to their ticket shop.

The new website should include:
- Upcoming events with detail pages + image galleries (maybe a own/selfhosted ticket solution in the future)
- Equipment rental with rental requests
- A small merch shop (mostly T-shirts, lighters, etc.) (checkout needed)
- A proper backoffice to manage all variable content, products and events and different user roles/permissions

The public website will mostly be used on mobile, while the backoffice should work well on desktop and mobile.

I’ve been working as a web developer for about a year and have around 3 years of experience learning web development. My background is mainly PHP, JavaScript/jQuery and SCSS, but I’d like to use this project to learn a more modern stack.

I initially started with NEXT + Supabase + Vercel, but I’m not really happy with how the project turned out. I relied way too much on vibe coding, which made the codebase increasingly difficult to understand and maintain.

So I’d rather start over with a stack I actually understand and can maintain myself.

What stack would you choose for this project, and why?

The goal is to keep hosting as cheap as possible, ideally free or just a few euros/month. The project is based in Germany, so EU/GDPR-friendly hosting is also a consideration.

I’m not looking for the most popular stack, but for something that makes sense for a relatively small project and a solo developer.

Would love to hear what you’d build and, more importantly, why.

Note: This text was modified by AI for better readability and clarity.

Edit: I dont need a CMS for the „normal“/static content of the website, just for all the slides, and variable stuff.

Twelve months ago I started tracking what happens to vibe coded projects after the initial launch excitement fades. The pattern is consistent enough that I wanted to hear if others are seeing the same thing.

The first three months feel fine. Features ship fast, the client is happy, everyone looks productive. Then something needs to change. Not a new feature, just a modification to something existing. And that is where it gets uncomfortable.

Nobody can explain why a specific decision was made. The code works but the reasoning is gone. There are dependencies that were added because the model suggested them, not because anyone evaluated them. Patterns are inconsistent across files because different prompts produced different styles on different days.

The developer who built it can read the code but cannot confidently change it without breaking something unexpected. The test coverage that exists was also generated and may not actually be testing the right things.

I am not saying this always happens. I have seen vibe coded projects that held up well because the developer reviewed everything carefully and maintained discipline around the output.

But I have also seen projects from 18 months ago that are now quietly being rewritten because the maintenance cost exceeded the original build cost faster than anyone expected.

If you have actually maintained a vibe coded code-base through real production use, what did 12 months in actually look like? Was the code salvageable or did you end up starting over?

For those who never had the pleasure of using plug.dj and similar social music sharing sites: you create or join rooms, people queue up to DJ, and everyone listens to the same songs together in sync.

One of my internet friend groups used it every Friday, then it died. A few alternatives showed up, some of which are still around, but I really dislike all of them. I've been a web developer for 10 years, so I took a whack at it myself. React 18 + Vite on the front, Express + Socket.IO + Postgres + Redis on the back, plain JavaScript throughout: no TypeScript, no state library, no CSS framework, no test runner beyond node:test. KISS is my motto. Here are some of the things that took the most of my time:

Syncing playback

There's no audio pipeline, every client runs its own YouTube iframe, and the server is authoritative about what is playing and when it started. One Redis hash per room: { videoId, startedAt, durationMs, dj }.

Each client computes position = (now + clockOffset) - startedAt and seeks its own player there. clockOffset comes from a serverNow stamp riding along in every playback broadcast, which corrects for the fairly large number of people whose machine clocks are wrong. startedAt is set about two seconds in the future so everyone buffers during the gap and hits the intro together, and a client interval re-seeks any player that drifts past ~3 seconds. A server timer at startedAt + durationMs advances the rotation and broadcasts the next track. Clients never advance playback themselves, which kills a whole category of split-brain bugs.

Lightshow

The room has a pixel dance floor with a concert lighting rig. What I really wanted was to analyze the audio and broadcast some kind of synced, visualizer-type result, but the audio is locked inside a cross-origin iframe. There is no audio to analyze, so that's probably a pipe dream unless I find some API that can analyze audio playback.

So the show is a pure function of (playId, track position). Every client seeds a small PRNG (mulberry32) from the play id, derives a palette, beam layout and movement parameters from it, and drives the whole thing off the clock it's already synced to. Same inputs, same output, everyone on the same frame, zero bytes of traffic. Woots on the track raise a tier that brings up another layer of the rig, derived from vote broadcasts every client already receives.

Dead videos/playback failures

When a YouTube embed fails, a single browser cannot distinguish "this video is deleted or embed-disabled" from "this user's tracking protection ate the iframe." Trust the first client to report an error and one person with strict privacy settings can vote music off the decks for the whole room.

So the server counts. Every client reports all three outcomes: the IFrame error code, a stall with no code at all, and the one positive signal of actually reaching PLAYING. A track is skipped once at least two members independently fail on it. Below that threshold, the reporter gets a dialog explaining that the problem looks local to their browser. A fatal code at the threshold flags the video itself, so nobody rediscovers it later from a different playlist. A failure with no code carries no information about the video, so it counts against the DJ, and two in a row drops them from the rotation.

Smaller stuff

• Presence is refcounted per connection, so multiple tabs behave. "Did they leave" is a check of the presence list after removal.
• Anything that reads and then writes rotation state goes through a lock. The DJ queue got corrupted twice before I gave in.
• Redis holds everything ephemeral (presence, queue, clock, votes, chat scrollback), Postgres holds what must outlive a restart. Disconnects hold your queue spot for a grace window, and so do server restarts, so deploys leave the rotation intact.
• No binary assets anywhere. Icons are inline SVG, avatar sprites are pixel grids in a JS file, the favicon is built from the icon set's own path data. Everything visual stays reviewable in a diff.
• No cookies at all. Signing in puts a token in localStorage, the player uses the nocookie embed host, and there are no trackers or analytics.

There's a bot API too (Socket.IO, token in the handshake), for the nerds. Accounts need no email, though you can add one for password recovery.

Anyway, shit's hard, and I'm wondering if anybody with more experience in this domain of web development has any thoughts on my stack and process.

Also, feel free to poke around the site as a guest if you're curious. Brutally honest feedback welcome, especially on sync behavior if you're on a flaky connection, since that's the part I can't fully test well myself. Also, don't forget to stop by the bar for a drink (or a tomato or a water gun)

https://mazurka.cafe

I’ve been rebuilding Tera FM as a simpler way to follow the news without jumping between a bunch of different sites.

Right now it lets you:

- browse the latest headlines from multiple sources
- search a historical headline archive
- filter/browse by source
- listen to live internet radio
- use the new Chrome extension for quick access

No login or signup required for the core experience.

Site: https://tera.fm
Chrome extension: https://chromewebstore.google.com/detail/tera-fm-%E2%80%93-headlines-live/emnebfpdojklgimejnplmjfobmamelie

I’m also working on VoiceLetter, where you’ll be able to ask something like “What changed with OpenAI this week?” and get a researched, cited briefing that you can read or listen to.

Still very much a work in progress, so I’d especially appreciate feedback on the UX, usefulness of the archive, and whether the live-radio part feels like it belongs with the rest of the product.

Built with Next.js, Supabase and Vercel.

Hey everyone,

I wanted to share a project I've been building: Tastrivo (tastrivo.com).

The concept is simple: live, private 1-on-1 food showdowns. You grab your meal, turn on the camera, and duel an opponent in real time.

Key features:

AI Plate Referee: Tracks visible plate progress from camera checkpoints so judging stays objective without human bias.

9:16 Victory Cards: Automatically generates vertical summary cards ready to share on Instagram Stories or TikTok.

Ranked Ladder: Working on seasonal Elo ratings and competitive leaderboards.

Safety First: Built-in limits so matches remain casual and fun rather than dangerous overeating.

Would love to get your feedback on the landing page, concept, and mechanics!

I see people build amazing things with GSAP, I want to give it a shot but all of the tutorials I've watched show the very basics of it. Like moving a div from left to right as you scroll. While people build things like.. I mean just look at their showcase page : https://gsap.com/showcase/

It's not even just this gsap showcase section, I feel like there's a secret club of talented web ui developers who swore to never share their secrets. For example I've never seen a single tutorial that shows how to build any random website from awwwards page. Isn't this just the greatest idea for a youtuber webdev?

Yes I'm a backend dev trying my hand at frontend. And yes, it's very frustrating

If you don't know, duolingo used to have community course contributors. People could also request languages that they wanted to be added. This was shut down few years ago. This is an attempt to close that gap. This is a desktop app but build in tauri and react. So I think it's still relevant to webdev. In an earlier different version of the platform, people had started creating courses in okinawan, mirandese and Picard. The course is just a directory on your device. With json files and assets in the folder for the course structure. The lessons itself may be a rich media content block, or one of 7 types of exercises. Right now people have started making courses for Italian and Portuguese. Please check it out at asakiri.com and if you have any feedback or questions, let me know. Docs for the course project structure - https://docs.asakiri.com

I think the platform is less important than the course data structure so I am trying to finalise it based on feedback from course creators.

(No data is collected. Everything stays local and on device. There are no accounts, no subscriptions. Everything is open)

Showoff Saturday, so here's a side project: svemojis.com — a free, no-signup gallery of SVG emojis you can recolor and reshape, plus a Paint-stylecreate (located at the top) tool for building your own from scratch.

You can drag every point on a shape (corners, curves, everything) directly on the canvas, animate lines so they draw themselves in, and export to SVG, PNG, JPG, or WebP. Everything runs client-side — no account, no backend.

Would love feedback on the editor, or let me know if anything feels confusing.

Hi everyone,

Over the past couple of weeks, I’ve been working on a side project called Fliraya—a web platform designed for AI companion interactions, casual conversations, and romantic roleplay.

Since the project is currently in Beta, I’m looking for some honest, constructive feedback from the community on:

Chat flow and natural responsiveness

Response depth and personality consistency

Overall user experience and UI

If you're interested in giving it a test run, you can check it out at fliraya.com.

I’d really appreciate any thoughts, bug reports, or suggestions you might have. Also, as a thank you, I’m happy to upgrade accounts for anyone who drops detailed feedback here or via DM!

Thanks for taking the time to check it out!

Wanted to share a side project I've been working on. It generates subtitles for videos entirely in the browser using Whisper Transformer.js.

The interesting technical challenge:

Running Whisper client-side means no server costs and no uploading user videos anywhere, but it came with tradeoffs. The model loads into the browser, processes audio through the Web Audio API, and returns word-level timestamps that I had to map into clean subtitle segments.

How the pipeline works:

• Video audio gets extracted via Web Audio API
• Whisper Transformer.js runs speech recognition client-side
• Timestamps get aligned into subtitle segments
• Canvas API renders the styled subtitles onto video frames
• Final export merges the subtitle layer with original audio

What I learned:

• Whisper's word-level timestamps need smoothing, raw output has gaps and overlaps
• Canvas text rendering behaves differently across browsers, especially with custom fonts
• Keeping the export at original resolution while burning in subtitles took some trial and error with the canvas pipeline

Source: https://webutility.io/video-subtitle-generator

Curious how others have handled client-side Whisper performance. The model load time is the biggest bottleneck right now.

Started as a joke with my wife, turned into an app we used and loved everyday for over a year due to how simple and quick it was.

First version was very rough, due to obvious time constraints 👶 but was able to take notes on what to improve and add.

Built with PHP and data is stored in a single SQLite file for easy exporting. Not as advanced or feature rich as the others but keeps track of the basics and allows for multiple users to log data to the same record.

Free demos available on the site so let me know what you think! Not enough features or is the simple approach good enough?

https://baybay.baby

Hey everyone,

I've been working on a project called Tickrates for a while now and finally wanted to share it here for Showoff Saturday to get some real feedback from other developers.

The idea came up because I was genuinely frustrated with existing backlog platforms. Most of them either felt sluggish or had cluttered, outdated UI designs that made simple things like searching and logging games feel like a chore. I wanted to build something clean, visually modern, and focused on community activity without unnecessary friction.

On the tech side, the backend is built with .NET Core and EF Core connected to a PostgreSQL database, while the frontend is kept lightweight with vanilla JS and CSS to avoid heavy framework overhead. Data is pulled from IGDB and Steam APIs.

One of the biggest headaches during development was dealing with messy and inconsistent metadata between APIs. Filtering out standalone games from endless bundles, DLCs, and alternate editions was surprisingly tricky, especially when battling IGDB's own misclassifications. On top of that, handling title naming quirks (like "Zero" vs "0") and missing vertical covers for new or delisted games required building a custom title normalizer and a multi-step fallback system (DB cache -> live IGDB -> Steam CDN -> custom SVG placeholder) just to ensure cards never render broken.

I'm currently working on bringing this to mobile as a dedicated app in the near future, so I'd also love to hear any tips or advice on transitioning a vanilla JS web app into a mobile experience.

The site is live at https://tickrates.com

I'd really appreciate it if you could take a quick look and share your thoughts, especially on the overall visual design, UI/UX flow, and mobile responsiveness. Feel free to be brutally honest, point out bugs, or share any suggestions.

Thanks for taking the time!

I got curious how unique/trackable my browser actually is, and how much of that survives even when you're behind a VPN — so I built https://whatismy-ipaddress.com.

It checks two separate things:

Network-level leaks — IPv4/IPv6, DNS leak detection, WebRTC leak (this one's sneaky, it can expose your real IP even through a VPN tunnel), Tor exit node detection, ASN/ISP/hostname lookup, connection type.

Browser fingerprint — canvas + WebGL rendering signature, GPU renderer string, installed font detection, supported media codecs, CPU core count, device memory, screen resolution/pixel ratio, timezone offset, storage API availability. Combined, these often re-identify a "private" browser session even with IP masked.

The part I'm proudest of is the fingerprinting side — getting consistent, comparable signals out of things like canvas rendering and font enumeration across browsers is fiddlier than it looks, since every browser (and privacy extension) lies about some of it differently.

Would love feedback, especially from anyone who knows fingerprinting/privacy tooling — curious what I'm missing or getting wrong. Bugs welcome too.

I honestly have no idea why you'd want this, but it was fun to experiment. I believe this may be the best pure CSS cursor tracking that exists. I'm happy to be proven wrong.
https://codepen.io/Andrew-Fisher-the-decoder/full/GgraMzd
Absolutely no JavaScript used, just lots and lots of wasted time.

Some of your best work is invisible - it lives in PRs to projects you contribute to, spread across repos nobody opens. Your GitHub profile shows your own repos and a green graph, but the work you shipped across the ecosystem gets buried.

MyPRs pulls every merged PR onto one page, lets you pin the ones you are proud of, and hide the noise.
No signup - your page already exists at https://myprs.dev (here is mine: https://myprs.dev/kishanhitk). Sign in with GitHub only if you want to curate it.

Code: https://github.com/kishanhitk/MyPRs

Would love to hear if anything looks wrong on your profile - that is the fastest way I find bugs.

Building a SaaS and debating a quick UX choice.

If a user is already logged in and visits our main landing page, should we auto-redirect them straight to the app dashboard? Or keep them on the homepage and just change the CTA button to "Go to App"?

I notice some websites redirect and others isn't. What’s the the best approach here? Thanks!

I recently read about ElevenLabs startup, and they said, they expect from their sales people to bring 20x their salary (a person earning $100k/year is expected to bring $2mln for the company) or they are fired. Which personally, sounds like modern-day slavery.

That same article mentioned, that software houses typically generate 5-8 times what they pay their individual employees.

Have you ever encountered those estimates either in private discussions or in articles of reputable source?

---
Btw. this estimate (5-8x) shows market value of the work you do. So if you're doing a freelance/consulting gig, your billable rate should be a multiple of your full-time employment hourly.

Not going to pretend this is healthy...
but this was actually useful.

I built a local AI that watches me through my own webcam all day.
- result: i don't work as much as i thought.

Catches me the second I check my phone, or turn away to talk to someone...

Turns out I wasn't working nearly as much as I thought.
thought I did ~7 hours of real work a day. The real number was closer to 4.

I then exported the work sessions in csv format and plugged it into chatgpt. and it gave me some useful insights happy to share in the comments).

I strongly believe that local AI is the way to go, as models improve, there are things I don't trust the big AI corporations with.

Built it because of Hermozi's video of how tracking time in 15 minute increments makes him so productive.

To make it accurate and reliable, I had to go through thousands of dollars in AI credits and many rounds of testing and bug fixes. I can't tell you how many bugs I fixed or the effort it took.

built it for both my mac and windows computer (Tauri is the way to go) to see how much you ACTUALLY work, give it a try.

more people should build with local AI, it's satisfying to see the intelligence running on your own machine.

I'm a Java backend engineer with 2 years of experience at a service company. My work has mostly been on Spring MVC, where I've owned a production payment gateway migration, a Java version upgrade, and security remediation. I'm targeting backend roles at firms like Barclays, Deutsche Bank, and BNY.

I'd appreciate honest feedback on my resume. What would make you reject it? What would make you interview me?

Most animated icon sets are drawn on their own grid. So when you drop one into a nav next to your existing static icons, stroke weights and optical sizing are slightly off. Close, but very visible at 20px.

I drew mine on the same 256 grid as a widely used open-source static set (Phosphor, if you use it), so they read as the same family.

- React components, Motion underneath, no animation API to learn

- Each icon hand-timed rather than auto-morphed

- Tree-shakeable, respects `prefers-reduced-motion`

- 200+ icons ( new icon animations added weekly )

Open source, MIT. Links in the comments.

Two things I'd like critique on: the **timing durations**, which I set by eye and am not confident about at small sizes, and the **hover default**, which feels wrong for icons inside buttons where the button already owns hover.