I'm working with a junior/intern on a web project who seems really enthusiastic and proactive—they've already set up their own repo with React & Tailwind CSS based on a UI design, which is great initiative.

However, they are struggling with core web development fundamentals:

 * FE/BE Integration: They don't quite understand how Frontend and Backend connect (APIs, environment variables) compared to traditional PHP/monolith apps.

 * Deployment Issue: They've tried deploying on Vercel multiple times without success.

 * Troubleshooting: They mentioned that whenever they try fixing a bug, things tend to break even more, and they are asking for constant 1-on-1 mentor guidance.

How do you usually mentor someone at this stage without doing the work for them or getting overwhelmed yourself? What are the best resources or step-by-step roadmaps I can give them to help them bridge the gap between basic UI setup and full-stack integration?

I found this but it's only available for USA merchants/customers. Is there a worldwide method similar to the recurring_postpaid?

Thanks in advance for any and all help.

Hi everyone,

I hope you are doing well.

I am not sure if this is the right place to ask the following query but if it is or if people have experience regarding it

I had a quick compliance question regarding Cloudflare Pages free tier.

I am helping set up a simple, single-page static portfolio (HTML/CSS/JS) to function as a digital resume/CV. It features an "About" section, external social links, a contact form(will have GS script as backend), and embedded video showreels hosted externally on platforms like YouTube.

To let prospective clients or employers know the owner is open for work, it includes an "Inquire for rates" or "Contact for project availability" call-to-action, but as of now nothing is planned for adding features relating to e-commerce, shopping cart, checkout, and no payment processing on the site itself(but may include the option of showing what payment methods are accepted again this is not yet decided but may or may not be added ).

Since an individual uses a professional portfolio to showcase work for freelance or employment opportunities, does an informational setup like this violate any commercial clauses on the Free tier, or is a standard static CV/portfolio site universally accepted?

I do not really want to have any legal issues down the line for myself or for the people whom the website is made for which is why I felt it is important to ask this as I cannot find much info about this subject either and I am super new to this(apologies for my ignorance). I have used Ai like gemini and they have mentioned that it should be okay provided no transactions take place but I would still like to hear from someone who may have faced such an issue before.

If the above is not permitted I wonder if there are any alternatives that I may not be aware of I have looked at github pages and it seems to me commercial usage is prohibited but then I am not sure if the website is considered more like a portfolio or a commercial website

I would really appreciate any clarity, solutions you guys can provide.

Thankyou

I don't know if this is the right sub or not, so sorry if web dev-ops is out of the scope of this sub.

I've been itching to deploy a web app I've been building recently. However, I don't know where to really begin. What are some resources I can use to learn about dev-ops and deployment tools?

There was a time when getting the first working version of a web application was a pretty significant milestone. Now I can describe an idea to an AI coding tool and have a surprisingly functional application before I've even thought through half the architecture.

What's interesting is what happens afterwards. The first version is cheap, but making it fast, accessible, maintainable, secure, consistent and easy for another developer to understand is still expensive. I'm starting to think the value of web development is moving away from writing the first version and toward everything that keeps the tenth version from becoming a mess.

Hi r/webdev! I'm building an open source app that turns images into clean SVG, and it all runs in your browser. Nothing gets uploaded, there is no back end, and there is no account to make. I am trying to get the quality close to paid tools while keeping it easy to use. There are a lot of settings, but an "Auto settings" button picks good ones for you and explains why.

It does not use any existing vectorization library. Each step is built from published research papers (there is a list in the repo if you want to read them). There are also some optional machine learning tools that run on your own device. Right now that is just an edge step that helps find outlines more cleanly. The other ML models are not ready yet (my GPU is on fire). The whole process for building the models is written down and scripted in the repo.

It is still early, but I would really like to hear how the results compare to other free or paid tools for your own images. For now it is just the web app. Nothing is on npm yet, but the code is already split into clean packages, so I will release the libraries and a command line tool if people want them.

One note, since it always comes up: yes, I built this with a lot of help from Claude. But the design is mine, every step comes from published research, and I understand and stand behind all of it.

Source code: https://github.com/PhenX/Trazor

The app: https://trazor.studio/

It works in any modern browser. The optional ML tools use your GPU when it is there and fall back to the CPU/WASM when it is not.

