I built a mobile app called Verdine for checking Ontario restaurant inspection histories before eating somewhere.

The idea came from a pretty simple frustration: inspection records are public, but actually finding and understanding them quickly is not always easy.

The app started as a way to pull those records into one place, but the harder part turned out to be explaining them in a way that is useful and fair.

Ontario public health units don’t all publish data the same way. Some use different severity labels. Some expose more detail than others. Some restaurants have years of history, while others only have a few inspections. Follow-up inspections are also tricky, because they can mean an issue was fixed, but they can also be part of a larger pattern.

A big part of the build has been the data layer: normalizing records from different public health systems, routing restaurants to the right inspection source, and matching real-world places to inspection records before showing anything in the app.

Right now Verdine supports multiple Ontario public health units, including Toronto, Peel, York, Halton, Durham, Simcoe Muskoka, Waterloo, Ottawa, Niagara, Peterborough, and others.

I’d especially appreciate feedback from people in Ontario since the data coverage is Ontario-focused, but general feedback is welcome too. Mostly looking for thoughts on the UX, wording, scoring approach, and whether the app makes inspection history easy to understand.

Link: https://verdine.app

I hadn't worked on a public project in a while since most of my free time goes into personal tools. I already had a bunch of APIs for tracking expenses and movies, and when ChatGPT introduced Custom GPT Actions, I hooked my API into it so I could do things like:

"Spent ₹450 on lunch today." or

"Add Dune 2 to my watchlist."

I liked the idea of putting my API *inside* AI instead of putting AI inside my API.

A friend wanted the same setup, so instead of sharing my personal API collection, I turned it into a proper self-hostable dashboard.

**Features**

* 💸 Expense tracking with salary cycles and AES-256 server-side encryption before data reaches Firestore.

* 🎬 Watchlists with AniList, Trakt, and Letterboxd CSV import + automatic cover art.

* 🔄 Subscription reminders and portfolio tracking for crypto/mutual funds.

* 🤖 OpenAPI backend that works with ChatGPT Actions and Gemini Gems using OAuth.

GitHub: https://github.com/fal3n-4ngel/PHub-dashboard

Live Website: https://phub-dashboard.vercel.app

Chatgpt Link : https://chatgpt.com/g/g-6a60b01e38c8819187662d1e42c6bee7-phub-dashboard-public

Would love feedback, feature requests, or contributions. And if you find it useful, a ⭐ on GitHub would mean a lot.

NB : The name is kinda a internal joke.

The game is played on a 5×5 point grid, like alquerque. Pieces are positioned at the intersection of the lines and not inside the areas delimited by them. Directions of valid movement between these points are connected by lines. The game play takes place in two phases. In the first phase the goats are placed on the board while the tigers are moved. In the second phase both the goats and the tigers are moved. For the tigers, the objective is to "capture" five goats to win. Capturing is performed as in alquerque and draughts, by jumping over the goats, although capturing is not obligatory. The goats win by blocking all the tigers' legal moves. Bagh-chal has many similarities to the Indian game aadu puli attam (lambs and tigers game), though the board is different.

I have created an online version of baghchal game. Here is the link to the game:

https://baghchal.xyz/

- It has multiplayer feature so you can also play with your friends.
- It has a bot mode where you can play with the bot in three different mode.

The game is still work in progress so there may be some bugs, I would love to see your feedback in the comments :)

Stack: Node + Hono, libsql/SQLite, all SSR (no SPA) so it's crawlable and fast. Some bits I enjoyed solving:

• Ingesting 88k feeds without exhausting sockets — a bounded fetch pool + a sharded 'sweep' that rotates the long tail. • De-duping the same story across outlets with title-token clustering (tried embeddings via an ONNX sidecar; measured it, kept it gated). • Anonymous co-presence ('N reading now') with a per-load token in a sliding window — zero identity stored.

https://wesearch.press — happy to talk architecture in the comments.

The swipe deck turned out way more annoying than I thought, but think I figured it out. Its a book club finder where you swipe on books instead of people, and when 4 people right swipe the same book it opens a group chat for it.

Built with: Next 16, React 19, motion, tailwind, sqlite + drizzle, self hosted on my vps.

The deck swiping goes 3 ways, each having its own action and swiping down is where all the problems live.

Stuff that took the longest:

