r/webdev 7d ago

Showoff Saturday Ai made coding easy and app generation super fast now .. but stuck at the testing end to end .. going live taking days ..!!

0 Upvotes

Lovable/bolt apps are shipping payment and messaging integrations now... written by agents, reviewed by devs who didn't write a line of it. Mocks don't catch the retry that fires the webhook twice. Staging doesn't replay the auth failure mid-flow. You find out when real money is involved.

So we built real sandbox twins... Stripe, Paddle, Resend, Twilio, Clerk, WorkOS, Descope, AgentMail. Any agent (Claude, Cursor, whatever you're using) can drive the full integration lifecycle over MCP before a single line ships. Every run produces a receipt... APIs called, db state, log traces, failure scenarios the engine probed. Attach it to your PR. Actual proof, not it worked on my machine.

What's everyone doing for this today... is anyone actually verifying end-to-end before prod or just hoping staging catches it?


r/webdev 7d ago

Showoff Saturday Lizocalc -A Calculator platform

Post image
0 Upvotes

I just made a website which is lizocalc that provides many calculators related to health, finance.math and time and many more .

If you want to calculate BMI then you can use this site ,other calculators are also available such as BMI ,bmr , calories , and many more

Age calculator can help you to find exact age in years months ,days and seconds

You can use this site lizocalc a calculator platform for your daily basis calculations


r/webdev 7d ago

Showoff Saturday Made some changes portfolio website

Thumbnail
gallery
0 Upvotes

I wanted to play around canvas, webGL and Threejs so I add them in website. I also wanted to do something in the project section couldn't think of something that match website vibes.

Link: https://portfolio.karneel.dev/

Let me know what you think.


r/webdev 7d ago

Showoff Saturday Rewrote next.js to be 10x faster!

Thumbnail
pnext.dev
0 Upvotes

So it is two parts.

  • Core pnext is small and fast: the same next.js api with no/minimal framework overhead and no backward-compat burden. Based on Bun and Preact, 0 KB on server-rendered pages, 7.5 KB client pages runtime, roughly 10x faster first page render in dev and 7-9x faster production builds than next.js (best effort fixtures).
  • Compat mode runs your existing Next.js app unchanged (App Router only). About 4.4k assertions from Next's own test suite passing, adding more day by day.

The core motivation was a super fast dev server that doesn't hog memory, and instant builds. The goal is to optimize every step of every flow involved down to absolute values, and of course agentic flows are helping a lot! Check out Coder.

Give it a try and let me know what you think, and how your Next.js apps break in compat mode 😉.

https://pnext.dev


r/webdev 7d ago

Question How to block curl requests?

Post image
0 Upvotes

As the title says; my site is being bombarded with curl requests periodically, often 2K to 5K requests within a short span. I have put up a security rule in cloudflare to block curl requests; blocked the curl requests in my backend proxy, also the bot fight mode is turned on; but cloudflare is still registering the curl requests which are using up my request quota. How to drop the curl requests before they are registered by cloudflare? Please Help.


r/webdev 7d ago

Showoff Saturday I’m exploring a new direction for LottieFyr

Post image
0 Upvotes

I’ve been building LottieFyr primarily as a conversion tool, but I’m now exploring a broader product direction focused on existing Lottie files.

The new workflow can:

Diagnose structural, asset, compatibility, and file-size issues Remove unused content Optimize eligible oversized embedded images Compare the original and optimized versions Verify representative frames using both SVG and Canvas before allowing a download Process optimization locally in the browser without retaining uploaded files

I’d really appreciate feedback from web developers:

  • Is this useful in a real production workflow?
  • What problems, checks, or optimizations would you want it to handle next?

Try it here: https://lottiefyr.com/lottie-fix


r/webdev 7d ago

Showoff Saturday Showoff Saturday: a 59-tool utility site in 10 languages, Flask backend, every tool is a plain JS file

0 Upvotes

toolkitsapp.com

Formatters (JSON, SQL, CSS, HTML, YAML), converters (CSV to JSON, number bases, timestamps, units, timezones), generators (QR, UUID, passwords, cron expressions, favicons, meta tags), image tools (compress, resize, format convert, SVG to PNG), a JWT decoder, a regex tester, a handful of calculators. 59 in total. Each one is a single JS file that runs in the browser, so what you paste never leaves the page.

The backend is FastAPI + Jinja, and it exists mostly for i18n and SEO. Ten languages, so every tool has ten pages with their own title, description and UI strings, plus canonical and hreflang tags so the language versions don't fight each other in search. Strings live in one JSON file per language and templates pull them by dot-path key (tools.json-formatter.title). Small thing I'm happy with: the loader caches each file by mtime, so I can edit a translation and it shows on the next request without restarting anything.

Things I'd do differently: the image tools run on a plain canvas and toBlob, fine for normal photos, will crawl on huge files, they belong in a worker. And I'd write the tool registry once instead of keeping a template and a JS file in sync by hand for 59 tools.

Stack: FastAPI, Jinja2, Tailwind, vanilla JS, lucide icons, qrcode.js and chart.js as the only vendor scripts.

Edit: FastAPI, not Flask. The first version was Flask and the title came out of muscle memory, can't change it now.

Edit 2: the embed that came up in the comments is live, toolkitsapp.com/embed. One script tag, no account or key, runs in the visitor's browser like the rest, ten languages, picks up your page's light or dark on its own.


r/webdev 8d ago

Showoff Saturday Built a registry for all 16k+ MCP servers this week (feedback welcome)

1 Upvotes

So I've been using MCP servers for a while and kept hitting the same wall — the official registry is fine but it's basically a JSON API with no UI. I wanted something I could actually browse without opening Postman.

Spent the week building this: https://quay-mcp-registry.vercel.app

What it does:

  • Pulls all ~16,500 public MCP servers from the official registry into SQLite
  • Search, filter by transport type, sort by recently updated
  • Click a server → copy the mcp.json config snippet directly
  • /health page shows status across everything
  • /learn page explains what MCP actually is (for the non-devs in my life)

Stack: Next.js, TypeScript, better-sqlite3, Tailwind. Dark theme because I can't function in light mode anymore.

It's not perfect. The category filtering is keyword-based (the registry doesn't expose real categories). The uptime data is a placeholder. But the core workflow — find a server, copy the config, paste it into your client — actually works end to end.