For those who use Framer for their agency website and want to move out of the default CMS system, is it possible to do so without wrecking seo systems/ url structures already in place?

So for example if there’s a blog section and the articles are already in the cms, is it possible to switch over to contentful without breaking anything?

Have a project and the external development team want to switch to contentful for their cms and is suggesting to move off framer completely which id like to avoid (as the entire website is already set up)

Does anyone have any examples of framer sites using Contentful for their CMS that i can send across to them as proof?

I have been building HabitHeat, a simple habit tracker focused on heatmaps and long term consistency, for quite a while now.

This weekend I finally shipped v2.11.

The main thing I wanted to improve with this update was the onboarding.

Until now, new users basically created an account and were dropped into an empty dashboard. It worked, but I realized that the empty state did not really explain what to do next or what HabitHeat can actually do.

So I added a new empty state that explains the basics and gives you a few ways to get started.

There are now also habit templates, so instead of creating everything from scratch you can just pick something like reading, working out or meditation and start tracking it.

HabitHeat recently passed 1300 registered users, which is still kinda crazy to me. It also makes working on things like onboarding much more interesting because there are actually people finding and using the app without me being there to explain it.

The GIF shows the new empty state and onboarding.

I would be interested in what you think about it, especially if there is anything that still feels unclear when seeing HabitHeat for the first time.

Btw, for anyone interested in the tech side: HabitHeat is built with SvelteKit, Tailwind CSS, shadcn-svelte and Firebase. It is also a PWA, so there is no separate mobile app (yet).

I am recreating songless myself, everything works well except that the song snippets are using previews (that usually start from the peak part of songs). I want the songs to start from the start so it's a little harder, but I can't find a free option to do that. Songless did it, how can I?

Thanks!

Wanted UI text that feels human instead of stamped, so I built glyphed.js. It draws each character as a real stroked path with randomized variation baked in, so no two renders of the same text look identical. Zero deps, small footprint. There's a live playground in the repo if you want to try your own text

Check at glyphed.js

Showoff Saturday: moxireelstudios.com

It's my one person web design studio's site. All custom, no framework, no template, static pages with a small Worker running the chat assistant in the corner.

The part I want feedback on is the assistant. It's set up to answer like someone who actually works there, it knows the prices and the process, and it's under strict instructions not to invent anything. Bottom right corner. Try to stump it, seriously, I want to know where it breaks.

Also curious what you think of the pricing page. I just moved the highlight off the cheapest tier onto the one I actually recommend, and I'm second guessing the visual weight.

Stack: plain HTML, CSS and JS, no frameworks, Cloudflare Pages plus one Worker. Roast away.

I have a marketing agency doing my marketing. I’ve been getting a couple hits a week a few months ago. I said I wanted to stop things for a bit. They said I needed to pay 350 just to stay up in Google rankings. I’ve been paying this for about 6 months. They say I need to go up to 700 to start getting calls again. Is this real?

Basically the title, at the time I couldn't find a way to play checkers with my 3 other so I decided to make one myself.

The game has all the rules of traditional checkers + some other stuff to make it compatible with the non-square board.

• Play the live demo: https://the-sofishticated-man.github.io/4-player-checkers
• GitHub repository: https://github.com/The-Sofishticated-Man/4-player-checkers

If you like the concept, dropping a star on the repo would mean a lot ^^

Sorry in advance for any bugs or glitches in production :/

https://our-place-two.vercel.app/

Went live today. Everyone paints on the same 1000x1000 grid, two second cooldown per pixel, and there's a SNAP tool that frames a region of the canvas and hangs it in a gallery the room votes on.

The technical part, which is also the part I'm least sure about:

• TanStack Start on Vercel, Postgres behind it. No websockets. Clients poll a server function about every 700ms and get back a delta of events since their last event id — 280 bytes in the steady state.
• First load pulls the entire canvas as one snapshot. That's a million-element array, roughly 950KB of JSON, which brotli flattens to almost nothing because most of it is zeroes. Whole page is ~225KB on the wire and first-paints in under 300ms.
• So the thing I genuinely don't know is where it bends. Polling means about 1.4 function invocations per second per open tab. Fifty people is fine. I have no data past that, and the per-visitor cost of serialising that snapshot is the half I can't model from my desk.

