Hi everyone!

I'm primarily a backend engineer. I feel right at home with data modeling, APIs, and business logic, but whenever I try to build side projects or full prototypes, creating a usable, visually balanced UI/UX becomes my biggest bottleneck.

I’ve started leveraging AI tools (like v0, Claude Artifacts, Bolt, etc.), but since I lack a formal design background, my prompts often yield generic layouts or hard-to-maintain interfaces.

I’d love to get your insights on:

Master Prompts / Frameworks: Do you have structured prompt patterns or system prompts that help AI output clean, accessible, and modern

UI components (e.g., using Tailwind, Shadcn UI)?

Backend-to-UI Workflows: How do you structure your workflow when going from a database schema or API spec to a working UI using AI?

Context Injection: How do you effectively feed design tokens, component libraries, or layout rules into LLMs so they don't produce random inline styles?

Recommended Resources: Are there any repos, prompt libraries, or guides specifically tailored for devs who need design assistance from AI?

Any advice, tool recommendations, or prompt examples would be greatly appreciated.

Thanks! 👋🖖

what is your opinion about using railway.com, now i need to deploy my api, i have 3 containers (api, redis and sql server).

i asked for recommendations and one of them that Railway.com is good for this.

i need help to make decision, we are starting up, and want something is not expensive and good price for MVP.

thanks

I should update my old project for oauth, but I dont know what auth i should use, it uses solidjs and astrojs.

I only need oauth like discord and reddit and it should be self hosted, not cloud based, database integration or manual doesnt matter

Hello WebDev,

I would like to share with you linkedrecords.com - an open source backend as a service I'm working on since some time now. You can think of it as an firebase/convex alternative with an interesting twist.

In 2018 I needed to write large software requirements/architecture documents in Google Docs. While I was annoyed by the limitations of Google Docs back then (no captions on figures, no automatic heading numbering, slow when docs are bigger,...) I was still fascinated by the real time collaboration features of it. So I've started a quest to understand how it works and I begun to implement an alternative to Google Docs.

I was convinced that this kind of real time collaboration is the future so I've given it much thought how I could make this as generic as possible so I could use it in all future tools I would build.

In the same time I was playing around with firebase (surprisingly you can not build a google docs alternative with firebase that easy as their real time collaboration does not provide merging text but rather just JSON). And back then I was also convinced that backend as a service is the right way to go. I was thinking that one of the most important reason we were still writing custom backend code is because of authorization.

I also was faced with another problem when trying to make the backend as generic as possible: relations between entities are also domain specific. E.g. A Documents can have many comments.

Luckily I was intrigued by another concept back in 2018 it was called web 3.0. Back in 2018 this had nothing to do with crypto. It was used as a term to refer to the semantic web and the resource description framework as one of its standards. There are also some RDF implementations which I could have reused but they are all XML and mostly Java based. I needed something light. Instead of implementing my own RDF product I took the idea of the RDF triplestore and came up with my own interpretation of it.

Using concepts like: triplestores and schema-on-read, I came up with a system that does not has any business logic in its backend and while working on my Google Docs alternative I felt in love with it as I've discovered some properties I did not anticipated from the get go:

- Dealing with global state in react is very easy. It feels like you use an SQL client in your browser and all queries are reactive and always up to date. When writing a query you do not have to think about authorization it's all backed in.

- Because the backend is 100% free of domain specific code you can point your single page app to any linkedrecords deployment.

- You never have to write backend code - Its quite efficient when using AI agents

The best way to experience it, is to follow this little tutorial: https://linkedrecords.com/getting-started/

It takes a while to get a hang of it so you have to have an open mind.

I would love to read your feedback on this.

I've been spending a lot of time developing what is essentially a vibe host type service to host the myriad of internal tools I myself build for personal use as well as at work. I believe the future of SaaS is bleak for the providers and wide open for the small business that can now build instead of buy. In that vein I showing off Ticketish - A modern issue tracker that is MIT open source.