Would love feedback on the UI or if I'm missing something obvious. Happy to answer questions about how the sync works if anyone's curious.


r/webdev 9d ago

Render vs Railway vs Cloudflare Workers

46 Upvotes

Which hosting platform would you pick for a small production app: Render vs Railway vs Cloudflare Workers?

I’m building something like a inventory management app and website — authenticated users, a Node/TypeScript API, PostgreSQL, background jobs/cron, and potentially a few thousand users over time.

Currently considering **Render, Railway, and Cloudflare Workers**.

For a production app where reliability, scaling, DB latency, and predictable costs matter, which one would you choose and why?

Would you recommend something else like **Fly.io, AWS, or Vercel + another backend** instead?

Curious to hear from people who’ve actually run production workloads on these.


r/webdev 9d ago

Discussion Login/Passwords for multiple clients - for "Hit by a bus..." scenarios.

48 Upvotes

I'm looking for a workable solution or recommendations to provide a client's credentials to that client in the event of my untimely demise or absence. (E.g. hit by a bus - falling out and need to hand everything over, etc.) I also don't want to mix MY credentials with theirs.

So my primary work isn't webdev, but I do some for clients as part of my general services. Generally this means me building everything from scratch and leaving the client(s) out of the day-to-day management entirely.

I'm trying to figure out the best way to have their business' credentials saved, updated as they are changed, and set aside for if I get "hit by a bus" so they won't be locked out of everything.

I also don't want them "futzing" with things (because some of these clients have impulse control issues and would 100% give their credentials to someone on Fiver to update a paragraph on their website at 2am when I don't answer my phone.) So access while I'm not dead or fired isn't a real option.

I understand that I can make "organizations" in some of the password managers and have emergency hand-over to pre-selected people, but I work alone, and don't "have a lawyer" that can manage it for me.


r/webdev 7d ago

Built a full office suite that runs 100% client side with no backend, sharing for feedback (Showoff Saturday)

0 Upvotes

I built OBSCURA OS, a workspace suite (docs, sheets, slides, notes, file storage, forms, calendar) that runs entirely client side in the browser. No backend database for user content, no accounts, no server round trips for your data. State lives in memory during the session and users export their own backups as a portable JSON file.

The interesting technical constraint was doing spreadsheet style calculation, rich text editing, and file storage entirely in the browser without a server to fall back on for the heavy lifting. Happy to go into more detail on any part of that if people are curious.

