标签：#webdev

I’m building a website that will eventually become a collection of useful browser-based tools, similar to iLovePDF but covering many different categories. The goal is simple: No downloads No accounts Fast and mobile-friendly Free to use I’m researching what people actually need before building more tools. What’s a small utility, calculator, converter, formatter, generator, or productivity tool you use regularly but wish had a better version? Examples: Land measurement calculators PDF tools Text formatting tools Developer utilities SEO tools Study tools I’d love to hear your ideas and pain points. submitted by /u/Nikpa_2163 [link] [留言]

SQL is arguably the most widely used language in software engineering, yet it is often the least carefully written. Most teams enforce strict linting on their application code but leave SQL queries as a free-for-all. This guide covers the formatting rules that separate maintainable, team-friendly SQL from query spaghetti that haunts on-call rotations. Why Poorly Written SQL Is a Real Engineering Problem Unformatted SQL is not just an aesthetic issue - it is a correctness risk. Dense, run-on queries make it nearly impossible to spot accidental Cartesian products, missing GROUP BY clauses, or WHERE conditions that silently bypass indexes. By the time a performance problem surfaces in production, tracing it back to the root cause becomes a painful exercise in reading someone else's stream of consciousness. Rule 1: Keyword Capitalization SQL engines treat select and SELECT identically, but human readers do not. Always uppercase reserved keywords such as SELECT, FROM, WHERE, JOIN, GROUP BY, and ORDER BY. Keep table names, column names, and aliases lowercase. This single habit immediately creates a visual boundary between the logic structure of the query and the underlying data it operates on. Rule 2: Indentation and Clause Alignment Think of SQL clauses as layers in a data pipeline. Each major clause - SELECT, FROM, WHERE, GROUP BY, ORDER BY - should start at the left margin. Columns and filter conditions beneath them should be indented by 4 spaces (or 1 tab, as long as your team is consistent). This structure lets any reviewer skim the query top-to-bottom and understand the data flow at a glance. Rule 3: Trailing vs. Leading Commas This is a genuinely debated topic on data teams. Leading commas (placing the comma at the start of each new line) make version control diffs significantly cleaner when columns are added or removed. Trailing commas look more natural for developers coming from JavaScript or Python. Neither approach is wrong - what is wrong is mixing both styles

Exactly one year ago, my terminal was a blank slate. I started where almost everyone does , wrestling with HTML, CSS, and JavaScript, trying to understand the web pixel by pixel. What began as curiosity quickly turned into a full obsession. I went from building simple static pages to diving deep into full-stack development. Here’s what that intense first year of constant building, breaking things, and shipping real projects has looked like. The Leap into Modern Frameworks Once vanilla JavaScript started feeling limiting, I jumped into React . Component-based thinking completely changed how I approached interfaces. Then came Next.js — it bridged client-side beauty with server-side power and pushed me into a true full-stack mindset. The Ultimate Test: Lynvista Safaris The biggest challenge was building lynvistasafaris.com , a live travel booking platform for a real client. This project forced me far beyond tutorials and into real engineering problems. I had to implement: Payment infrastructure from scratch with Daraja API (M-Pesa STK pushes) and Paystack for international transactions. A robust database layer using Drizzle ORM + MySQL. Custom business logic , including a multi-currency pricing system with special validation rules for currencies like GBP. It was messy , many late nights debugging webhooks, schema mismatches, and edge cases , but shipping it taught me more than any course ever could. What One Year Taught Me Syntax is just a tool. The real skill is learning how to break down complex problems, debug effectively, and keep iterating even when things break in production. I’m incredibly proud of the progress I’ve made in 365 days (402 contributions later), but I know I’m still at the very beginning. For the next phase, I’m focused on shipping more projects, writing about the crazy bugs I encounter, and deepening my architectural and full-stack skills. If you want to see what I’m building right now, check out my GitHub .