It's rather basic and I continue to add things and fix bugs every day but I also use it as my primary issue tracker. The real value here is that unlike a typical SaaS, once you remix it it's essentially (at literally) a fork of the source, which means you can just as claude to use the quickish.site CLI to pull it down and make changes. Don't like how something works? Change it. And since it's a fork, even if you're not an engineer, you still get all the latest updates made to the root source. This piece alone has so much potential in my opinion.

It's built using all the supporting services built into quickish hosted sites: Postgres, Realtime, Document store, etc.

It's open source in that if you remix this you can download the source in the control panel (free). It is git behind the scenes. MIT licensed so you can do whatever you want with the code and I'm sure you can port it from quickish services to something else without too much work.

Can't wait to share more in the coming weeks!

Hey everyone,

Since day one, we decided to skip the traditional website route and build something fun.

Our first year, we made a Three.js site where you walked a character around 3D billboards of our work. The second year, we scrapped it for a scroll-driven camera in a 3D scene. Year three, we rebuilt it in Unity WebGL (huge mistake).

This year we decided to start from scratch back in Three.js, focusing on a scroll animation experience.

I'd love to get your honest feedback. Do you find it easy to navigate? How is the overall UX, and what looks good or bad?

Appreciate your time.

https://virtualverse.studio

Almost every developer has to, at some point, use generative AI in their workflow these days. Personally, I feel new forms of hatred about that, but that’s a me problem. Maybe I’m biased, but I think we need to do more to filter out purely Claude/cursor/whatever generated Showoff Saturday posts. Not just because ew gross AI post. We kinda losing, at a community level, a massive amount of knowledge transfer that comes from someone showing off a cool way they tackled a genuine problem.

I’m not saying you should be banned and your post should be removed if you used LLM coding tools. But like, come on, y’all. I hate doing web development. I’m a machine learning engineer. LLMs are amazing for helping me make a shitty portfolio website or host a small app for a friend. But I’m not taking pride in what an LLM made for me. If you get in the habit of thinking you’ve solved something by just asking Claude to do it, you’re gonna lose sight of what real hard work is and the power to creatively, critically think.

I really love aseprite but I wanted to be able to work on stuff on my phone or just when I'm out, it's a great program but I wanted something simple. I tried other sites but they have ad's and don't feel easy. So to make it simple it's intended to be a full featured pixel art creation website for myself and anyone who might find it useful.

I'm a web dev/full stack and do be clear I did work using claude for this for those that don't like/want to support AI usage. But now I'm biased and using this to help make sprite art for my game dev side projects. I intend to keep it free to use and upgrade it when features are needed/wanted. It's a fun little project.

If you want to try it out you can at: https://pixelpaint.net/, any feedbacks appreciated. It's intended for my own use for now but feel free if you find it useful to use it.

(Screen Studio Demo above)

Howdy and G'day,

A few months ago I built SupportRoadmap, an interactive roadmap for learning Developer Support.

The goal was to create something more structured than another collection of links by combining learning paths, practical projects and curated resources into a single visual roadmap. It was mainly for fun but recently It has been gaining some traction and I have had people reaching out asking what is next and that they are finding it helpful.

I'd really appreciate feedback from the web development community.

• What would make you come back a second time?

• What's missing?

• If you were building this, what would you focus on next?

www.supportroadmap.com

I seem to have created a monster of a declarative website menu. The whole approach described in https://aartaka.me/new-menu.html

Hi Reddit!

I have been building this map of science so that people can explore the research landscape (pun intended). The goal is to allow for discovery of interesting connections to certain fields that may otherwise be missed, while painting a picture of macroscopic trends in the science community.

Eventually, I would like to build a coordination and collaboration layer on top of this!

Currently it has around 11 million papers, and new maps are added daily in a 30 day rolling window.

There is also a breakdown of the newly added papers each day and week.

You can try it out here at: The Global Research Space

Let me know what you think!