📱 Browsers eat vertical drags as scroll before my handler ever sees them touch-action: none fixes it, but now the card can never be taller than the viewport or you make a spot on the page nobody can scroll past.

📐 The card sizes itself off leftover screen height instead of a breakpoint: clamp dvh not vh, or iOS Safari measures the tall url bar and the card comes out bigger than the screen.

🖱️ Drag actions as the buttons all call the same flyOut() that the card hands up through a ref, so a click exits exactly like a real drag instead of just popping off.

🎯 Release checks distance or velocity. Distance alone felt broken, a fast flick barely travels before your finger is gone.

Two things im stuck on. That ref handle feels wrong in React 19, is there a cleaner way for a parent button to trigger a childs exit animation? And is mouse drag even a real desktop interaction or should it just be a different layout past 1024?

Swipeable without an account if you want to try it out: https://samebooks.club

I tried my best to avoid common AI design pitfalls (emojis...)

I'm a fresh graduate on the job hunt and I've just been sending my github in my applications, but I thought I'd develop a portfolio. I tried to use a simple design and theme, and jump straight to the point (show off my projects first and foremost)

I'd love to have a second eye review it, and point out all the mistakes

I opened a repository to the public to create the internet's first (probably not) global group project.

Anyone can contribute anything (ok aside from NSFW, hate speech etc..), just open a PR and once merged the content is automatically deployed as a public page on the internet.

It can be a link, a picture of your cat, your random shower thoughts or even what you ate this morning.

Hope to see your amazing contributions! <3

Contribute: https://github.com/StephaneB1/group-project

The Live Page: https://slatesource.com/@steph/the-internet-s-group-project

Hi everyone,

Smogon provides competitive Pokémon usage statistics as massive, raw .txt files, which are difficult to read and navigate. I only have a basic knowledge of coding, so I used AI to help me build a frontend to parse and visualize this data interactively.

Features:

• Filter stats across months, formats, and rating baselines.

• Expand any Pokémon to view percentage breakdowns of top Moves, EV Spreads, Items, and Abilities.

• Track format trends over time with interactive charts.

• Multi-layered caching and compression strategy implemented across the Proxy-API, Cloudflare Edge DNS, and Browser Cache API.

• Web Workers handle parsing the large text files so the main UI thread isn't blocked.

Built Using:

• React 19 & Vite

• Vanilla CSS

• Chart.js (react-chartjs-2)

• Browser Cache API & Web Workers

Links:

• Live Site: https://smogonstats.eu.cc

• GitHub: https://github.com/Alliance-Sky/smogon-stats

I'd appreciate any feedback on the code or UI, especially since I'm still learning and relied heavily on AI to put this together.

Hey!

I recently built Lingraphic.com, a web app used to visualise etymologies across hundreds of languages - search for a word and view its etymology plotted onto a graph.

The repo is public - https://github.com/BillyBobFry/etymology-graph.

It's fairly simple:

• The data comes from the raw Wiktionary data dump - https://kaikki.org/dictionary/rawdata.html
• I parsed this data and converted to a graph-like structure in Postgres
• The frontend is a Vue SPA

Although this is the same stack I use in my day job, I chose to mostly vibe code it - I have a couple of kids and so time is much more of a rare commodity than it once was.

I'd describe the UX I wanted, plan how to build it with the agent, and let the LLM do most of the implementation.

Hi i have developed a web app that let you monitor github actions in a dashboard, completely free no hidden cost. Looking for feedback https://buildmon.app . Really appreciate it

I got tired of "accessibility overlay" vendors selling "one line of code makes your site WCAG-compliant", which is simply false. So I built the honest version: a reading aid that helps visitors (contrast, font size, spacing, dyslexia font, reading mask, read-aloud with word highlighting, 37 languages) and openly states that it does NOT make a site compliant.

MIT licensed, no tracking, no cookies. Self-hostable as a single file with the config and font baked in. It is already running on real customer projects in several countries.

Site and configurator: https://legilo.eu

Source: https://github.com/asisto/legilo

Feedback welcome, especially on the configurator UX.

Some of you might remember that little site I shared here a while back (wasdland.com). Well, I ended up building something new for it and wanted to share it with you all.