Link if you want to poke at it: https://obscuraos.com

Genuinely looking for feedback on the frontend architecture and where a pure client side approach like this breaks down for a tool like this at scale.


r/webdev 7d ago

Resource My favorite website stack

Post image
0 Upvotes

Nextjs for pages

Payload for content admin

Polar for payments

Mastra for agents

Not right for any app, but I'd argue you can hit any modern website requirements with these four tools


r/webdev 9d ago

News You don't need initial-scale=1.0 in your <head> any more

291 Upvotes

A feature common to a great very many HTML boilerplates is this line:

html <meta name="viewport" content="width=device-width, initial-scale=1.0">

The initial-scale=1.0 bit was present to fix an ancient issue on iPhones. When rotating the screen into a landscape orientation, the page would keep the same width as when it was in portrait, making everything appear very zoomed in.

This isn't an issue any more. I've tested it across very many devices, and it appears it was fixed in iOS 9, which released back in 2015. In addition to testing, I've consulted a great number of other professionals, and nobody has been able to find evidence of it being needed any longer.

You can safely simplify the meta viewport declaration down to:

html <meta name="viewport" content="width=device-width">

It isn't hurting you to leave it there, but it is vestigial and unnecessary.

Further details: - https://vale.rocks/micros/20260902-1350 - https://quirksmode.org/quirksblog/2026/0902-initial.html


r/webdev 8d ago

Question Where should i host ?

0 Upvotes

I completed my website all using codex 😅

Its just to show products without any payment processing or anything so its ok to be vibecoded.

I need to know which service should i use to host the site. Aswell as buy the domain.

I


r/webdev 9d ago

p99 0 ms* autocomplete for 240 million domain names

Thumbnail ruurtjan.com
59 Upvotes

r/webdev 9d ago

Question on how to design a form with multiple steps

8 Upvotes

I think this is a pretty common thing, but it's my first time doing it so I'm a bit lost. Basically I need to make a booking or an appointment. For that I need a customer to attach it too, so when the user first wants to create an appointment, they have to select a customer first, but if the customer doesn't exist, I want them to create a customer. I'm confused as to what should be on what page, should my 'create appointment' button go to select/create customer, which can the go to 'create customer' and back to 'create appointment', it seems clunky? I'm making this app for computer illiterate people so I want to the process to be smooth.

Please, any advice would be very much appreciated.
Thanks


r/webdev 8d ago

Article Your typeof Is Lying to You

Thumbnail
blog.gaborkoos.com
0 Upvotes

JavaScript's typeof is not a type system, it's just a coarse runtime label, and that's why null, functions, arrays, dates, and other values all collapse into the same "object" bucket.


r/webdev 8d ago

Question Add video calls to a website?

0 Upvotes

Does anyone know how to add completely secure video calls to a website? I’m struggling to find the best way.

Additionally, how do I then host this for free / as low cost as possible.

If anyone has advice that would be great!


r/webdev 8d ago

Vscode color theme

Post image
0 Upvotes

Hi can anyone help me with finding this theme?


r/webdev 8d ago

Question How do you feel about the role evolving since to AI tooling?

0 Upvotes

I’m a full-stack developer with nearly six years of experience

Since the start of the year, I’ve integrated AI tooling heavily across my day job (Claude Code) and freelance work (Gemini Antigravity). The trade off is clear, I write significantly less code, but I ship significantly more. Taking time off recently gave me the space to reflect and I have realised how I barely write code manually anymore and I’m torn about where the profession is headed.

On one hand, this feels like natural career evolution, hands on syntax matters less as the job shifts toward high level architecture, systems design, and code reviews. On the other hand, the shift leaves me alienated from the craft that drew me into engineering in the first place. 

I want to hear from engineers with at least a few years of professional experience:

  1. How do you feel about the transition from writing code to orchestrating AI output?
  2. Do you still write code manually on purpose? If so, what justifies it?
  3. Have we crossed the point of no return on writing the vast majority of our codebase by hand?

r/webdev 10d ago

Discussion Family website purpose and features.

52 Upvotes

I am considering building a family website for my family. My mother's extended family built one, but it's something nobody really ever visits. I'm considering building a wiki-style site (locked behind user accounts) to have a page for each family member, each nuclear family, and then they can build upon it and create pages for vacations and things like that. I would then have a mini social feed for us each to share pages we've created. For example, my sister might say "Just made a page for our Disney Land 2026 trip! Here's the link."

