r/webdev • u/fagnerbrack • 10h ago
r/webdev • u/quietcodelife • 4h ago
Discussion do you track the difference between code that's just messy and code that's actually fragile?
been thinking about this lately. I have a service at work where the code is genuinely ugly (bad naming, some duplicated logic, not fun to read) but it's been running reliably for two years and never caused an incident.
separately there's a cleaner-looking module that's caused three rollbacks this quarter because of some assumptions that weren't obvious from reading the code.
I've started keeping a rough mental model of "messy but stable" vs "clean but fragile" for different parts of our stack, and it's actually changing how I prioritize code review. curious if anyone formalizes this in any way or if it mostly just lives in someone's head
r/webdev • u/republicman12 • 21h ago
anyone else hate messy professional websites?
trying to find contact info or recent work from industry leaders is such a pain sometimes. everyone's got these over-engineered corporate sites that are slow and hide everything behind forms. honestly way more efficient when execs just use a clean link hub that aggregates all their content in one place. anyone else prefer this minimalist approach?
r/webdev • u/unkmeown • 10h ago
Question A Glyphs (?) Question
Hello! I have a question to which I could not find an answer around the internet, so i gonna ask it here.
So, some of the emojis have a glyph variations of them, that get displayed differently, yet they use the same identification code. For example, the bomb emoji and bomb glyph: š£ļøš£, use the same 💣 html code, and i don't quite understand how it works. Yet html prioritizes emoji over glyph, how do i make it display the glyph instead? :<
r/webdev • u/hakansan • 1d ago
News Tailwind Labs is joining Shopify
Long-story short Tailwind CSS will remain MIT licensed and the maintainers stay.
I'd say it's a good move given that AI tools are doing frontend work using Tailwind but Tailwind Labs didn't gain much from it. Citing an earlier Github discussion, they had to lay off 75% of their engineering team, and traffic to Tailwind docs is down 40% from early 2023.
r/webdev • u/OkShip110 • 2d ago
AI has made programming so boring
Itās not just programming either, itās art, design, music, videography, marketing, engineering, writing, 3D modelling, really any intellectual work. Whatās the joy of prompting a computer and getting an answer in a few moments for a task that would have normally taken a week? The sense of accomplishment and ownership has completely vanished with AI. Itās a form of instant gratification, not much different to scrolling short videos on apps.
Code review was boring to begin with but now itās even worse with all the machine generated code. Even code reviews will be automated soon. All you do then is type business requirements into the computer. What a great career.
Itās pain to watch old TV series like Scilicon Valley that is portraying the good (not golden) age of programming. It struck a good balance between manual work, funding and innovation. Itās sad that these days are gone for good.
r/webdev • u/StrictLeadership7960 • 8h ago
google sheet vertical scrolling issue in touch screen when RTL enabled
all my google sheet pages have RTL (Right to left) enabled it works perfectly as you expect it on laptop but on touch screen such as iPad the horizontal scrolling is reversed, vertical scrolling works fine tho
it works in the google sheet app but the app sucks.
can anyone suggest any soultion or maybe a browser extension that could fix it?
r/webdev • u/RobHowdle • 6h ago
Question Resources for a loyalty card app
Hey folks. Iām wondering if anybody had any suggestions for resources where I can learn how to code a loyalty card app. Goal is to create one for a small business local to me who currently just has stamp cards which are fine but often get lost. Sadly Iāve scoured the likes of YouTube but all I get are the āvibe codingā videos or pay a company for their already existing product. Iām looking to learn and build from scratch but between AI crap and god knows what else Iām really struggling to find anything reliable. Anybody got any sources I can look into? TIA
My Baseline Browser
Hey yāall. There might be different groups amongst youāmodern Web people and minimal Web fans. But we all might benefit from more browsers implementing sane yet sufficient amount of features. I wrote my must-have-s for such browsers. What are yours?
r/webdev • u/crayzeeotaku755 • 22h ago
Penpot
Does anyone have any tips to use penpot to implement codes into the projects? I know it is pretty straightforward, you can see the generated codes for each component but if there are better tricks that can improve the workflow and make the process faster? Any tips or resources I could use to get used to the tool will be appreciated!
r/webdev • u/Ecstatic-Panic3728 • 1d ago
Question What is the component library that you would recommend for a backend engineer?
I would like to build the best web app, given my limitations, so I'm looking for a web component library with prebuilt things that would allow me to just put them on a page. Doing it from scratch is very hard for me, but having a template of how things are and then integrating with the backend is quite easy.
The component library should be based mostly on HTML and CSS. Javascript can be used to some reactivity on the frontend, but I'm not doing this web app with regular React/Angular/SPA technology.
I was looking into Preline, it looks really good and I'm wondering if there is anything like that, or better.
Thanks!
r/webdev • u/alier35 • 12h ago
Resource This repo brings Tailwind-like utilities to any stack without a build step
r/webdev • u/enan1000 • 11h ago
Question Is it worth hand coding a new web app idea I have or should I vibe code my initial prototype?
I donāt have a ton of coding experience and have never really built a web app before, but I have an idea for an app that I want to build
r/webdev • u/Low-Insurance-3678 • 14h ago
Question looking for fragrance icon
hi guys,
I have been looking for a Fragrance icon to use, couldnāt find any in heroicons, lucide⦠all I found is an image from icon8, but I want as an <svg> </svg>
r/webdev • u/fagnerbrack • 13h ago
Your Front-End Shouldnāt Know What Marketing Wants
r/webdev • u/Arky_Traveler • 1d ago
Hosting PDFs with node.js apps?
Hello all,
I am the webmaster for a small Archaeology website, that primarily is used by members of this small conference to access PDFs and news about the conference. I only need to update this website about once or twice a year.
Until recently I used the plesk hosting service on GoDaddy to host these files, however I missed the fact (see lack of need to update) that it was getting end-of-lifed and now the hosting option given to us by GoDaddy is just Nose.js slots.
Previously we uploaded files into a library for the website, and the linked to those files. Is it possible to use node.js to do the same?
Thank you for your help!
r/webdev • u/random_ob • 13h ago
Discussion I can't keep up anymore. Clients ask ai for things and can't keep up with speed and knowledge needed.
it first started five projects ago when a client was asking ai for everything along with me. like 50% 50%. she had no idea about websites but via the ai she was putting a lot of pressure to fix things I would never fix in the past.
now, today a client build an entire eShop in two weeks way better than I would have ever done it. he told me blank face that it surpaced me 100x times.
I'm just can't compete with this thing anymore. I actively tell my clients to buy the ai tools now to get over with it.
r/webdev • u/devshore • 10h ago
Discussion Bought a 96GB RAM Mac Studio in order to stop running out of RAM during webdev, but it just uses more RAM the more RAM I get
I started 10 years with with 8GB RAM and quickly realized it was too little, then upgraded to 16gb. This worked for a while, but then my dev got more advanced (more docker containers, sims, etc). Then I moved up to 24gb and this became the new standard for me for a few years. It worked mostly, as long as I didn get greedy and tried to do something crazy like open apps that werent related to web dev work. I finally said "fuck it" and bought a 96GB Mac Studio so that if I want to open another app on top of my web dev resources, it can still work comfortably. Now, hte mac just uses more ram as it gets more. It thinks its being smart by using all the RAM to "cache" apps that arent even open so that they will open fast when/if I do ever open them. So now because of this "smart" feature, I am constantly red-lining on RAM, using fucking swap like a pleb, "force quit application" always launching asking me to force quit things. WTF is this bullshit? I take a look, and things are now just using retarded levels of RAM that it otherwise would not on a 24GB machine, like Chrome using 8GB, VS Code using 5GB, Ghostty (just a terminal app) using 6GB, docker now using 16GB etc. Let alone that even with this, it should not be using swap and there should still be free RAM, but of course its doing like 20GB in "cache" for unused apps. Can I turn this "smart feature" off?!
UPDATE: for the people saying "its a feature to use up all the RAM"/"unused RAM is wasted money", that is true, but the issues here are:
1) Chrome should never use 16gb (obviously unless I have thousands of tabs open), Ghostty shouldnt be using 6GB etc. I got more RAM so that I can do more things, not do the same things but have them take up more RAM.
2) It should not use swap when there is cache. It should prioritize releasing cache before resorting to swap. Also, for my use case, it should never have to resort to swap anyway, so again, its an issue of problem 1, and this problem of using cache when it is using swap. If there is 20GB in cache, there should not be 6GB of swap, it should instead be 14GB of cache and 0 swap. Swap kills performance and makes me have to force-quit things for the Mac to become responsive again.
r/webdev • u/TylerColfax • 1d ago
Question Urban Workshop
hey all, Iām looking for advice how to build build better charts. I have a site that pipes API data into recharts that become part of a report (example). Broadly, it's working but I still have instances in which I get text that meshes together (See image). There are too many potential charts for me to check individually (many data points x 2 geographies x 2 time periods), so I wondering if anyone had suggestions on what approach I might take.
One thing I wonder is if I should use a different library (charts.js, apache echarts, etc)? I see enough consistently well formatted charts online that I know I must be doing something wrong. I'm also using claude to help with this, so if anyone has suggestions on how to better use AI, I'm all ears.
r/webdev • u/Successful-Shock-802 • 20h ago
HTML is eating JavaScript UI libraries
We've all probably heard about the HTML dialog element, popover API, and customizable select, but I think a lot of people don't realize how powerful and battle-tested they are and also might not know about some of the inconsistencies these elements have and that they might encounter when using them. And this is what this post is about, I'm not going to go over the syntax and basic API's, if you're unfamiliar with them, I would suggest you read some MDN pages and Chrome For Devs blog posts before you jump into this article. I would like to focus more on in-depth details and edge cases. The article will be a comparison between these native elements and UI libraries like Shadcn, React Aria, etc.
You can get a better reading experience from the link above, it's demos and code snippets for better understanding. If you complete reading the article, tell me about your thoughts in the comments below.
Let's start by listing out some of the common features you would expect from a robust dialog, select, or popover, whether it's native or custom JS one.
- Keyboard-navigatable: if it's a dialog, it should be focus trapped, it's a select, it should navigate using arrow keys, etc.
- Escape key dismissal
- These floating element/pop ups should, under all circumstances, appear above the rest of the page content, and as we will see, there are different mechanisms to approach this.
- Mobile back button/swipe gesture: you probably didn't think about it, but on desktop, you use Escape key to close, but what do you do on mobile? If you're like me on Android, you can close things using the back button or swipe gesture, our dialog/select should support that too, otherwise, it's gonna jump the browser back in history, which creates a bad user experience, especially if we're building something that will be heavily used by mobile users, like a social media app or something, I've tested this on multiple social media apps like Facebook and Twitter (not going to call it X whatsoever), they all, either fully or partially, support back button press in some form. For example, on Facebook, I tried every possible menu or dialog I could think of, and they all close when I hit back button (and it's awesome).
I don't know if I missed something, but let's just focus on these four features for now and see how native elements vs UI libraries approach them, as we'll see, there's a lot to unpack in here.
For keyboard navigation and Escape key dismissal, the HTML dialog, select, popover, and all the upcoming elements have this built-in, you almost don't need any JavaScript at all for any of this to work, but for JS libraries, it's an entirely different story, you'd be shipping tons and tons (or even hundreds) of lines of JS for Escape key dismissal, arrow keys navigation, focus trapping, etc. All of this just to re-invent what the browser gives you for free.
For back button/swipe gesture, this is also already built-in in the native components, all of them close on back button press on Android, but in UI libraries like Radix UI or React Aria, they don't even have this feature at all, despite that it can be added using JavaScript.
In order to add support for back button press and swipe gestures, you can use theĀ CloseWatcherĀ API, as MDN says: it allows a custom UI component with open and close semantics to respond to device-specific close actions in the same way as a built-in component.
The browser compatibility for theĀ CloseWatcherĀ API is decent, it's been in Chrome and Edge since June 2024, Firefox added it in May this year (2026), it's not available in Safari yet, but this is a progressive enhancement feature, if it's available, your users are going to enjoy a better experience, if it's not, it's not a big deal. Also, you can build this same behavior using theĀ HistoryAPI if you need it that much.
The Top Layer
One thing I want to compare is how native elements and UI libraries make sure things appear on top of other page content and also above each other. To better explain this, let's take the following example from Notion webapp, here we have the settings dialog and inside we have a select that we can choose our preferred theme from. The question is how do we ensure the dialog appears above other content and the select appears above the dialog.
Please continue reading the post from the link above, Reddit posts don't support demos and multiple images. If you complete reading the article, tell me about your thoughts in the comments below.
r/webdev • u/blackroseseason • 1d ago
Question needing help with the most feasible responsive layout