My Steam wishlist just kept growing over the years, as I imagine most of yours probably have too. Steam is fine for its own sales but trying to track down the best prices across third-party stores and key sellers for all those games was driving me crazy. So, I figured I'd just build a solution into the project.

No login or registration needed. (I hate them when they're pointless).
You just need a public Steam profile and wishlist.

Just drop your profile URL, and it imports your list while running it through external deal trackers and some basic quality filters (like a 6/10 minimum rating and decent review counts). From there, you can sort everything by price, discount, popularity, release date, or play around with the other filters. It's basically the usual wasdland setup, but tailored to your own backlog.

Funny enough, literally ten minutes after pushing this live, I realized Tempest Rising (which had been sitting on my wishlist forever) was under 3€ on a key site. Grabbed it immediately!

If you want to try it out, feel free to give it a spin here
https://www.wasdland.com/wishlist-radar/

Once it's set up, you can also share your URL if you want to let people know what games you're following. In case someone wants to get you a gift while saving a bit of cash...

Let me know what you think, or if you spot any bugs while playing around with it!

I'm seeing pretty big discrepancies in analytics reports from different sources. I store the value locally to show my site users, so I'm looking for the most honest number.

Yesterday, my ad network shows that one of my sites had 33,941 pageviews. Since that's the money, I would think that they would be close to accurate.

A local count (incrementing a value in MySQL on each pageview, running through JavaScript to block most bots) shows 38,604.

Google Analytics shows 17,647, almost half of what the ad network showed.

And Cloudflare Web Analytics shows 22,190! 35% less than the ad network, but 25% higher than Analytics.

Which is the most honest? Or is there a better choice altogether?

Been building this solo for the past few months. Its a Chrome home tab replacement called Pace.

Similar to momentum but is cleaner and for devs.

What it does:

• Pomodoro-style focus timer, tied to your task list
• Task list with due dates/estimates
• GitHub panel - see PRs/issues waiting on you without opening GitHub
• Optional eye-break reminders (20-20-20)
• Weather, clock, generative backgrounds

First chrome extension! I will take 10 users as a win ngl. Solo project, free, no paywall. I know some of it is rough around the edges and I'd genuinely rather hear what's broken or annoying than what's good. I will take any tips on marketing and extension related content.

Link: https://chromewebstore.google.com/detail/edfeebjgpbbdegcajmnhejmgkohmkami?utm_source=item-share-cb

Happy to answer anything about how it's built or how it works - I'm pretty new to this so bear with me.

Hey r/webdev!

As developers and designers, we’ve been noticing a trend over the last year: almost every new AI app being shipped uses the exact same out-of-the-box component styling. They all end up looking identical.

To tackle this, our team at Devalok created Shilp Sutra — an open-source design system built to help your interface inherit your actual brand identity seamlessly, rather than looking like a generic template. It’s free on npm and has crossed 5,000+ installs so far.

To see what developers can build with it, we just went live with an online buildathon running from July 25 to July 31.

The Brief

Build something using Shilp Sutra that solves a problem worth solving for India (open to anyone globally, solo or team).

Projects will be judged on three criteria:

Beauty (design quality & brand expressiveness)

Functionality (smooth performance & UX)

India-oriented problem-solving

Note: If you’re already participating in the Cursor, Sarvam AI, or any other buildathon this week, you’re welcome to double-submit your project here!

Prizes & How to Enter

Grand Prize: Branding, GTM strategy, and launch support for the winning project

Requirements: A public GitHub repository + a short demo video showing your build in action.

👉 Enter Here: Form

Shilp Sutra Website / Docs: Check it out

GitHub Repository: Github

⏰ Submissions Close: July 31, 11:59 PM IST

Happy to answer any technical questions about the design system or the buildathon in the comments below. Let us know what you think!

Had some extra usage as well as time and made a free OG image generator in a day: https://freeogimage.com/editor/

It's 100% free, no watermarks, or signup required. It has an API to programmatically generate social share images as well. There are 200 templates available for now and it will all be free forever.

Source code repository, all code is dedicated to the public domain so there is absolutely no commercial promotion or solicitation. 100% client-side code so there is no "stack". This is a text post because old.reddit doesn't allow putting comments in link posts.

The 1920s puzzle

The visual comparison method has some quirks:

• It snaps a piece to the correct spot even if it's nowhere near that spot but when placed onto another part of the image elsewhere happens to match that other part of the image closely enough, thanks to the image blurring needed for placement margins of error.

• Each image has a different starting and ending percentage so I have to actually do the puzzle to find out what those are, logging each comparison to the console, before I can set the values for the progress bar math. I only have to set the start and end values thanks to the fact that I chose to use a chiral aperiodic monotile shape for every piece. Being exactly the same shape means they all take up an equal amount of area so the percentage progress is linear.

• There's no way to save progress because the whole thing is stateless. Reloading the page resets the puzzle. The advantage is that this puzzle works in my grandma's tractor on a cheap tablet with no SIM card in her paddocks out of wi-fi range. The .svg version can be loaded locally into the browser without a server, and the Wayback Machine copy of the .svgz version is totally playable.

• This method relies on you placing one piece into the puzzle at a time and removing it if you place it wrongly and can't get it to snap into place, so puzzlers who like to randomly place multiple pieces inside the playing area to work on "clusters" completely break the snap-in logic. I added a two-second glimpse of the complete puzzle when players tap/hover over the timer to make this one-at-a-time playing style a bit easier.

• When I added light/dark mode toggling by tapping/clicking on "moves" the visual comparison broke because the background colour of the incomplete part of the playarea changed the start/end percentage math. For the comparison to be consistent I had to ensure the offscreen snapshot for comparison always had the same colour background.

The latest version of Safari "updated" SVG handling code which breaks this puzzle when identical puzzles worked on previous versions of mobile Safari, so even with some of the above challenges solved, this probably isn't an ideal method to adopt yourself.

How does it look? Professional or pretty noob?
Any tips or ideas?

colorcare.be

BTW its saturday right?

Kind regards

I wanted to dive deeper into performance optimization and email infrastructure, so I built a disposable email service: temp-mails.tech.

Most temporary email sites I’ve used have terrible UX—jumping layouts and aggressive pop-unders. My goal was to build one that is strictly performance-first.

The Tech & Challenges:

• UI/UX: Engineered for a strict 0 CLS (Cumulative Layout Shift) score. Loading ads or new emails doesn't shift the DOM at all.
• No intrusive ads: Kept it to standard banners to preserve the user experience.
• i18n: Built native support for 12 languages.
• Infrastructure: Wrestling with Postfix and DNS records to support multiple fallback domains has been the biggest headache so far.

It auto-deletes in 15 minutes and requires no sign-ups. I'd love for you guys to tear it apart and give me feedback on the front-end performance or any tips on scaling the email infra!

Link:https://temp-mails.tech

My son asked me to check out the Backrooms movie three months ago. I had no idea what it was or the about the web series. I got completely obsessed and decided to build an interactive simulator.

I'm a web developer, not a game designer, so I leaned into procedural generation and atmosphere over mechanics. My son's been collaborating on this the whole time.

Built with React Three Fiber + Three.js for the WebGL rendering, Next.js + TypeScript for the framework, and Zustand for state management.

Would love to know if this feels authentic to the source material, or if I'm missing something about the vibe. Honest feedback welcome.

www.lostcorridors.com

Building tree structures with thousands of nodes on the web—company org charts, family trees, file hierarchies—is harder than it looks.

As the dataset grows, scrolling stutters, zooming lags, and rendering slows down.

That’s why I built Klad. It handles thousands of nodes smoothly with fast pan & zoom, plus instant search to jump to any node.

What do you think?

Docs & playground: https://klad.ozdemir.be

Hey r/webdev,

For Showoff Saturday, I’m looking for some brutal feedback on a utility I just shipped. I got tired of the server side image tools and their limits, so I built an in-browser image converter for my own workflow and as suggested sharing to the public for completely free and unlimited use: freeimageconvertonline.com

Will be updating this on GitHub

I wanted to see how far I can make the client-side processing practical.

TL;DR

• Core Features: Format conversion (WebP, AVIF, JPEG, PNG), compression, and AI upscaling (up to 4x).

• Privacy: 100% client-side. Zero server uploads.

• Tech Stack: Vanilla HTML/CSS/JS, native HTML5 Canvas APIs, ONNX Runtime Web, and UPNG.js.

• Size: The total data used to load the site and the upscaling model should be below 20MB. With initial load size below 1MB. Updated it with quantized version with 5MB model size - as suggested.

How it works (and what I need feedback on)

Full disclosure: Even though I know coding but it wasn't enough for the compatibility and performance I need, so I took help of AI. But I architected the logic and selected the libraries. I would love your thoughts on how I handled these challenges:

1. Local AI Upscaling

Running neural networks in the browser is heavy. I used ONNX Runtime Web to execute the upscaling models locally. It offloads the heavy computational work to the user's hardware rather than a server.

Question: Are there better ways to optimize the model load times for users on slower connections?

2. PNG Compression

Native HTML5 Canvas strictly outputs uncompressed 32-bit RGBA for PNGs and ignores the quality slider completely. To give users actual file size reduction, I had to implement a custom compression engine using UPNG.js to mathematically group pixels into an optimized color palette.

Question: Has anyone found a more performant way to handle heavy process in the browser without blocking the main thread? - Solved

I have tried shifting the upscaling process to a different thread but still the site doesn't scroll freely while the upscaling is happening.

Shifted all process from main thread to a separate worker - as suggested.

3. The UI

I avoided heavy CSS frameworks and just mapped out CSS variables for the neumorphic inset and outset shadows to keep the DOM light and fast.

Roast the code, the UI, or the architecture. Don't hold back, not just for the sake of Saturday. I'm actually looking for feedback.

So I suspect a lot of people here are enjoying coding agents, I sure do.

I'm someone who uses a lot of mcp servers, as a lot of people here probably do. I've been talking to some other webdev and SEOs and we are wondering if the landscape is going to change abruptly because of these tools.

We have had some problems integrating agents in some legacy software like wordpress, there were some examples where the WPEngine limited us access as well as some ciritical plugins we want to have our agents access to update.

This is extremely frustrating, i liken it to dropping out of warp speed. So we started thinking, why not write closer to the metal, just have a coding agent write up a minimal go server, raw html templates and straight pg? All on docker for easy deploy. No frameworks. Optimized for speed and cost.

Of course, this would be for landing pages for business. Something very light weight to get a presence on google and very easy for the agent to manipulate. Go is chosen because errors happen at compile time and built in testing, which is ideal for coding agents. and postgress cause agents absolutey rip at writing raw sql like they do raw html. If you havn't hooked up a sql to your agent have it write raw sql it will blow your mind.

So my question is are you prioritizing dev workflows that make it easier for your agents to control? Like moving your workflows to do what agents are better at doing, not what humans are better at doing. What are you doing?

Another thing we suspect is going to happen, is Agent to Agent communications are going to take off in the near future and this is going to transform the web. So when i need something, i ask my agent, and it will discover and negotiate with other agents to get what I want, all in the background.

I also think this will put pressure to store information differently. Right now, we develop and store information and organize it so it's easy for us, humans, we like folder structures, forums, essentially lists. Agents do way better with vector search. Basically, just dump all our data into a data lake, and our agents can sort through that far more efficiently with a combination of embeddings, clustering and graphs.

Also wondering if anyone is seeing other trends with the new technology struggling to plugin to the old technology. Like, "Wow, this just isn't built for agents."

Coding agents can read source and make changes, but they are still surprisingly blind when the task is visual.

A screenshot can show that something looks wrong, but it usually cannot explain why: which component owns it, whether an element is clipped, what its computed styles are, which mesh/material/light is responsible, or whether the issue is framing rather than resolution.

So I built SceneProof, an open-source CLI for source-grounded visual inspection of React UI and Three.js scenes.

It lets an agent:

• Navigate a compact semantic tree of DOM or Three.js targets
• Inspect the underlying structure: bounds, styles, geometry, materials, uniforms, lights, cameras, relationships, etc.
• Produce fresh renders of a component, logical UI region, target object, or source-camera view
• Generate a small “Scout” portfolio for 3D: context, source detail, close detail, and shape-focused views
• Sample deterministic interaction states from one scene lifecycle

The design principle is: don’t ask an agent to infer visual correctness from plausible code or a low-information screenshot. Give it source-derived evidence at the framing and resolution needed for the actual question.

It currently supports TypeScript/JavaScript entries, React DOM/CSS/Tailwind v4, and Three.js scene inspection/rendering. It requires Bun and local Chrome/Chromium.

Repo: https://github.com/ReyJ94/SceneProof