Last weekend I started building SiteGrade — a free instant SEO audit tool that gives any website an A–F letter grade and the top fixes ranked by impact. I just launched it. This post is the build log: the architecture decisions that worked, the ones that didn't, and the gotchas you'd save time knowing about. If you're considering building a similar audit/scanner tool, or just want to see what a 2026 Next.js + Supabase + Stripe stack looks like in practice, this should be useful. Why I built it I got tired of family and friends asking me "how's the SEO on my website?" and not having a good answer to send back. Every existing tool I tried either cost $99+/month (Ahrefs, Semrush) or threw 200 metrics at people who just wanted to know if their site was OK. The wedge I built around: one letter grade, three top fixes, plain English, no signup. The paid tier ($29/mo) re-audits weekly and emails the report so non-technical users can track improvements as their developer makes them. The stack Nothing exotic. Everything is the obvious choice for a 2026 indie SaaS, which is the whole point — boring stack means I spent zero time fighting infrastructure and 100% of my time on the actual audit logic. Next.js 14 App Router — frontend + API routes in one repo Supabase — Postgres + auth + RLS + file storage, EU-hosted for GDPR Stripe — subscriptions + Billing Portal + webhooks Resend — transactional email (audit reports, weekly reports, Supabase auth via Custom SMTP) Vercel — hosting + cron jobs for the weekly re-audit cheerio — HTML parsing for the audit checks Google PageSpeed Insights API — Core Web Vitals + mobile performance Total monthly infrastructure cost at zero traffic: ~$0 (everyone on free tiers). At 100 paying customers it'd still be under $30/mo. The audit logic — what 15 checks look like in code Each audit runs 15 checks and produces a score from 0-100, then maps that to a letter grade (A: 90+, B: 75+, C: 60+, D: 45+, F: below 45). The checks are structured as pure fu

Meme Monday! Today's cover image comes from the last thread . DEV is an inclusive space! Humor in poor taste will be downvoted by mods.

Welcome to the first chapter of a hands-on course where we build a production-grade Playwright + TypeScript automation framework — covering both API and UI testing — against a real, dockerized web app you run on your own machine. This isn't a "here are 5 Playwright tips" post. By the end of the series you'll have a framework with the same shape a real QA team ships: layered, parallel-safe, authenticating once and reusing the session, seeding data through the API and verifying it in the UI, and running sharded in CI. We build it one chapter at a time, and every line of code is in a public repo you can clone and run. Who this is for You can read basic JavaScript (variables, functions, async/await ). That's it. No Playwright or TypeScript experience required — we introduce both from zero. You've maybe written a few UI tests before and felt them turn into a tangle. This course is about the structure that prevents that. How the course works Each chapter is one post in this series, in order. Read them top to bottom. There's a companion GitHub repo — the single source of truth for all code: 👉 https://github.com/aktibaba/playwright-qa-course The repo carries one git tag per chapter ( ch-01 , ch-02 , …) so you can check out the exact state of the code at any point and compare it to what you have. Every chapter ends with what changed, so you can either build along or just read the diff. Get the code and run the app We don't test toy pages. The course runs against Inkwell — a small but real React + Express + PostgreSQL blogging app (articles, comments, tags, follow/favorite, JWT auth). It lives in the same repo under sut/ ("system under test") and ships as a one-command Docker stack with deterministic reset / seed endpoints, so your tests never race startup or fight flaky data. You'll need Node.js 18+ and Docker . # 1. Clone the course repo git clone https://github.com/aktibaba/playwright-qa-course.git cd playwright-qa-course # 2. Start the app (db + API + web), wait until eve

Used 5 different programming language for this course. GitHub repository link: https://github.com/mohammadijoo/Control_and_Robotics_Tutorials submitted by /u/abolfazl1363 [link] [留言]