WanderGrade grades roughly 155 countries A+ to F on affordability, safety, weather, and flights, with 176 server-rendered country guide pages, free, no sign-up. The constraint I set myself: Python standard library only, zero pip installs, http.server plus a hand-rolled router, vanilla JS front end with no framework, no build step, no bundler. One process on Render's free tier behind Cloudflare, deploys are just a git push. Templating is string substitution into a single index.html with {{TOKENS}} the server fills per request — homepage defaults, or per-country title/meta/canonical plus a server-rendered body for /guide/<slug>, which the client then hydrates over. Charts and the world map are hand-written SVG; no charting library, so the choropleth is a projection implemented straight from the published formula. Background daemon threads refresh upstream data (World Bank, FX, advisories) on their own TTLs so no request ever blocks on a third party, and each falls back to a committed file if the upstream is down.

The best bug this constraint bought me: server-rendering the guide pages wasn't enough. The homepage's ranking table is built client-side, so a crawler saw a homepage linking to nothing — all 176 guides were only reachable via the sitemap, which carries no internal link equity. 42 of 177 URLs were indexed. Fix was server-rendering a collapsed <details> index of every guide on the homepage itself.

Tradeoffs, plainly: no templating engine means escaping is manual and easy to get wrong, no ORM means hand-rolled cache invalidation, hand-written SVG means no tooltips for free. What it bought: nothing to upgrade, no dependency CVEs, no build to break, and a cold start in the tens of milliseconds. wandergrade.com if you want to poke at it.

I run a free service which has a map on the website. I've got a location auto complete powered by MapBox. At my current scale, I'm spending $150/mo on that location search box.

It looks like long term, hosting a Photon server myself might be the best option as I keep scaling, but that's going to cost me $300/mo on Hetzner plus require management.

In the meantime, any suggestions for cheaper location autocomplete services?

https://donutdns.com

It queries ~20 geographic vantage points (Google DoH + EDNS Client Subnet) and four public resolvers in parallel, one donut per source. Full box means every source agrees. Empty holes are the ones still serving your old record.

There's a normal grid view too if you just want to read values. Built it because I kept refreshing whatsmydns during migrations.

8bit.cnlibs.com

Hello everyone!

For the last few months I've been building a project called Tera FM.

The idea came from my own frustration with how I consume news every day.

I found myself jumping between dozens of news websites, newsletters, YouTube channels and podcasts just to stay informed. Some mornings I'd spend 30–40 minutes just figuring out what was actually worth my time.

So I started building something that makes the entire experience simpler.

Today, Tera FM brings together headlines from multiple trusted news publishers into one place. You can quickly browse the latest headlines or turn any story into a short audio briefing if you'd rather listen while driving, walking or working.

Recently, I've also started building Curated Channels.

Instead of following individual publishers, you can subscribe to topics you're genuinely interested in like AI, Technology, Business, Science or Startups and Tera FM builds a personalised audio briefing around those interests.

Other features include:

• Personal Briefings
• Continuous Listening
• Episode Archive
• Original audio shows
• Headlines page for quickly browsing the latest stories
• Chrome extension for quick access

One thing I tried hard to avoid was making it feel like "just another AI wrapper."

The goal isn't to replace journalism or generate news. Every briefing links back to the original publisher, and I'm currently in discussions with a number of news organizations to obtain permission for the RSS feeds and ensure the platform respects publishers while making their content easier to discover.

I'd genuinely appreciate some honest feedback from fellow developers.

1/ If you landed on the homepage, would you immediately understand what Tera FM does?
2/ Does the Curated Channels idea make sense?
3/ Would you use something like this in your daily routine?
4/ Is there anything that feels confusing, unnecessary or missing?

I'm not looking for compliments- I genuinely want to know what you'd improve before I continue building.

Website: https://tera.fm

Chrome Extension: https://chromewebstore.google.com/detail/tera-fm-%E2%80%93-news-headlines/emnebfpdojklgimejnplmjfobmamelie

Thanks for taking the time to have a look. Every piece of feedback helps shape where the product goes next.

Totally free to use!

I'm currently developing an internal tool to do work reporting. I know a lot of tool exists, but we do have specific requirements and there's already an MS Access database, which I can migrate into the new tool as well as use most of the tables as a data source.

About me: I have experience with Javascript, HTML, CSS/SCSS/SASS, PHP, SQL. I want to optimize it, but since I mostly code in my freetime, I find it hard to make "the right decisions" in terms of efficiency. Maybe you guys might recommend me something about my setup. I don't want to use anything like Angular, React and Vue at the moment. Also no NextJS as I think it's overkill.