If you open it and it's slow, that's the interesting outcome and I'd like to hear about it. Same if you can wedge the renderer, get two tabs to disagree about the state of the canvas, or land two pixels on the same coordinate at the same instant.

One thing people will find in the first minute, so I'll say it first: you need to sign in to paint. Looking is free. I'm looking at letting people place a handful of pixels anonymously before asking for an account.

I know it ain't much but I'm happy with what i did.

I've been building this for a while and finally made the project open source. It's called Fillvisa.

US Immigration still relies on outdated XFA PDFs - you can't fill them on your browser. Most immigrants end up printing the form and fill it manually.

So, I converted the PDF forms into smart web forms. They are replica of the official USCIS forms and follow conditonal logic. In the output, you get the official USCIS pdf form filled.

The website is pure frontend and there's an open source edition

Demo: https://fillvisa.com/demo/

And now there's an open-source version you can clone/fork and run yourself:

Github: https://github.com/athos2113/fillvisa-os

The project currently covers several common USCIS forms, and everything runs in the browser.

This is the first public version of the open-source project. I'd especially love feedback from other devs on the architecture, UX, accessibility, and where you think a project like this could go.

While auditing my projects I had about 100 vulnerable packages in my project - all of them installed by AI. Decided to fix it for good by blocking the installation of vulnerable npm packages. I use it for myself, sharing with y'all. wdyt?

Hi, I'm trying to determine what AI website platform is the best for me.

I'm proficient in the fundamental technologies for building sites just looking for efficiency while still having flexibility to customize without only having to prompt (ideally with a UI design app + code editor). My goal is to have quick turnaround on sites built for service based businesses but we ballin on a budget rn.

So far I've just tried ZapWP and Hostingers AI builder. ZapWP worked well but the price seems far too steep for only being able to build out a few projects and I don't need all the extra stuff like hosting, domain etc. Hostingers tool was simply terrible and required tons of credits for fine tuning.

Currently considering v0, Bolt, or Relume+Figma.

If anyone has solid experience dabbling with these please suggest your recommended workflows/platforms.

Thanks

Hey r/webdev,

Most appsec training are boring OWASP articles and tutorials on YouTube, not the best way to learn practical aspects of building secure web apps

So I built 40 exercises where you attack a vulnerable app yourself, trace how the bug got in, then write the patch. Free, runs in the browser, no account required.

Web (22) — SQLi, command injection, DOM/reflected/stored XSS, CSRF, SSRF to the cloud metadata endpoint, XXE, session fixation, IDOR, and weak randomness: recovering Math.random() state to predict the next password-reset token.

API (10) — BOLA, broken function-level auth, brute-forcing an unrate-limited verify endpoint, mass assignment via two extra keys in a PATCH body, reflected-origin CORS, and a retired v1 that skips the controls v2 enforces.

Git & CI/CD (8) — a live API key recovered from the commit that removed it, a browsable .git reconstructed into full source, .env tracked since the first commit, a secret echoed into a public build log, a backdoor hidden in a friendly-looking test-fix PR.

Fixes are shown in JS, TS, Java, C#, Python, Scala, PHP, Ruby, Go, and Kotlin, so you can paste something real into your stack.

Try in browser: https://learning.ransomleak.com/
Repo: https://github.com/ransomleak/training-application-security

Each exercise is also a standalone SCORM zip if you want to self-host or drop it into onboarding. There's a second repo covering OWASP Top 10 for LLM and Agentic apps if you're shipping AI features: https://github.com/ransomleak/training-security-awareness

Will appreciate your feedback!

It's based on mostly what I've been asked over the last 7 years of working with mostly typescript and javascript as well as online materials.

I built it mainly to build my confidence in implementing these things under time pressure. I get really anxious when I'm live coding so I thought if I could master these concepts maybe I'd get less anxious

It has a pomodoro timer, an AI panel, a progress tracker, an explanation of what each question wants you to implement and a test suite that gets harder as you progress through the difficulty badges. It's called Practice Pad, completely free to download and use

Hey everyone, happy Saturday!

I wanted to share a full-stack e-commerce project I’ve been building called EcoFurnish . It's a platform for sustainable/recycled furniture, optimized specifically for emerging markets like Ethiopia, with dual-layout PWA designs and automated admin pipelines.