In Q1 2026, OpenAI and Anthropic moved enterprise customers from flat-rate plans to token-based billing. The change looks administrative, but it had a direct consequence for engineering teams: the real cost of AI became visible for the first time. The market's reaction over the following two months was enough to reopen a question many considered settled: does AI actually deliver measurable ROI? What happened when the bill arrived The most documented case is Uber. The company had encouraged all employees to use agentic tools as much as possible and even ranked AI usage internally on leaderboards. The result: the entire annual budget was consumed in four months. The response was a $1,500/month cap per employee per agentic coding tool (Claude Code, Cursor, and similar). At Brex, engineers were limited to $500/week in tokens; employees outside engineering received a $5/week cap. T-Mobile temporarily capped usage at $2,000/month per user with plans to migrate to a tiered system. One unnamed company, according to Ed Zitron in "AI Is Slowing Down" (June 2026), spent $500 million on Anthropic models in a single month due to absent spend controls. These are not isolated cases. A KPMG survey reported by the Wall Street Journal in June 2026 found that only 26% of companies have a comprehensive view of their AI costs; 50% have partial visibility; and 22% only find out what they owe after the bill arrives. Steve Chase, KPMG's global head of AI, told the Journal: "It's a new resource that needs to be managed that didn't exist quite that way, and we're seeing exponential growth." The structural problem behind the spending caps The spending caps are a symptom. The root cause, as Zitron details in the same article, is that the economics of generative AI require numbers that currently seem out of reach. Anthropics has made over $330 billion in compute commitments with Google, Amazon, and Microsoft, plus another $45 billion with CoreWeave and SpaceX. To cover those commitments, it nee

I’ve been working on a unit conversion website and would appreciate feedback from fellow developers. Goals: Fast loading Mobile friendly SEO focused Clean UX Site: https://myunitconverter.app I’d especially love feedback on: Navigation Search experience Performance Features worth adding Happy to return feedback on your projects too. submitted by /u/Nikpa_2163 [link] [留言]

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

"How do I hide wp-admin" is one of the most-searched WordPress security questions, and most answers give the same advice: install a plugin that renames your login URL. That advice isn't wrong. It's just answering a smaller question than the one being asked. Renaming /wp-login.php to /my-login moves the login form. It does not change what answers at the old path, what your plugin folders advertise, or what your home page tells a scanner about the stack underneath. If your only problem is the password-guessing bot hammering the default form, a renamer solves it. If your problem is "stop my site from being identified and targeted as WordPress," you've solved maybe a third of it. Here are the three leaks a login rename leaves open. Leak 1: the old path still costs a full WordPress boot When a login-URL renamer "blocks" the default path, the request to /wp-login.php still loads WordPress. PHP starts, the plugin stack initializes, and only then does the plugin decide to return a 404 to the logged-out visitor. The visitor sees a 404. Your server still did the work of booting WordPress to produce it. On a quiet site, nobody notices. On a site taking tens of thousands of probes a day, that's tens of thousands of full WordPress boots spent generating 404s. Your security dashboard's "attempts blocked" counter looks great. Your CPU graph disagrees. The architectural alternative is to reject the request at the rewrite layer, before PHP runs: # Apache .htaccess — reject the default login path at the server level < IfModule mod_rewrite.c > RewriteEngine On RewriteCond %{REQUEST_URI} ^/(wp-login\.php|wp-admin) [NC] RewriteCond %{HTTP_COOKIE} !wordpress_logged_in [NC] RewriteRule .* - [R=404,L] </ IfModule > # nginx — same idea, requires a config reload after change location ~ * ^/(wp-login \ .php|wp-admin) { if ( $http_cookie !~* "wordpress_logged_in") { return 404 ; } } The probe to the old path returns 404 from the server, WordPress never loads, and the request costs almost nothi

Because a reality wasn't given to us and is not there; but we have to make it ourselves, if we want to be; and it will never be one for ever, but constant and infinitely changeable. Luigi Pirandello, One, No One, and One Hundred Thousand Pirandello wrote this about the human condition. He didn't know he was describing the future of the internet. The web we know is about to disappear Not slowly. Not gradually. The web page, as the default unit of human navigation, is about to disappear: it will strip itself of everything we call "interface" and what remains will be only what it always was underneath — data, structure, instruction. The enticing homepages. The banners. The product carousels engineered by UX teams to capture attention in the first second and a half. The brand colors. The call-to-action buttons optimized for conversion rate. All of this is designed for a human eye that navigates alone. That eye is about to delegate. The agent that browses for you Imagine you want to buy a pair of shoes. Today you open a browser, search, filter, compare, go back, reopen the tab you closed, forget what you were looking for, start again. In a few years — maybe less — you will tell the agent what you want. The agent will already know that you have wide feet, that you prefer leather to synthetic, that you're looking for something for a wedding in June but deep down you want something that works afterward too. It will know that today you're in a practical mood, not an aspirational one. That you've spent a lot this month. The agent won't open a homepage. It will query a data structure. It will receive prices, availability, variants, return policies. It will build for you — and only for you, and only in that moment — a presentation tailored to measure. Colors that belong to you. Texts that speak your language. Images generated for your aesthetic sensibility of that day. The same store. Five billion different versions. One for each person, one for each moment. One, No One, and On