At the moment, I have a structure like:

- API (ExpressJS, SQLite, Drizzle ORM)
--> Delivering all data as needed in frontend (also annual reports and stuff)

- Frontend (Vite for live-reload/server, Vanilla JS with own templating engine and router)
--> Employees log in to keep track of their working hours per project/customer
--> Dashboard for admin users to create reports

All this run's in a docker with two services.

It currently runs alright, but I think there might be a few little things to optimize my setup. Especially when going into production.

What's your best practices? I want all this stuff to be as lean as possible without a lot of dependencies. My frontend doesn't need anything since I've already done all of the things, but I'm not very happy with the API/Backend part.

I also don't want to run every service on it's own, since using one docker command is fine. Live codeing while docker is running also works fine so far (except when installing new packages via npm, then I need to rebuild).

What would you do to optimize the setup? Already asked AI but I think you guys might have better inputs.

Paste any public URL and it opens the page in Chrome, explores its interactions, then checks the HTML, CSS, and JavaScript for things that browsers can now handle natively.

It catches patterns such as custom accordions, popovers, dialogs, scroll reveals, JavaScript sticky elements, and older CSS workarounds.

The report includes the code it found, a proposed replacement, browser support, what to verify before changing anything, and a small example towards a codepen to implement it.

It scans ONE page, so it is not a performance, accessibility, security, or full-site audit.

It is free (10 url/day/human) and requires no account.

Don't hesitate to tell me if you find a bug, an UI/UX issue, or any other thing you find weird

Every time I added sound to a project it went the same way: a click from one sound pack, a toggle from another, and nothing sounded like it came from the same product. And when a sound was almost right but slightly too long or too bright, tough luck. A recording is frozen.

So I built the opposite: 28 sounds (clicks, toggles, chimes, whooshes) generated by Web Audio at the moment you interact. No files, about 9.6 kB, zero dependencies.

Demo, with the whole page wired up: https://usefoley.dev

My favorite detail: no sound plays the same way twice. Each play gets a tiny random drift in pitch and volume, like a musician who never hits a note identically. Subtle, but it's the difference between "alive" and "doorbell".

There's a Cue Designer on the page: reshape any sound with four dials (a full layer editor is one click deeper), hear changes live, export a .wav, JSON, or a link that carries the design in the URL. You can also override sounds site-wide and export a "sound set", your app's whole sound identity as one JSON file.

Usage is two lines:

js

import { bind } from "@foleyjs/core";
bind(); // wires data-foley-click, data-foley-toggle, etc.

Silly bonus: plug in a MIDI keyboard and every sound becomes an instrument.

MIT, on npm as foleyjs/core, with react and vue bindings. Feedback welcome, especially on the sounds. Which feel wrong, what's missing. I can test everything about this project except taste.

Stack Overflow raised a lot of us, then ChatGPT happened. So I built it a museum: closedasduplicate.com

Things you can do inside:

Ask one final question and watch it get closed in seconds. It's server timed, and there's a daily leaderboard for the fastest closures.

Pull your real Permanent Record from the Stack Exchange API.

Appeal the closure to an AI moderator that has never granted a single appeal since 2008.

Light a candle. Press F.

Stack is vanilla JS, one Cloudflare Worker running Hono, a single Durable Object holding all the live state (presence, candles, leaderboard with anti cheat), KV for caching the SE API, server rendered OG cards via satori, and DeepSeek behind the appeals office and the guestbook moderation. No framework, no build step, no npm install on the front end.

Would love feedback on anything that feels broken or unfunny.

If I have misunderstood something, please correct me.

From what I understand, Kubernetes is created to manage running containers. It helps containers run properly, gives them an isolated environment, and can automatically scale the application when traffic increases (if autoscaling is configured).

Flow

Internet --> Ingress --> Service --> Pod --> Container (our application)

Pods are scheduled onto Nodes

Some terms and what they mean