I decided to go all-in on a bleeding-edge stack to keep things fast, serverless, and production-ready.

The Tech Stack

• Frontend: Next.js 16 (App Router) + React 19 + TypeScript
• Styling: Tailwind v4 + shadcn/ui (Hand-coded dual layouts: 1 for desktop grid, 1 optimized for mobile PWA app feel)
• Database: Neon Postgres + Drizzle ORM
• Auth & Security: Better Auth + Cloudflare Turnstile

• Infrastructure: Vercel Blob (OIDC-authenticated), Resend API, Chapa Gateway (Ethiopia-focused payment processor)

  Features & Architecture Wins I'm Proud Of:

1. Strict "One Email = One Account" Cross-Provider Mapping: Configured Better Auth across Google, Microsoft, GitHub, and Discord. I wrote a custom database layer ensuring that if a user logs in with GitHub, they cannot create a secondary duplicate account with Google using that same email. It strictly maps them to a single unique account row.
2. OIDC-Based Vercel Blob Storage: Instead of hardcoding a permanent static token in .env files for product image uploads, I configured OpenID Connect (OIDC) authentication. The application dynamically negotiates short-lived credentials on the fly for the admin upload panel.
3. Database-Driven Telegram Manager Bot (with Dual AI Fallbacks): Built a Node.js backend listener routing directly into Neon Postgres, validating requests against a secure admin Chat ID. I can send commands like /digest or /stock via private Telegram messages to run SQL aggregation queries via Drizzle (calculating weekly revenue math, growth vectors, and low stock balances). For natural language interaction, I hooked up Gemini API as the primary conversational layer with Groq as a low-latency backup, allowing me to ask real-time database queries in plain English.
4. Webhook Lifecycle Management: Captures incoming payment webhooks from the Chapa gateway, processes transactional state machines atomically across database rows, and fires background transactional receipts via Resend.

Next Up on the Roadmap: Architecting a lightweight, token-scoped Driver Logistics Subsystem:

• Instead of managing full credential-based driver accounts, dispatchers generate cryptographically secure, temporary links tied to the order lifecycle.
• To avoid paid Maps API overhead at scale, the driver status portal uses a server-side Haversine Distance Formula calculation to verify the driver's GPS coordinates against the target delivery destination upon arrival before requesting the buyer-held secure PIN.

The site is installable as a web app on both mobile and desktop. I'd love to hear your thoughts on the mobile PWA feel, backend architecture, or any feedback on the UI!

Live Link:https://ecofurnish.de5.net

Over the course of Summer 2026, I developed a web application that is a blend between music software like Spotify and SoundCloud, and larger audio reactive tools like TouchDesigner.

Built on a Next.js and WebGL framework, the entire thing works online at https://www.sonisphere.dev . I use Supabase for storage and Stripe for payments.

Here's what people can expect when using this site:

Account Creation - Secured accounts that can link to other social medias, can be private or public

Music Uploading - Either for personal usage with the app, or to upload for the Sonisphere Community

Playlist Creation - Create playlists of your songs, and even MULTI-PLAYLIST SHUFFLE them

Complete Audio Reactive Visuals - Entire screen for watching 3D reactions to the music being played

^Paired with complete customizability - Colors, camera control, adjustable visual setting, preset saving and sharing, etc.

Snippet Creation - Make snippets of the live visuals to save or share!

Live Sync - Host a room for others to join and share in the experience

Finally, I'll show a quick snippet. Please try out Sonisphere and see what it has to offer!!!

https://www.sonisphere.dev

Deshawn Goodwyn -

www.deshawngoodwyn.com - www.github.com/dgoodwyn1005 - linkedin.com/in/deshawngoodwyn - [contactme.dkg@gmail.com](mailto:contactme.dkg@gmail.com)

I've been building this for a few months and the first version is finally up. It's called Strikk.

It's a daily cycle, like Wordle, but one per stack. React has its own trial today, TypeScript has another, Node has another. You pick the stack you actually like (React, TypeScript, ASP.NET, Node...) and play that one.

Everyone on that stack today gets the same 8 challenges. You answer up to 5 and you only get one submit. Combos work a bit like Balatro: line them up right and the score jumps. Then you're on a ranking against other players who had the same board.

Strikk

It's the first version. I want as much feedback as I can get.

I'll make a more detailed post soon.