I have a domain with godaddy that I have used for over a decade and it comes with a domain email I have used for my work for the entire time. Their constant price hikes and add-ons have gone a step too far, especially after forcing microsoft email on me and then charging me £100 a year just for email with pathetic storage space...so I want to totally migrate from godaddy. The trouble is I am like a super boomer when it comes to web stuff. I will never understand what a DNS is or does, nor an SSL or SMTP, no matter how many times it's explained. My brain just won't accept any of it. It's a foreign language to me, so all of this is beyond terrifying and daunting. I don't want to lose any emails or domain etc as I use it all for work. From the research I have done, it seems transferring my domain to porkbun sounds like a good idea? But I read that I should use a different provider for email? But if the email is @ domainname then how can it be seperate? I don't understand that bit. And apparently I should transfer email before domain?? Could someone please offer some advice on how best to approach this? the internet is giving me 1000 different answers so I have no idea what is best to do. Will I lose previous emails when I transfer the email elsewhere? My current exact usage is: - domain name currently with godaddy - my website is built with adobe portfolio and comes with ample storage so I just redirect url to that page, so I don't need a new website or storage hosting etc. - my single email that I have used for years is mail@domainname and I always used gmail before (via proxy or whatever it's called?). so I used gmail and it sent from my domain email. Worked fine for years until godaddy forced users to pay for microsoft email and then the gmail proxy thing went all weird so I couldn't use it anymore (people stopped receiving my emails and I stopped receiving some emails and got inundated with quarantine warnings and other things I didn't understand). That's it. I jus

How KlineVision does AI technical analysis with Next.js + Gemini, draws it on the real candles, and verifies every call it makes after the fact — misses included. Most "AI stock analysis" tools confidently tell you a chart looks bullish and then never look back. I wanted the opposite: a tool that records every call it makes and later checks whether the market actually agreed — and publishes the hit rate, misses included. That one constraint — keep yourself honest — ended up shaping most of the interesting engineering. Here's how KlineVision is put together. What it does Type a ticker ( AAPL , 600519.SH , 0700.HK ) — or drop a chart screenshot. You get a structured read : trend, support/resistance, candlestick + chart patterns, and 缠论 (Chan theory) structure — drawn directly onto the real candles , not hand-waved in prose. Works across US, A-shares, and Hong Kong markets. The stack Next.js (App Router) on Vercel Supabase (Postgres + RLS) for data & auth Gemini 3 Flash for the analysis itself EODHD + Yahoo Finance for market data GitHub Actions + Vercel Cron for the background jobs PostHog for product analytics Now the parts that were actually interesting to build. 1. "Never analyze fake data" The market-data layer had a silent fallback: when a provider rate-limited, it returned synthetic candles so the UI never broke. Great for a demo, terrible for a product whose entire value is trust — the model would write a beautiful, confident analysis of a chart that never existed . The fix was to make the data layer fail honestly : Yahoo (primary) → EODHD (fallback) → if only demo data is available → 503, no analysis If we can't get real candles, the user gets "live market data temporarily unavailable" — not a hallucinated read. For a trust tool, a silent fallback to fake data is the worst bug on the board. 2. Make the AI show its work A text blob saying "there's a double bottom" isn't credible. You have to see it on the chart. So the model returns structured overlays keyed to

If you've ever built a file upload feature, you've probably hit this: a user uploads a photo from their iPhone, and your app breaks. No preview, no compression, just a silent failure — because the file is .heic and browsers can't read it. HEIC is Apple's default photo format since iOS 11. Every iPhone photo taken today is HEIC. And virtually every JS image compression library just ignores the problem. I spent a weekend building PixSqueeze to fix that. The problem with HEIC in the browser Browsers use the <canvas> API to compress images. You draw the image onto a canvas, call canvas.toBlob() , and get a compressed file back. Clean, client-side, zero server cost. The problem: canvas.drawImage() only works if the browser can decode the image first. And no major browser can decode HEIC natively — not Chrome, not Firefox, not even Safari on macOS (Safari on iOS can, but that doesn't help your web app). So when a user picks a HEIC file, your image element fires onerror , your canvas stays blank, and your compression pipeline silently does nothing. The solution: server-side conversion, then client-side compression PixSqueeze handles this in two stages: Stage 1 — Server converts the format HEIC (and TIFF, camera RAW) files get sent to a small Express server. The server uses heic-convert running in a dedicated worker thread to convert to JPEG. Worker threads matter here — HEIC decoding is CPU-intensive WASM work, and running it on the main event loop would block every other request. Stage 2 — Client compresses the result The converted JPEG comes back to the browser, where the normal canvas-based compression pipeline takes over. Quality, resize, watermark hooks — all the usual options. The detection is important too. You can't just check file.type — iOS often sets HEIC files with an empty MIME type. PixSqueeze checks the ISO Base Media File Format magic bytes directly: async function isHeicFile ( file ) { const buffer = await file . slice ( 0 , 12 ). arrayBuffer (); const byt

I have a hobby site that needs a good interface that allows quick scrolling. it will kinda work like an outline where user scrolls between items with ability to drill down probably 2 levels. but I'd like to be able to have both a condensed and card interface together. maybe if scrolling of the left of the screen its stays in condensed view so scrolling is quick but if scrolling on the right the item currently in the middle goes into card view with extended text describing the item in more detail. I might start working on something in jsfiddle to show better what I want, but gemini AI says codepen is better to prototype for smartphones. I would like to optimize the interface for smartphones either android or ios, but be reasonably functional on desktops. has anyone seen anything like this or have opinions about codepen? submitted by /u/LastCivStanding [link] [留言]

i hope this is the right place to ask...i am a photographer from the US. i know nothing about web hosting. my friend set up my website on media temple. godaddy acquired MT at least a year ago. i assume i can move my site to a different company. who is solid? thank you!! submitted by /u/filmAF [link] [留言]

AI in 2026 is no longer best understood as a technology trend. It has become a structural layer...

Before you vibe your app, vibe your pallette. Make a fork of shadecn or completely start from scratch. Or fork fluent / carbon. Whatever. Add more variables! Motion, shadow, outline, glow. Play around? Your basis will only be as creative as your basis is, but you can really expand that. I've had fun once the system is set up going through various "give me a theme that feels like sadness and morning sunshine" to "angry red" just to see what it gives me based on semantics. You have to do "that" at every point. How does your typography system work, your base color set, your architecture sets. But it's repeat movements through those. submitted by /u/TheSleepingOx [link] [留言]

Hello everyone, I am a Computer Science and UX design graduate. I was planning on applying for UX/UI positions but it seems that the market is very small especially for a junior designer. I was thinking going back to front end dev since it has more positions available. So I would like to ask people who are currently in the industry what's the best roadmap to become a frontend dev in 2026? Obviously the first thing to do is to refresh my memory on HTML, CSS and JS. What comes after that? Typescript and then React? And then what? submitted by /u/George-G661 [link] [留言]

Hey everyone, Let me give you a quick introduction about myself. I’m a software engineer with over 10 years of experience. I’ve worked extensively with React.js, Next.js, PostgreSQL, Redis, Node.js/Express, NestJS, Docker, and Go. Lately, in my free time, I’ve been diving deeper into system design, distributed systems, and learning how to build highly scalable applications. The thing is, the stack I’ve been working with is mostly enterprise-focused, and from what I’ve seen, it doesn’t always align well with the typical freelance market. Because of that, I’ve decided to start learning Laravel seriously and use it as a way to build a freelance business and work directly with clients. Of course, I know my previous experience will still be valuable, but here’s my question: I’m not looking for a job. I’m looking to start my own business, get clients, and eventually grow it into a company. So I figured this would be one of the best places to ask people who are already in the market. What’s the current state of the Laravel freelance market? Is it worth investing my time into? Are there enough opportunities and clients out there? For context, my goal is to eventually reach somewhere between $5k–$10k/month. I’d love to hear from people who are actively freelancing or running agencies in this space. submitted by /u/MahmoudElattar [link] [留言]

Prologue A while ago, I decided to develop a fully accessible main navigation component in React and write a series of articles documenting the steps it took to create a non-trivial accessible component. In my last development article , I covered using an array of navigation objects to determine conditions and shift focus between components. This article covers Tab Key navigation. Note : This article is one of a series demonstrating building a React navigational component from scratch while considering accessibility through the process. The articles are accompanied by a GitHub repository with releases tied to one or more articles; each builds on the previous one until a fully implemented navigation component is complete. Each release and its associated tag contain fully runnable code for the article. The code discussed in this article is available in the release. and may be downloaded at release 0.7.0 . Links in the article will take you to the proper file in the tagged GitHub Repository. Because the code for this release is scattered across the useNavigation hook, line numbers are added to make it easier to locate in the linked GitHub file. Line numbers are also provided for those who would like to follow along with a downloaded copy. While code examples are written in JavaScript for brevity, all actual code is written in Typescript and targets React 19.x, all while using vanilla CSS. Examples use Next.js v16.x, which is not required to run the navigation component. You can view the requirements for the Tab Handling Keyboard Release along with previous requirements. Content Links Introduction Acceptance Criteria Tab Key Handling Link Button Shift+ Tab Key Handling Link Button Introduction As I've mentioned in earlier articles, keyboard handling has two disparate audiences: those who can see the screen and those who rely on a screen reader. The arrow, home and end keys, for the most part, rely on a user knowing where they are and being able to discern where they wan

How I Published My Own Validation Package on npm As developers, we've all done this: if ( ! email ) { throw new Error ( " Email is required " ); } if ( typeof email !== " string " ) { throw new Error ( " Email must be a string " ); } if ( ! email . includes ( " @ " )) { throw new Error ( " Invalid email " ); } Now imagine doing this for: User Registration Login APIs Product Creation Payment Requests Admin Panels Microservices The validation code starts growing faster than the actual business logic. The Problem In many Node.js projects, validation ends up being: Repetitive Hard to maintain Inconsistent across APIs Difficult to scale Every endpoint contains similar checks: if ( ! name ) ... if ( ! email ) ... if ( ! password ) ... if ( password . length < 8 ) ... As projects grow, these validations become scattered throughout the codebase. Existing Solutions There are already some excellent validation libraries available: Zod Joi Yup Express Validator I've used many of them and they're great. But for some smaller projects and APIs, I wanted something: Lightweight Easy to understand Minimal setup Zero configuration TypeScript friendly That's what led me to build Zero Validation . Introducing Zero Validation Zero Validation is a lightweight schema validation package for Node.js and TypeScript applications. The goal is simple: Define your validation schema once and validate data consistently everywhere. Installation npm install zero-validation Basic Example import { z } from " zero-validation " ; const userSchema = z . object ({ name : z . string (), email : z . email (), age : z . number (), }); const result = userSchema . parse ({ name : " John " , email : " john@example.com " , age : 25 , }); console . log ( result ); Handling Validation Errors const result = userSchema . safeParse ( data ); if ( ! result . success ) { console . log ( result . errors ); } Instead of crashing your application, you can safely inspect validation errors and return meaningful API responses

Anyone working with several projects and an AI assistant knows the problem: in every repo you explain anew how you name things, what the layer architecture looks like, why you deliberately don't use this one library. The decisions were made long ago. But they live in your head, scattered across repos, and the assistant only ever knows the slice it currently sees. So I started putting that knowledge in one place where both I and Claude can find it. Why Outline – and why self-hosted The choice fell on Outline , self-hosted on its own subdomain. Three reasons tipped the scales. First: I want to keep my data with me and not depend on a vendor. A knowledge store that all my decisions flow into over the years is exactly the kind of asset you don't want in someone else's hands. Second: full data export, any time. If I want to move to a different system tomorrow, I take everything with me. No lock-in. Third: self-hosting opens up better options later – for instance my own RAG, should I ever want to go deeper into searching across my own body of knowledge. I don't need it right now. But the door is open, and that's worth the effort. The cookbook – the heart of it Separate from the individual projects sits its own collection: the cookbook. Cross-project, generic, and that's exactly what makes it valuable. This is where it says how I build, regardless of which product I'm sitting at right now. Roughly, it's split into a few areas: Conventions – naming, code style, docblocks, git commits, markdown, package manager, writing style. The boring but decisive things you'd otherwise re-discuss three times per project. Backend – layer architecture, a unified API error format, test strategy, migrations and indexes, i18n, async jobs and idempotency. Frontend / mobile – feature-first architecture ( core/ , shared/ , features/ ), design system, forms, networking, state, routing, storage, styling, testing. Deployment – my standard setup with Caddy as the edge and a Hetzner VPS. Templates –