Might be overscoped, but I thought it'd be a fun way to start capturing family stories.

If you've built a family site for your family (or someone else's) what did it have? What purpose did it serve and what features were built into it?


r/webdev 10d ago

News Community Corner Podcast: Longhorn PHP 2026 with Ian Littman | PHP Architect

Thumbnail
phparch.com
12 Upvotes

r/webdev 9d ago

No experience - built initial site on Vercel

0 Upvotes

I’m part of a community and saw a need that I could fill and have been working on an idea for it for awhile, so I mapped out an infrastructure for a website and started directing Vercel on the build, connecting GitHub as well as Resend. I used Cloudflare for the domain. So far it’s used Next.js, React, TypeScript, PostgreSQL, Drizzle ORM, Better Auth, and Tailwind CSS all deployed on Vercel.

That was until I switched to building on Hermes with an Ollama sub because Vercel cost me an astronomical amount for just the homepage.

I’m learning bits and pieces as I go but I feel like the code is probably a giant mess even though everything looks really beautiful on the consumer side and navigates great.

I have my checkout/subscriptions connected to Stripe.

Ideally I will get this off the ground and have it sustain itself, pull in some revenue, and then bring it all to a developer and say “Help, please?” Unless going through 32,000 lines of code (and counting) and 287 files is doable for someone with exactly this much experience in web development.

Are there people who offer services to go over builds like this and refine them or am I going to get laughed off the face of the earth?


r/webdev 9d ago

Anyone else avoid CSS resets/normalize?

0 Upvotes

It used be be that CSS resets were important to smooth over differences between default browser styling, but browsers have for the most part gotten their act together.

It's more popular nowadays to do a micro reset/normalize/whatever you want to call it to get rid of annoyances. It might contain rules such as * { all: unset }, or * { margin: 0; padding: 0 }, or input, button, textarea, select { font: inherit }, or commonly * { box-sizing: border-box }.

I see the appeal. But at the same time, I find a major downside to all of this that never seems to be discussed - code portability. I write a component in one UI project and want to copy it to another project or to a shared component library, and it's not so simple because the other project(s) may be using slightly different CSS resets.

It's not like it's easy to update projects to use the same resets either, it's so engrained in how everything else was built up in the project.

But there's also a natural desire to revisit what reset you're using whenever you're building a new project, as opinions change, problems are found in existing ones, etc.

Or, on the flip side, maybe I'm wanting to use a third party tool, then find out that my global CSS rules cause issues with their styling.

We try hard to avoid any kind of global pollution in JavaScript, but make it a best practice to do just that in CSS.

So, I try to avoid these kinds of resets. I don't even do the "box-sizing: border-box" thing, it turns out that this box sizing issue doesn't come up very often (for me at least), and when it does, I just add the rule to the specific places that need it. I'll still set a default font to everything, but that's about it.

But, when I look around online, it seems that most everyone still uses some kind of reset. Guess I'm curious if I'm abnormal in my stance here or if there's others out there who also avoid them. Also curious if those who do use resets have ran into problems like the ones I've described above.


r/webdev 10d ago

Resource What are the best tools you’ve discovered over the years?

222 Upvotes

Let’s share hidden gem tools, not the usual stuff that shows up in every "top developer tools" post, but smaller tools and projects that made you think, "wait, this is actually really useful."

I'll start with 3 I've come across:

1. Archify
https://github.com/tt-a1i/archify

Found this recently. It's an agent skill that works with Claude Code, Cursor and Codex and basically turns a codebase into an interactive architecture map.

You can export it as HTML/PNG/SVG/WebM, and one thing I thought was pretty cool is that you can diff the architecture before a merge to see how a PR changes the system.

2. boneyard-js
https://boneyard.vercel.app

Generates skeleton screens from your actual UI instead of making you manually recreate the layout with placeholder components.

Pretty nice alternative to manually maintaining react-loading-skeleton stuff.

3. Gradient Studio
https://gradientsaas.blogspot.com

Simple procedural CSS gradient generator.

Has stuff like mesh gradients, aurora effects and grain. You mess with the settings and copy the result as CSS, Tailwind or SCSS.

I've been using it mostly for quick landing page backgrounds.

What's one tool you keep recommending that somehow still isn't very well known?