Quick share. Been running into this enough times across NetSapiens deployments that it's worth flagging. Scenario: Call gets placed or transferred between two domains on the same NetSapiens platform. The call connects fine. Audio works. But the caller ID showing up on the receiving side is wrong. It's showing the local extension or domain user instead of the actual originating caller. If you check the NetSapiens Known Issues page, this maps to NMS-2518. It shows up specifically when calls cross domain boundaries during hold or transfer. The fallout is mostly cosmetic but it matters for anyone running multi-tenant reseller deployments. Your customer sees the wrong name in their call history. Voicemail attribution gets weird. Inter-domain analytics show calls from the wrong source. A few patterns I've seen work around it: Configure SIP header rewriting at the SBC layer to preserve the original From URI across domain hops For softphones that pull call history from NetSapiens API directly, verify which field the client is actually displaying. Some pull from orig_user , others from local_user . The discrepancy shows up clearer than you'd expect. If you're running a mobile softphone client, check whether the client is caching contact info locally and overriding what NetSapiens returns. A lot of "wrong caller ID" reports turn out to be client-side caching bugs, not platform bugs. The deeper fix is platform-side and depends on what NetSapiens version you're running. The cleaner softphone integrations route call history through the NetSapiens API rather than building it locally on the device, which sidesteps the worst of this behavior. White-label softphones that integrate natively with NetSapiens handle this more consistently than generic SIP clients. Tragofone is one example where the call history syncs through the NetSapiens softphone integration layer directly, so inter-domain caller ID is consistent with what the platform actually has. Other native integrations handle t

Se você já fez algum front-end interativo, já tem 80% do que precisa pra fazer um jogo simples. Game jams como a June Solstice são desculpa perfeita pra testar isso — três semanas, tema aberto, e você descobre que canvas + requestAnimationFrame levam longe. Por Que Desenvolvedores Web Deviam Fazer Game Jams A maioria dos devs que conheço nunca tentou fazer um jogo porque acha que precisa aprender Unity ou Unreal. Mas se você já mexeu com animações CSS, state management ou physics simulators básicos pra UI, você já cruzou metade da ponte. Game jams forçam escopo pequeno — você não vai fazer Elden Ring em três semanas, vai fazer um Snake com twist. E isso cabe perfeitamente no que o browser oferece. Além disso, jogos web rodam em qualquer lugar. Sem instalador, sem App Store review, sem build pra cinco plataformas. Você manda um link e qualquer um joga. Pra um jam onde o pessoal precisa testar dezenas de jogos rápido, isso importa. Canvas API: Seu Motor Gráfico Embutido O <canvas> existe desde 2010 e faz exatamente o que você precisa: desenhar pixels, shapes e imagens num loop de 60fps. A estrutura básica de qualquer jogo 2D cabe em 30 linhas: const canvas = document . querySelector ( ' canvas ' ); const ctx = canvas . getContext ( ' 2d ' ); const gameState = { player : { x : 50 , y : 50 , speed : 2 }, enemies : [] }; function update ( deltaTime ) { // Input handling if ( keys [ ' ArrowRight ' ]) gameState . player . x += gameState . player . speed ; if ( keys [ ' ArrowLeft ' ]) gameState . player . x -= gameState . player . speed ; // Game logic gameState . enemies . forEach ( enemy => { enemy . x += Math . sin ( Date . now () / 1000 ) * 0.5 ; }); } function render () { ctx . clearRect ( 0 , 0 , canvas . width , canvas . height ); // Draw player ctx . fillStyle = ' #00ff00 ' ; ctx . fillRect ( gameState . player . x , gameState . player . y , 20 , 20 ); // Draw enemies gameState . enemies . forEach ( enemy => { ctx . fillStyle = ' #ff0000 ' ; ctx . fillRect ( enemy .

I've started a series of short blog posts about hot path optimizations. This first one covers a counterintuitive optimization: replacing integer division ( IDIVQ ) with floating-point division ( DIVSD ). submitted by /u/watman12 [link] [留言]

This is today’s edition of The Download, our weekday newsletter that provides a daily dose of what’s going on in the world of technology. Why this year’s World Cup ball may not fly as far Much is new about this month’s FIFA World Cup tournament. It hosts more teams than ever before. It’s the first…

Lenovo's IdeaPad Slim 5x just might be the best laptop you can buy for $850. It's hard to find any major flaws, which is basically unheard of in a laptop at this price.

Google says Gemma 4 12B is "designed to bring agentic, multimodal intelligence directly to your laptop", further noting that the new model can be combined with Google AI Edge to "build and experiment locally, on everyday machines". This integration allows for a wide range of capabilities, from autonomous data processing to generating visual insights and even building webpages or executing tools. By Sergio De Simone

The era of passive data analytics is over. Today, the most forward-thinking data teams aren't just...

Welcome to this week's Top 7, where the DEV editorial team handpicks their favorite posts from the...

Stop AI hallucinations Discussion | Link