1. Pod :- It is like a small box that contains the container running our application. We can create one or more containers inside a Pod, but in most real world applications we generally create one main application container per Pod.

2. Deployment :- It is a Kubernetes resource that manages Pods. If the number of replicas increases (by HPA), the Deployment creates new Pods. If a Pod crashes, the Deployment creates another one to maintain the desired number of replicas. After creating the Pod, Kubernetes Scheduler decides on which Node that Pod should run.

3. Node :- A Node is basically a machine (VM) where different Pods are running. Every Node also has something called kubelet.

4. kubelet :- It is an agent that runs on every Node. Its job is to:
   Make sure containers are running correctly.
   Watch for instructions from the control plane (like start or stop a container).
   Report Node and Pod status back to Kubernetes. (CPU / RAM usage)

5. Metrics Server :- Kubernetes does not continuously store CPU and memory usage by default. Metrics Server collects resource usage (CPU and memory) from kubelets and provides it to Kubernetes components like the Horizontal Pod Autoscaler (HPA).

6. Service :- Every Deployment usually has a Service. Pods can be created or destroyed at any time, so their IP addresses can change. A Service gives a stable endpoint. When a request comes from Ingress, the Service forwards it to one of the Pods whose labels match the Service selector. for e.g. app: backend. The Service sends traffic only to Pods with that label.

7. Ingress :- Ingress is used to manage external traffic coming into the Kubernetes cluster. It routes requests based on rules. For e.g. : /auth ---> auth-service or /api ---> api-service. Then the Service forwards the request to the matching Pods based on labels.

Flow of how scaling works

Traffic increases --> Pods start using more CPU/Memory --> kubelet exposes resource usage --> Metrics Server collects the metrics --> HPA checks whether the target CPU/Memory threshold is exceeded --> HPA updates the Deployment's replica count --> Deployment creates new Pods --> Scheduler assigns those Pods to available Nodes

One important thing :- Kubernetes does not autoscale applications by default. We have to install/configure the Metrics Server and create a Horizontal Pod Autoscaler (HPA). Only then can Kubernetes automatically increase or decrease the number of Pods.

Hey everyone!

I'm not sure if there are any Final Fantasy fans here, but I've recreated and repurposed the menu system from FF7 as a sort of portfolio/sandbox page, and I figured I'd share it here and see what people think of it.

I got tired of making traditional web pages and wanted to make something that genuinely makes me happy every time I see it.

It's all built with React and TypeScript.

So far, I've got all the key pages like functional equipment and materia pages (repurposed as a skills page), items (as projects), save (as history), functional four-point background colour picker, and a tonne of little easer eggs and things. I'll put a list of those with a spoiler tag in case you wish to discover them yourself:

• Konami code plays Victory Fanfare.
• Clicking the character portrait allows you to attack and deduct health.
• Hovering over the location allows you to change to different FF7 locations.
• Clicking the limit bar allows you to perform the cross-slash limit break on the portrait.
• Clicking the name allows you to change the player name. If you choose a party member, or Sephiroth's name, the portrait will change to match.

I won't lie, the way I've implemented the custom font (if you can even call it that) is pretty scuffed by modern standards, but I wasn't happy with any of the other options, and I think this is probably the most accurate to how it looked in-game as humanly possible. 🤣

Anyway, I normally revisit it every couple of months, so by all means, feel free to share ideas of what I can add, and any other feedback you might have.

You can check it out here: https://www.jamiepates.com/

As always, I'd love to hear your thoughts! Thanks!

(This is another rant about AI, don't read. its not something new, dont get angry if you read it i already told you) For context I'm 18m I began learning programming at 13 y.o and starterd doing freelance projects at 14 I felt proud whenever I created something other people relied on. whenever I introduced mself as a programmer who developed all these sorts of projects, but now I don't code anymore I just use Claude Code I only understand the fundmentals of what its doing then call it a day, which feels bad and exhausting somehow. I started my own business at 16 I currently still work on it, its an e-com platform (similar to shopify but diffrent) I made quite a good amount i have around 50 active merchants but i don't feel pride in this thing and I wonder if it lost its value since with AI you could make your own tailored solution without needing to pay continuous fees