标签：#web

submitted by /u/Sengchor [link] [留言]

Hello everyone, I’m trying to host a React (Vite) app on GitHub Pages and keep running into the classic SPA routing problem. Repo: [Img2Num GitHub repo]( https://github.com/Ryan-Millard/Img2Num/ ) Live site: [Img2Num GitHub Pages]( https://ryan-millard.github.io/Img2Num/ ) The app is bascally a small landing page for the project that shows an example of how the library can be used, but it uses React Router (BrowserRouter). Everything works fine when navigating inside the app, but: - Refreshing any route other than / results in a 404 - Directly visiting a nested route also 404s - GitHub Pages clearly doesn’t handle SPA fallback routing Many people have suggested these: - Use HashRouter - Add a 404.html fallback hack - Switch to another host (e.g., Clouflare Pages) but I don't like those options because they are either not well-structured and SEO-friendly, not a complete solution, or make it harder to test global support (Cloudflare Pages allows special headers for things like pthreads that GitHub Pages and many other JS setups don't support). What I’m trying to do instead is something like static site generation (SSG) as it would likely be the cleanest fix - similar to how Docusaurus or Astro handles this: - Pre-render routes at build time - Serve static HTML for /, /docs, etc. - No client-side routing dependency for initial load - Better SEO and no refresh issues This saves use from needing to have a fancy backend. When I try setting up SSG with Vite & React, I end up failing I've tried things like `vite-plugin-ssg`, but run into strange behaviours and errors that I cannot seem to be able to fix (e.g., an incompatible dependency that, also breaks when downgraded). I don’t fully understand the correct architecture for multi-route SSG in a React SPA setup. --- What is the correct modern approach for this and is there a recommended way to keep React & Vite, deploy to GitHub Pages, get proper multi-route support without hash routing, and avoid SPA 404 refresh issues ent

Hi ! I would like to know, for all the freelancer, how do you find clients ? submitted by /u/Klutzy-Badger-2778 [link] [留言]

A new verification step submitted by /u/mikeplus10 [link] [留言]

Genera la tua prima fattura elettronica XML per lo SDI in TypeScript (in 10 minuti) Se hai mai dovuto integrare la fatturazione elettronica italiana in un progetto Node.js, sai già quanto è scomodo: specifiche FatturaPA di 200 pagine, regole cross-field non documentate, codici errore SDI criptici, e librerie npm o abbandonate o in PHP. Questo articolo mostra come generare un XML valido per il Sistema di Interscambio (SDI) usando fattura-elettronica-sdi-builder , una libreria TypeScript open-source che copre B2B (FPR12) e Pubblica Amministrazione (FPA12). Installazione npm install fattura-elettronica-sdi-builder Nessuna dipendenza pesante. La validazione è custom e tipizzata, zero runtime esterni. Il flusso in tre funzioni La libreria espone tre funzioni pubbliche che si usano sempre in sequenza: import { applyDefaults , validate , buildXml } from ' fattura-elettronica-sdi-builder ' ; Funzione Input Output applyDefaults(input) FatturaElettronicaInput (campi deducibili opzionali) FatturaElettronica completa validate(fattura) FatturaElettronica Result<void, ValidationError> buildXml(fattura, options?) FatturaElettronica Result<string, BuildError> Tutte le funzioni restituiscono un Result<T, E> — mai eccezioni non gestite: type Result < T , E > = | { ok : true ; value : T } | { ok : false ; error : E } Esempio completo: fattura B2B con IVA ordinaria Genera una fattura TD01 da una Srl italiana a un cliente italiano, IVA al 22%, pagamento con bonifico. import { applyDefaults , validate , buildXml } from ' fattura-elettronica-sdi-builder ' ; import type { FatturaElettronicaInput } from ' fattura-elettronica-sdi-builder ' ; import { writeFileSync } from ' fs ' ; const input : FatturaElettronicaInput = { FatturaElettronicaHeader : { DatiTrasmissione : { ProgressivoInvio : ' 00001 ' , CodiceDestinatario : ' ABC1234 ' , // 7 caratteri per FPR12 }, CedentePrestatore : { DatiAnagrafici : { IdFiscaleIVA : { IdPaese : ' IT ' , IdCodice : ' 01234567890 ' }, Anagrafica : { Denominaz

I'm a maxillofacial surgeon in Ouagadougou, Burkina Faso — and a self-taught builder who's been coding since medical school. Over evenings and weekends, I shipped Readium — a production AI reading app that lets you discuss books with Claude while you read them, in any language. Built AI-paired with Claude, reviewed and deployed by me. Most "I shipped an AI app" write-ups cover the happy path: clone a starter, glue an LLM, deploy to Vercel. The walls I hit weren't there. They were in the spaces between the libraries. Here are five of them — and what I'd tell myself a few weeks ago. Wall 1 — SSE streaming broke at the seam between the LLM and the browser I assumed streaming "just worked" once OpenRouter returned a stream. It does — until your server-side handler, your reverse proxy, or your browser code introduces a buffer somewhere along the path. The chain has at least three places where buffering can silently kill streaming: The LLM API (fine on its own) Your Node server-side handler (fine if you forward chunks instead of accumulating them) The reverse proxy / CDN (often buffers entire responses by default) The failure mode is always the same: the UI looks exactly like the LLM is slow. It isn't — somewhere between OpenRouter and the browser, bytes are being withheld until the connection closes, then dumped in one chunk. What I'd tell past-me: streaming isn't a feature of the LLM, it's a property of your entire request path. If you can't watch tokens land character-by-character in curl -N against your origin, you don't have streaming, you have a slow non-stream pretending. Set Cache-Control: no-transform and X-Accel-Buffering: no headers from your handler, disable response buffering on every layer in front of it, and verify with curl -N before you trust the UI. Wall 2 — fetch hangs forever on certain hosts (and the fix isn't where you think) I had a proxy route that fetched from an external API. Worked locally. Worked in staging. Deployed to production: the route wo

I have a PHP and MySQL website that I built myself and I want to make an app for my website. I am currently running an app with website2native app or hybrid if you know what that is. Do you recommend me learning a language like Dart to make apps or should I focus on PHP? submitted by /u/FarrisFahad [link] [留言]

Question from the title. For years and years I have a recognizable style of making UI and I have experienced that people think that those applications/sites were generated by AI even though this is not true, and some applications were made before gpt 3.5 and before the commercialization of LLM. I have always tried to make the design look modern and the fact is that LLMs were trained in such a style and that is why we come to such a problem. submitted by /u/Excellent-Article937 [link] [留言]

Hello, How can I implement a component overlay, like a dropdown or popover, so it escapes its parent container instead of being clipped, hidden, or expanding the parent layout? I managed to do it with getBoundingClientRect(), store the position in state and apply it as fixed positinioning. Even though it seems to work, wonder if there is a better solution. Thank you. submitted by /u/prois99 [link] [留言]

Im a beginner trying to create a website for my luxery home staging business. I tried using templates in canva but hate how generic it looks and find it very limiting Is there a better way ro use canva? What combination of tools would help me create an editorial style website. Would be nice if there were some AI tools i could use in conjunction to make some of the work easier . submitted by /u/Grand_Respect_9176 [link] [留言]

A practical 5-10 minute checklist for vetting npm dependencies before adding them to production. It focuses on provenance attestations, install scripts, CI quality signals, maintainer responsiveness, and security handling. submitted by /u/OtherwisePush6424 [link] [留言]

Hello Dev Community 👋 I recently built my first web project called Namastra — a simple tool to explore the meanings, origins, and insights behind names. 👉 Live Demo: 💡 Why I built this I noticed that many people are curious about: What their name means Where their name comes from What personality or cultural meaning it carries But most websites are: Too slow Full of ads Hard to navigate So I decided to build something simple, fast, and clean. ⚙️ What Namastra does With Namastra, users can: 🔍 Search any name instantly 📖 Get meaning and origin 🌍 Learn cultural background ⚡ Use a clean and fast interface 🛠️ Tech Stack I built this project using: HTML CSS JavaScript GitHub (version control) Netlify (deployment) Hosted here: [Netlify] Code managed via: [GitHub] 🚧 Challenges I faced As a beginner developer, I faced challenges like: Designing a clean UI Making search functionality smooth Deploying with GitHub + Netlify Structuring data properly But I learned a lot through building it step by step. 🎯 What I learned How to build and deploy a full project How important UI simplicity is How real users think differently than developers How deployment pipelines work (GitHub → Netlify) 🚀 Future improvements I plan to add: More name data Better UI design Categories (religion, origin, country) Possibly AI-based name insights 🙌 Feedback welcome This is my first real web project, so I’d really appreciate your feedback and suggestions. Try it here: 👉 Thanks for reading ❤️ Happy coding!

I like to make userScripts and userStyles for myself. I've begrudgingly dealt with Shadow DOM here before, and it's nothing but a pain in the ass. However, now I'm seeing a userStyle that I'm trying to apply being removed immediately as it's applied (using Stylus). What is the mechanism behind this? Other styles from the same style sheet are still being honored. The element still has the same root, and is still be matched by the rules's selector. What might be the way this is achieved? https://youtu.be/YgbOrfel604 (Chromium 124.0.6367.61 (Official Build) (64-bit)) submitted by /u/svArtist [link] [留言]

Most indie hackers I know spend an embarrassing amount of time on the naming part. We argue with ourselves over the perfect .com, eventually settle for some janky combo of words with random consonants ripped out, and ship a domain we secretly don't love. There's a quieter option a lot of builders haven't seriously considered: .Vegas. It's a geographic TLD, but it does NOT require you to be in Las Vegas or build anything Vegas-related. What it does give you is a TLD that sounds bigger than it costs, reads as memorable, and is still wide open in 2026. I went down a small rabbit hole this week looking at side-project ideas that would have an almost unfair head start on .Vegas. Here are five. 1. A weekend trip planner Domain: weekend.vegas or trip.vegas This is the lowest-hanging fruit and I'm honestly surprised nobody's built it yet. A tiny webapp that takes a Friday-to-Sunday window and spits back a fully booked itinerary: flight, hotel, two restaurant reservations, one show, one activity. Three clicks, done. Why it works on .Vegas: the domain is the elevator pitch. Nobody needs to read your tagline. The URL bar tells you what the product does. That's worth more than most landing-page copy will ever earn. 2. A bachelor/bachelorette party coordinator Domain: bach.vegas , party.vegas , last.vegas Group-trip coordination is genuinely awful. Splitwise + a group chat + a shared Notion doc + that one friend who keeps forgetting to Venmo back. There's room for a niche product here that handles the deposit splits, the "who's in for the cabana" upsells, and the inevitable last-minute flight changes. Why it works on .Vegas: the URL doubles as a tagline. You don't have to explain what kind of trip it's for. 3. A booking aggregator for shows and residencies Domain: shows.vegas , tonight.vegas Caesars, MGM, Live Nation, AXS, Vivid Seats, the venue's own ticketing system — finding a good show on a specific Tuesday night is a pain. A scraper-backed booking aggregator that's honest a

In web development, every millisecond on the critical path matters. Typography is part of your visual identity, yet a single self-hosted family can add hundreds of kilobytes before the browser paints the hero line clients actually see. That cost often shows up as slower First Contentful Paint (FCP) and a worse Largest Contentful Paint (LCP) when the LCP element is a headline set in a custom face. Font subsetting is the practical fix: ship only the characters (glyphs) each page or component needs instead of entire typefaces built for every language and symbol you will never render. What font subsetting is A typical desktop font file contains thousands of glyphs: Latin extended, Cyrillic, ligatures, numerals, punctuation, and symbols you may never use on a marketing site. When you @font-face that file or pull it from a CDN, the browser still has to download and parse the whole package unless you split it. Subsetting creates a smaller font file that includes a defined subset of Unicode code points. Examples: A display font used only on one H1 might need fewer than 40 characters. A Latin-only blog body font does not need CJK tables on every article. UI labels in English can omit unused weights and scripts. The browser downloads less data, spends less time decoding, and can apply the face sooner. You keep the look; you drop the dead weight. When font subsetting improves web font performance and LCP Subsetting pays off fastest in these cases: Situation Why subsetting helps Display or hero typography Few unique characters, high visual impact, often on the LCP text node Single-language sites Remove unused scripts and diacritic ranges you do not publish Icon or logo fonts misused as full fonts Replace with SVG where possible; subset if you must keep a font icon set Multiple weights loaded globally Subset per weight, or load weights only on routes that need them It is lower priority when you already use a system font stack for body copy and only load one small variable font w

An account manager forwarded us a Search Console screenshot at 4:47 p.m. on a Friday. LCP on the homepage had been in the red for eleven days. Engineering had not been in the thread because nobody was assigned to watch the numbers until a sponsor noticed. That is reactive performance monitoring in practice: fast tools, slow humans, and a calendar that only opens when someone else raises the alarm. Proactive monitoring is the opposite shape. Scheduled lab tests run whether or not anyone remembered to open PageSpeed Insights. Performance budgets turn history into rules. Alerts fire when those rules break, with enough context to triage and enough restraint that people still read them. The word “smart” in product copy usually means the second part: alerts that match how teams actually work, not a louder siren. This post is for agency leads who already automate some tests but still learn about regressions from client inboxes. We walk through what reactive looks like, what proactive requires, and how to wire alerts so they change behaviour instead of training everyone to mute the integration. What reactive performance monitoring looks like on agency teams Reactive does not mean “no tools.” Most agencies we speak with have PageSpeed Insights bookmarks, a monthly spreadsheet, and a standing item on the retainer review slide. Reactive means the signal arrives after the business event you wanted to prevent. Common patterns: Spot checks after deploy. Someone runs PSI on staging, ships, and assumes production matches until a complaint arrives. Quarterly or monthly report pulls. CrUX and Lighthouse exports go into a deck. Useful for storytelling; too slow to catch a plugin update that moved INP on Tuesday. Client-led discovery. The sponsor pastes a screenshot, asks “is this new?”, and the team scrambles to reproduce on a laptop that may not match the lab conditions you use in production monitoring. Alerting without policy. Webhooks fire on every metric twitch. By week three the

If you have been following the 100 Days of Solana challenges, you have already worked with tokens. You created mints, set up token accounts, transferred SOL, and explored token extensions. But there is a distinction that comes up constantly in web3, and understanding it properly will change how you think about everything you build going forward. Fungible and non-fungible tokens. You have probably heard these terms before, especially NFTs. But what do they actually mean on Solana, and how does the same token system handle two very different concepts? What makes something fungible Fungible just means interchangeable. One unit is identical to another unit. If I have 10 USDC and you have 10 USDC, ours are exactly the same. It does not matter which specific USDC tokens I hold because they are all worth the same and behave the same way. We could swap them and nothing changes. This is how most things you are used to work. A dollar bill is fungible. A liter of petrol is fungible. One unit of SOL is the same as any other unit of SOL. When you built token transfers in the challenges, you were working with fungible tokens. You did not need to care about which specific tokens moved, just how many. Fungible tokens are used for currencies, stablecoins, utility tokens, governance tokens, loyalty points, in-game currencies, and anything where the quantity matters more than the individual unit. What makes something non-fungible Non-fungible means unique. Each token is different from every other token, even if they come from the same collection. If I have NFT #42 from a collection and you have NFT #87, those are not interchangeable. They might have different images, different properties, different rarity, or different utility. Think of it like event tickets. Two tickets to the same concert are not the same if one is front row and the other is in the back. They came from the same event, but each one is distinct. Non-fungible tokens are used for digital art, collectibles, membership pa

Most developers paste production JWTs into online decoders without thinking. Here's a 10-second DevTools check to see if your token is actually leaving your machine. A coworker was debugging an auth bug last month. Standard workflow: copy the JWT from the failing request, paste it into an online decoder, read the payload. I've done it a thousand times. You probably have too. Except the token he pasted belonged to a real customer. And the decoder he used is owned by an identity company that's had its share of security incidents. Nothing bad happened. Probably. But it made me think about something I'd never actually checked: when you paste a JWT into an online decoder, where does that token go? What a JWT actually contains Quick reminder of why this matters. A JWT isn't encrypted — it's just Base64URL-encoded. Anyone who has the token can read everything in it: header.payload.signature The payload routinely contains: User ID, email, and role Session identifiers Token expiry ( exp ) and issue time ( iat ) Sometimes — against best practice — far more And here's the part people forget: a valid, unexpired JWT is a live credential. If it hasn't expired, whoever holds it can often impersonate the user. Pasting it into a random website is functionally similar to pasting a password. The 10-second check Most online JWT decoders claim to be "secure" and "client-side." Some are. Some aren't. You don't have to trust the claim — you can verify it yourself in 10 seconds: Open the decoder in your browser Open DevTools → Network tab Clear the network log Paste a JWT and decode it Watch the Network tab If any request fires when you decode — your token left your machine. A truly client-side decoder fires zero network requests during decoding. The JavaScript does everything locally; nothing is sent anywhere. Try this on whatever decoder you currently use. You might be surprised. Why most "online" tools send data It's usually not malicious. Building decoding logic on the server is someti

I have been receiving pretty good offers for B2B contracts. I've been employed for the 7+ years here and, wasn't fired, had np joining whichever company, always got a raise hoping or within the company. The issue is that in some of those , mgmt and leadership people keep changing in less than 6-12 months. Goals, focus, performance, even structure keep changing out of nowhere, regardless of me being consistent or better in whatever made up metric they have always get some stupid ass feedback of something I should be doing outside my job or expertise. Am I being naive? every f..ing company is like that right? I've been wondering if maybe it is not for me being a full-time employee. Are contractor roles less focused on that? What is your exp from what I said above? don't care about goals, being on call or career paths. Just want to do the job, deliver and move on to the next project. I've been promoted many times, had leader roles, don't recommend, don't like, no added value for me and promotions don't give more money or improved my contract. What about agencies that provide dev services and you get allocated for short times? Also got those positions but no idea how it works and how stable it is. I always have been fulltime employee my entire working life. If you have resource about opening a company for B2B contracts, please link it to me, I would be mostly interested in something around Austria/Hungary area. I am specialized in FE hence posting here. EDIT: clarity on the second paragraph submitted by /u/Raziel_LOK [link] [留言]

I'm hoping to get some info on sizing for the Herman Miller Aerons.. I'm 5'7", 220lbs, and in my mid 40s. I'm built with a fairly long torso and shorter, but more muscular legs, which seems to be the opposite of what a lot of ergo chairs are built for. I've had mild, but consistent back pain for the last 10-15 years, primarily from being a programmer and sitting at a desk with cheap chairs and not the best posture for about 25 of the last 30 years.. My current chair (Office Max mesh back with a padded seat and headrest) was decent at the beginning, but the seat padding is basically gone and the last week or so, anytime I sit in it for longer than about an hour, my lower back pain is significantly worse for the rest of the day, so it's time to replace it. I've seen other reddit threads ([this reddit thread, for example]( https://www.reddit.com/r/hermanmiller/comments/j4y3tl/proper\_herman\_miller\_aeron\_sizing\_chart\_corrected/ ) that seem to indicate that the person won't help me with my height/weight and will make my lower back/thigh pain worse.. Is there anyone with a similar build to me that currently has or has had an Aeron that can give feedback as to whether it has actually helped with back pain or made it worse? Or, if anyone with a similar build to me has any suggestions on other chairs that have been good for them, I'd love that info. My budget tops out at about 600-650, and I don't have a problem with used/refurbished if it comes from a decent place with a reliable warranty or 30-90 day return policy. My back thanks you in advance! (In case it matters, this will probably be cross posted in a few other subs.. hopefully that's not an issue, as I need all the help I can get with this back pain at this point. submitted by /u/melophat [link] [留言]