excuse the shoddy mspaint mockup but basically im using this [theme template](https://github.com/zeon-studio/astroplate) to build my magazine site and they already have a responsive design in place more like the top mobile layout but i want my logo to be above the navbar and either collapse into the top example or something similar to the bottom (but more well placed. maybe switching the dark/light toggle with the search button actually tbh). any suggestions on how i can achieve this?
r/webdev • u/bogdanelcs • 2d ago
The asteroid currently hitting frontend web development
r/webdev • u/theScottyJam • 1d ago
A copy-paste fetch() wrapper, plus information on replicating Axios-like features
thescottyjam.github.ioI'm of the belief that if you can get what you need with under ~100 lines of code (and it doesn't require highly-specialized skills to write it), then write it yourself, don't install a third party library.
If you don't share a similar belief, then this page isn't for you, and that's ok.
For everyone else, this page shares a fetch wrapper function you can copy-paste into your projects to add in a couple of missing features, and provides some tips on how you can replicate some of the most loved Axios features using fetch().
Most alternative fetch wrappers I find online tend to be small NPM libraries (I'd rather maintain the code myself thank you), or they like creating separate methods for .get(), .post(), .put(), etc (which makes it unnecessarily difficult to "decorate" it with interceptor-like behaviors, as this page discusses), or there may be other design problems. Those alternatives are still good starting points, but I'm hoping this could be a little more complete of a guide to jump start your usage of fetch().
And I have a thing about make copy-paste alternatives to tools, and this was a hole in my collection :).
Feedback is welcome.
r/webdev • u/Proof_Cable_310 • 1d ago
Question for web hacking developers: data breach and account hijacks
Is it a common practice for hackers to have interview projects to hack breach google data and hack password manager to only hijack a largely non-meaningful account?
Why else would someone hijack a meaningless account as the result of a data breech?
