标签：#webdev

I wanted AI code review I could actually own. Not access through a subscription or a black-box service with its own limits. The deployment, credentials, providers, and usage under my control. I kept hitting usage limits mid-week during deep building sessions. The models were capable. The workflow was useful. But access still depended on somebody else's weekly allowance, and centralized platforms can change whenever the company behind them decides to. Pricing, quotas, models, plan boundaries. A workflow that fits this month may sit behind another subscription next month. I could not find a reliable open-source option that gave me the ownership model I wanted. So I built one. That became Codra : A self-hosted AI review engine built around bring-your-own models, your own data boundary, and no Codra-imposed usage ceiling. What Codra Is Codra is an open-source, self-hosted AI code review engine for GitHub pull requests. It listens to pull request events, reviews changed files, posts inline findings, and provides a dashboard for jobs, repositories, model routing, history, usage, and failures. It runs on Cloudflare Workers and uses: Cloudflare Queues for review jobs PostgreSQL through Hyperdrive for storage KV for sessions and cache A React dashboard for operations The GitHub App, model credentials, database, and review history are yours. Provider keys are encrypted with AES-GCM using your deployment secret. Bring Your Own Model, Bring Your Own Limits Changing providers does not require replacing your review history, configuration, or workflow. You configure the provider and model. Supported: OpenAI-compatible APIs OpenRouter Anthropic Google / Gemini Cloudflare Workers AI Why Self-Hosted Matters Here A large frontend repo and a tiny backend repo should not need the same review strategy. Each repository gets its own review settings. You tune triggers, skip generated files, ignore drafts, use mention-triggered reviews, configure labels, set file limits, and define custom ru

TL;DR: We launched Tarotas, a tarot reading app, in five languages (Czech, Slovak, Polish, English, German) on a single domain. Each market behaved completely differently. Here is what the data showed us about multi-locale growth. When we started building Tarotas at Inithouse, the plan seemed straightforward: one product, five languages, one domain. Czech as the base, then Slovak, Polish, English, and German. Same cards, same readings, same UI. Just translated. What we did not expect: each locale acts like a separate product. The setup Tarotas is a tarot card app where you draw a card and read a calm, generic interpretation. No fortune telling, no sign-ups, no paywall. 78 cards across five languages, all on tarotas.com with language detection. We built it in Lovable and deployed it in under two weeks. The multi-language part took another week: content generation for 78 cards times 5 languages, plus locale-specific meta tags and URL structures. What the data told us The Czech and Slovak markets responded first. That was expected: our studio is based in Prague, our existing portfolio (products like zivafotka.cz and magicalsong.com ) already had traction in CZ/SK. But the interesting part was the divergence. CZ/SK users stayed longer. Session duration in Czech and Slovak was noticeably higher than in other locales. Users explored multiple cards, came back for second readings. The "reflection" positioning landed well in these markets, likely because tarot has a quiet cultural niche in Central Europe: not mainstream, but not fringe either. Polish users bounced faster but shared more. The PL locale had higher bounce rates but showed a different signal: social referrals. Polish users who did engage were more likely to share readings. The tarot community in Poland leans more social: Facebook groups, Instagram stories, TikTok readings. Our product caught some of that energy. German users barely showed up. DE was our weakest locale by far. German-language search demand for ta

When I started learning web development, I discovered that creating a webpage is more than making it look good. It is also important to make websites accessible and easy for everyone to use. Two concepts that helped me improve my website were semantic HTML and web accessibility. Semantic HTML means using HTML elements according to their purpose instead of using generic elements for everything. Semantic elements such as , , , , , and make the structure of a webpage clear. They improve readability, help search engines understand the content, and make websites easier for people using screen readers. Before (Non-Semantic HTML) My Website Welcome to my website. After (Semantic HTML) <h1>My Website</h1> Welcome to my website. The semantic version is much easier to understand because each element clearly describes its purpose. During my accessibility audit, I found several improvements that made my website more user-friendly. The first issue was that images needed descriptive alternative text. I added meaningful alt attributes so screen readers can describe the images to users who cannot see them. The second improvement was the heading hierarchy. I used one for the page title and organized the remaining sections with headings. This creates a logical structure that is easier to navigate. The third improvement involved descriptive links. Instead of using vague text, I changed links to clearly describe where they lead. For example, I used "Visit GitHub" instead of a generic phrase. I also ensured that the HTML document included the lang="en" attribute and that all form fields had properly associated elements. These small changes improve accessibility and usability for everyone. Working with semantic HTML and accessibility has shown me that building websites is not only about appearance but also about creating experiences that everyone can use. As I continue learning web development, I will continue applying these best practices in all my projects. My Portfolio Portfolio Websi

If you write software for a living and you're considering a trip to China in 2026, the friction you'll hit is not what you expect. The Great Firewall is the headline, but it's rarely what trips up a first-time visitor. What actually breaks your week is the small stuff: a QR code at a noodle shop, a metro turnstile that won't take your foreign card, a hotel Wi-Fi that quietly drops every request to Google. This is a brief survival guide written from a developer's mindset: what's actually changed in 2026, what you can fix before you leave, and what you should just accept. 1. Visa-free entry now covers most Western devs As of late 2025, China extended its 30-day visa-free transit policy to passport holders from 38 countries, including the US, UK, Germany, France, Australia, the Netherlands, and most of the EU. If you're flying in for a vacation, a conference, or even a short remote-work stretch, you may not need to apply for a visa at all — you just need an onward ticket within 30 days. The catch: the rules per nationality drift quarterly, and the official guidance is scattered across embassy pages. I keep a more current breakdown here: FirstTripChina visa-free guide — worth checking the week you book your ticket. 2. The payment problem is the real "API" you need to integrate China runs on two payment rails: Alipay and WeChat Pay. Cash is technically legal but vendors below the level of a 4-star hotel will look at you like you handed them a stone tablet. Foreign credit cards work at airports and big chains; they do not work at the dumpling place you actually want to eat at. The fix that exists in 2026 — and that did not exist three years ago — is "Tour Card" inside Alipay and "International" mode inside WeChat Pay. Both let you link a Visa/Mastercard issued outside China and pay via the same QR system locals use. Setup steps (roughly): Install Alipay (App Store / Play Store, US/EU regions both work). Verify with passport + selfie (KYC takes about 3 minutes). Tap Tour C

I replaced aaPanel/OpenLiteSpeed with Caddy and shell scripts and turned the process into a benchmark. Two phases (architecture then code), one external code review. The winning model? Not the one you'd expect.

The Idea Like a lot of people, I sometimes struggle with time. Not in an "I'm just bad at planning" way — more like my brain genuinely has a hard time feeling how long things take. Twenty minutes can feel like five. I'll think "I have time" right up until I definitely don't. So I built Ready. Ready is a PWA (a web app you can install on your phone like a native app) that counts down to your next event — but not just to the event itself. It counts down to when you need to leave, factoring in both how long it takes you to get ready and how long the journey takes. It sends you push notifications before it's time to move. So you don't accidentally forget about time, run out the door ..late again! The app was designed with time blindness in mind — a challenge many people experience. The tone is always encouraging, never stressful. No red warnings. No "you're late." Just a gentle nudge that has your back. It's also my portfolio project. I'm a junior developer learning in public, and this is me documenting the whole messy, rewarding process. (Which also happens to be great for recalling what you learned) The Stack — and Why I Chose It Before writing a single line of code, I had to decide what to build with. Here's what I landed on and why: Next.js — a framework built on top of React (a popular way to build web interfaces). I chose it because it handles both the frontend (what you see and click) and the backend (the logic running behind the scenes) in one project. Less setup, more building. Supabase — think of it as a database with superpowers. It handles storing your data and user authentication (logging in and out) out of the box. It has a generous free tier, which is great when you're learning. Tailwind CSS — instead of writing traditional CSS in separate files, Tailwind lets you style things directly in your code using short class names like rounded-full or text-teal-600 . Web Push API + Service Workers — A service worker is a small script that runs in the background of

Your site ranks on Google. Your Core Web Vitals are clean. Your meta tags are in order. And yet, when someone asks ChatGPT, Perplexity, or Google's AI Overview a question your business should answer your content doesn't show up. Not because your SEO is broken. Because AI search engines don't work like Google. Google Reads Pages. AI Search Reads Passages. Google crawls your page, indexes it, and ranks it based on signals like backlinks, domain authority, and keyword relevance. The unit of ranking is the page. AI search engines ChatGPT, Perplexity, Claude, Gemini don't rank pages. They retrieve passages. They pull specific chunks of content that directly answer a query, synthesize a response, and surface it to the user often without the user ever clicking through to your site. If your content isn't structured to be retrieved at the passage level, it gets skipped entirely. The page might exist. The answer might be buried somewhere in a 1,500-word article. But if the AI can't extract it cleanly and confidently, it moves on to content that makes its job easier. That's the invisibility problem. And most websites have no idea it's happening to them. The Crawler Problem Nobody Is Talking About Before we even get to content structure, there's a more fundamental issue. AI search engines have their own crawl agents. OpenAI sends GPTBot. Anthropic sends ClaudeBot. Perplexity sends PerplexityBot. These bots need access to your site before any retrieval can happen and a significant number of websites are blocking them without realizing it. This happens in a few ways: Blanket disallow rules in robots.txt. Many sites, especially those built on managed platforms, use wildcard disallow rules that were written for a different era when the only crawler worth worrying about was Googlebot. Those same rules now block AI crawlers by default. Overly aggressive bot protection. Security tools and CDN configurations that flag unusual crawl patterns will sometimes block AI bots before they even

Last year I was asked to investigate a startup's AWS bill. It had jumped from roughly $200/month to over $3,000 in a few weeks. Nobody knew why. After digging through logs, metrics, and database traffic, I found the culprit: a polling loop with no backoff strategy. The code looked harmless: async function processQueue () { const jobs = await getJobs () for ( const job of jobs ) { await processFile ( job ) } processQueue () } processQueue () At first glance, this seems reasonable. Process all available jobs, then check again. The problem appears when the queue is empty. When getJobs() returned no work, the loop immediately queried the database again. And again. And again. There was no delay, no backoff, and no event-driven trigger. As a result, the service continuously hammered the database looking for work that didn't exist. Each iteration generated: A database query Network traffic CPU usage Logging overhead Additional infrastructure load Individually, each operation was cheap. Executed hundreds of thousands of times per day, they became expensive. The fix was simple: async function processQueue () { while ( true ) { const jobs = await getJobs () for ( const job of jobs ) { await processFile ( job ) } await new Promise ( resolve => setTimeout ( resolve , 5000 )) } } Even better would have been replacing polling entirely with an event-driven design using a message queue. What this incident taught me: 1. Empty queues are production workloads. Many engineers optimize for peak traffic and forget about idle traffic. Systems often spend more time idle than busy. 2. Polling needs backoff. If you're polling, always define what happens when no work is found. 3. Cost bugs rarely look like bugs. Nothing crashed. No exceptions were thrown. The system was technically working exactly as written. It was just doing useless work 24/7. 4. Always monitor cost alongside performance. CPU, latency, and error rates looked normal. The AWS bill was the first real alert. One question I ask

Most "free developer tools" lists link to GitHub repos you need Node.js to run locally, or SaaS products with a login wall. Everything below runs in a browser tab, handles your data client-side or deletes it from the server within 30 minutes, and requires no account of any kind. All 26 tools are at at-use.com . Grouped by what you are actually trying to do. Encoding & Decoding Base64 Encoder/Decoder — Encode text or binary to Base64, or decode it back. UTF-8 text and binary file payloads both work. Runs in your browser — nothing sent to a server. URL Encoder/Decoder — Percent-encode strings for safe URL inclusion, or decode percent-encoded URLs back to readable text. Handles both application/x-www-form-urlencoded and RFC 3986 encoding modes. HTML Entity Encoder/Decoder — Convert special characters to named HTML entities ( < → &lt; , & → &amp; ) or decode entities back to characters. Useful when building template strings or sanitizing output for display. Binary Translator — Text to binary, binary to text, or translate between binary, decimal, hex, and octal. Useful for low-level debugging and learning number representations. Number Base Converter — Convert integers between binary (base 2), octal (base 8), decimal (base 10), and hexadecimal (base 16). All four outputs shown simultaneously. JWT Decoder — Paste a JWT token to decode and inspect the header and payload. Runs entirely in the browser — your token never leaves your machine. JSON & Text JSON Formatter & Validator — Format, validate, and minify JSON in one click. Toggle between pretty-print and compact output. Syntax errors include the exact line and column number. Uses browser-native JSON.parse() — no data sent anywhere. Text Diff — Side-by-side text comparison with no character limit (diffchecker.com caps at 25,000 characters on the free tier). JSON-aware mode auto-formats both inputs before diffing so whitespace differences do not pollute the output. Case Converter — 12 text case

Author: Alex Isa (Webappski). This is the dev-tutorial cut of a longer piece on the Webappski blog — terminal-first, fewer words on the why. If a buyer asks ChatGPT "best CDN providers 2026" and your product is not in the answer, you lose the sale before you ever see the lead. The only honest way to know whether that is happening is to ask the engines the questions your buyers ask and read the raw answers — not trust a single dashboard score. Here is the loop we at Webappski run for a client, with the open-source tool aeo-platform (MIT, zero runtime deps). 1. Install and point it at the client's domain npm install -g aeo-platform cd client-audit && aeo-tracker init init writes a .aeo-tracker.json . The three things that matter: { "brand" : "Northwind CDN" , // illustrative, fictional brand "domain" : "northwind.example" , // registrable domain — subdomains count, spoof hosts don't "engines" : [ "openai" , "gemini" , "anthropic" ], // ChatGPT, Gemini, Claude "queries" : [ "best CDN providers 2026" , "best low-latency video streaming CDN 2026" , "alternatives to the market-leading CDN 2026" ] } The questions ARE the audit. A basket of vanity phrases produces a flattering, useless number; a basket of the buyer's real decision questions produces a number that predicts revenue. Freeze it, so next month's run is comparable. 2. Run it — sampled, not one noisy shot AI answers are non-deterministic: ask the same question twice and you can get a different list. A single pass turns that noise into a fake-precise number. So run each cell several times and let the score carry a confidence interval instead of pretending one shot is the truth: # plain single-shot run aeo-tracker run # sample each cell N times — the score comes back with a Wilson confidence interval aeo-tracker run --samples = 5 With --samples=5 , every (query × engine) cell is queried five times; the headline presence rate is then reported as a Wilson interval, and small samples are flagged as small rather than so

OrderHub Day 4: never trust the client. Today the backend gets proper Bean Validation — bad requests are rejected at the edge with a clear 400, long before they reach the business logic. And it's all declarative. ✅ Try the validating form (see the 400 body): https://dev48v.infy.uk/orderhub/day4-validation.html Three DTOs, three jobs A common beginner mistake is using one class everywhere. OrderHub keeps them separate: Request DTO ( CreateOrderRequest ) — what the client sends, and where validation lives. Domain/Entity ( Order ) — the internal model. Response DTO ( OrderResponse ) — what the API returns, so internal fields never leak. Validation is just annotations public record CreateOrderRequest ( @NotBlank @Size ( max = 120 ) @CleanText String customer , @NotBlank @Size ( max = 200 ) @CleanText String item , @Min ( 1 ) @Max ( 1000 ) int quantity ) {} Add @Valid @RequestBody on the controller and Spring checks every rule before your method runs. Break one and it throws MethodArgumentNotValidException . A custom constraint + clean errors @CleanText is a custom ConstraintValidator (rejects blank-after-trim + a small blocklist) — you can write your own rules, not just the built-ins. A @RestControllerAdvice turns validation failures into a tidy 400 with a field→message map. (Day 5 upgrades this to full RFC-7807 ProblemDetail.) 🔨 Full walkthrough (constraints → @valid → custom validator → 400 handler) on the page: https://dev48v.infy.uk/orderhub/day4-validation.html OrderHub — a production-grade Spring Boot backend, one feature a day. 🌐 https://dev48v.infy.uk · Code: https://github.com/dev48v/order-hub-from-zero

Part 6 of a beginner-friendly series on learning Python from scratch. In Part 5 , we learned to organize data with lists, dictionaries, and other collections. Now it's time to organize our code itself. A function is a reusable block of code that performs a specific task. Instead of writing the same code multiple times, you write it once in a function, then call that function whenever you need it. This is the foundation of writing clean, maintainable programs. Defining and Calling Functions The basics def greet (): print ( " Hello, World! " ) greet () # Call the function Use def to define a function. The function name is followed by parentheses and a colon. The indented block below is the function's body. When you call the function (by typing its name with parentheses), Python runs the code inside it. Functions with parameters Most functions need information to work with. That's what parameters are for: def greet ( name ): print ( f " Hello, { name } ! " ) greet ( " Ramesh " ) # Hello, Ramesh! greet ( " Priya " ) # Hello, Priya! name is a parameter (placeholder). When you call greet("Ramesh") , name becomes "Ramesh" inside the function. Multiple parameters: def add ( x , y ): print ( x + y ) add ( 5 , 3 ) # 8 add ( 10 , 20 ) # 30 Return values A function can calculate something and give the result back to you with return : def add ( x , y ): return x + y result = add ( 5 , 3 ) print ( result ) # 8 The return statement stops the function and sends a value back. The caller can then use that value. def greet ( name ): message = f " Hello, { name } ! " return message greeting = greet ( " Ramesh " ) print ( greeting ) # Hello, Ramesh! A function can return multiple values as a tuple: def get_user_info (): return " Ramesh " , 25 , " Chennai " name , age , city = get_user_info () print ( name , age , city ) # Ramesh 25 Chennai Arguments: Positional vs Keyword There are two ways to pass values to a function: Positional arguments Arguments are matched by position: def describ

Last night I ran external security scans on the public websites of 10 leading Shopify and Shopify Plus agencies — the same scan any browser or attacker would see. No credentials, no special access. One agency scored an A. Three scored C- or below. The most common finding appeared on 9 of 10 sites. TL;DR 1 agency scored an A. 3 scored C- or below. 1 scored a D. The most common finding — missing security headers — appeared on 9 of 10 sites. 6 of 10 agencies have no HSTS at all. One agency has a session cookie without the Secure flag. That is the most concrete finding in the set. What was scanned Five categories per domain: TLS (HSTS presence and max-age), security headers (CSP, X-Frame-Options, X-Content-Type-Options, Referrer-Policy, Permissions-Policy), cookie flags, DNS hardening (DNSSEC and CAA) and sensitive exposure paths. All scans run on 23 June 2026. This covers the agencies' own marketing sites — not the client stores they build. Results Agency Domain Score Grade 1Digital Agency 1digitalagency.com 94 A Acidgreen acidgreen.com.au 77 B 30 Acres 30acres.com.au 76 B Fourmeta fourmeta.com 76 B Blend Commerce blendcommerce.com 76 B Elkfox elkfox.com 76 B Charle Agency charleagency.com 62 C Fyresite fyresite.com 62 C Eastside Co eastsideco.com 58 C- Swanky Agency swankyagency.com 55 C- Blubolt blubolt.com 54 D Per-agency notes 1Digital Agency — A (94) HSTS at two years, X-Content-Type-Options and Referrer-Policy set correctly, Permissions-Policy restricting camera, microphone and geolocation, CSP frame-ancestors in place of X-Frame-Options. Only gap is HSTS missing includeSubDomains. Acidgreen — B (77) HSTS with two-year max-age, includeSubDomains and preload — the strongest TLS config in the set. But CSP, X-Frame-Options, X-Content-Type-Options, Referrer-Policy and Permissions-Policy are all absent. Worth noting Acidgreen is multi-platform (Shopify Plus, Adobe Commerce, Magento) rather than Shopify-only. 30 Acres — B (76) A Shopify Plus Partner agency based in Byr

LinkedIn automation has a trust problem. Not with users — with LinkedIn itself. Most automation tools treat LinkedIn's API like an obstacle to route around. They send at fixed intervals, ignore behavioral limits, and optimize purely for volume. The result: accounts flagged within weeks, connection limits imposed, and in the worst cases — permanent bans. When we built SendCopy.ai, we approached this differently. Here is the technical breakdown of how we built LinkedIn outreach automation that actually protects accounts while scaling pipeline. The Core Problem: Behavioral Fingerprinting LinkedIn does not just monitor what you do — it monitors how you do it. Fixed-interval automation is trivially detectable. If your tool sends a connection request every 90 seconds with clockwork precision, LinkedIn's behavioral monitoring picks that up immediately. Human beings do not operate on fixed intervals. We get distracted, context-switch, move between tabs, have conversations in between tasks. The solution is not to slow down automation — it is to make it genuinely human-like. At SendCopy.ai, every action in a sequence uses variable timing — randomized within human-realistic ranges, distributed across natural working hours, and calibrated to each sender's historical activity patterns. Architecture: How We Handle Timing Variation The timing engine works on three levels: Level 1 — Action Delay Each individual action (send connection, send message, view profile) has a randomized delay pulled from a probability distribution weighted toward human behavior. Not a simple random range — a distribution that mirrors actual human activity patterns. Level 2 — Daily Activity Window Each sender account operates within a configurable activity window — typically 8–10 hours per day. Actions are distributed across this window with natural clustering around peak activity periods. Level 3 — Volume Ramp New sender accounts start with lower daily volumes and ramp up gradually over 2–4 weeks. This mi

Nine years ago, I built two versions of Highlander: an original jQuery application and a React/Redux version that used the same backend concepts. After successfully reviving and deploying the jQuery version, I turned to Highlander-react-redux. The goal was not simply to make an old repository run again. I wanted to improve the product, modernize its architecture without rewriting everything, and deploy something people could actually explore. This time, I used Turtle AI: a plan-driven engineering workflow built around Codex. It gave the AI explicit phases for planning, implementation, verification, testing, documentation, security review, and performance review. The process worked—but it also taught me that more guardrails do not automatically create a more efficient workflow. The Problem: More Than an Old React App The application had the typical problems of a nine-year-old project: Legacy React class components Complicated Redux connections Hardcoded localhost API URLs Authentication state disappearing after refresh Unprotected client routes Large Express route files mixing routing and business logic Inconsistent API errors No API versioning Limited filtering and pagination Outdated deployment assumptions UX gaps for demo users The app also had useful product ideas that had never been fully developed. Coaches could manage teams, players, and stats, but the experience needed stronger analytics, season support, collaboration, and more reliable workflows. I did not want to throw away the existing application and replace it with a new stack. The challenge was to preserve its original value while making targeted improvements. The Approach: Plan-Driven Product Engineering My previous Highlander revival prioritized: Get the app running locally Stabilize authentication and data Improve the demo experience Harden security Deploy For the React/Redux version, I followed a more structured workflow: Analyze the repository Create an implementation plan for one feature Implement

TL;DR — If your backend already uses OpenTelemetry, you can send traces and logs to Sentry by changing a few environment variables. No SDK swap, no instrumentation rewrite. Point your OTLP exporter at Sentry’s endpoint, add the Sentry SDK on the frontend for browser context, and you get one connected trace from click to backend span. You already instrumented the backend with OpenTelemetry. Your services emit spans. Your teams know the OTel APIs. Maybe you already run a Collector. So when you start evaluating Sentry, the obvious question is: Do you need to replace your OpenTelemetry setup with the Sentry SDK? No. The practical answer is usually: keep OpenTelemetry where it already works, add the Sentry SDK where it gives you more application context, and send OpenTelemetry Protocol (OTLP) events to Sentry. For a web app, that often means using the Sentry SDK on the frontend for browser tracing, errors, logs , Session Replay , and source maps, while keeping OpenTelemetry on the backend for existing service instrumentation. One scope note: OTLP can carry traces, logs, and metrics. At this moment, Sentry’s OTLP ingest supports logs and traces, not metrics. We’re considering adding support for them in the future. The important part is separating two decisions that often get lumped together: How traces stay connected across frontend and backend. How backend OTLP events are exported to Sentry. Once you separate those, the architecture gets a lot easier to reason about. Sentry vs OpenTelemetry is the wrong question The first decision is trace linking. If a user clicks a button in your React app and that click triggers a backend request, the frontend and backend need to agree on the same distributed trace context. In this example, the Sentry frontend SDK sends W3C traceparent headers (configurable through the propagateTraceparent option), and the OpenTelemetry backend continues the trace. That linking is handled by the frontend SDK configuration: Sentry . init ({ integration

10 Things Nobody Tells You About process.env I've burned myself on most of these so you don't have to. Here's what I wish someone had told me early on. 1. Keys are case-sensitive on Linux, case-insensitive on Windows process . env . PORT = " 3000 " console . log ( process . env . port ) // undefined on Linux, "3000" on Windows This one got me during a "works on my machine" incident. My Windows dev box ran fine. The Linux CI server crashed because a teammate typed env.port instead of env.PORT . Your CI runs Linux. Your dev box probably runs macOS or Windows. Case-sensitivity differences will bite you. How to handle it : Use a validation layer that throws on missing keys. A simple getEnv("PORT") will catch typos at startup. 2. Values are always strings console . log ( typeof process . env . PORT ) // "string" even if you set PORT=3000 Number(process.env.PORT) can return NaN without throwing. Boolean values like "false" are truthy strings. How to handle it : Always parse. If you use a schema library like CtroEnv, it coerces types and throws on invalid input. 3. process.env is NOT the same as .env This confused me for way too long. process.env is whatever the shell gave the process. A .env file is just a text file dotenv reads to populate process.env . Node doesn't touch .env files on its own. // This won't read .env automatically console . log ( process . env . MY_VAR ) // undefined How to handle it : Call dotenv.config() at entry, or use @ctroenv/node which loads .env files automatically. 4. You can set env vars per-command PORT = 4000 node app.js This sets PORT only for that single process. It doesn't pollute your shell session. Super useful for one-off runs or testing different configurations without editing files. console . log ( process . env . PORT ) // "4000" 5. process.env is mutable at runtime process . env . DATABASE_URL = " postgres://hacker:gotme@evil.com/db " I've seen code that modifies process.env to "fix" config at runtime. Don't do this. If something i

The first text message ever sent was not a love note, a meeting reminder, or a meme. It was a Christmas greeting. On December 3, 1992, a 22-year-old engineer named Neil Papworth sat at a desktop computer, typed two words, and sent the world's first SMS to a mobile phone: "Merry Christmas." More than thirty years later, that humble two-word message has grown into one of the most quietly important protocols in connected technology, and it still shows up in the IoT devices we build today. The engineer who sent the first SMS Neil Papworth was working for the Anglo-French firm Sema Group Telecoms, part of a team building a Short Message Service Centre (SMSC) for the British carrier Vodafone. The SMSC was the piece of infrastructure that would store and forward text messages across the cellular network. To prove it worked, Papworth sent a test message from a computer terminal to the Orbitel 901 handset of Richard Jarvis, a Vodafone director who was at a company Christmas party. The message arrived. Jarvis read it. But he could not reply, because mobile phones at the time had no way to compose a text. There was no keypad-driven messaging app, no T9, no touchscreen. SMS started life as a one-way novelty riding on a spare slice of the network's signalling channel, and almost nobody involved thought it would matter very much. Why SMS was designed the way it was The technical detail that makes this story relevant to anyone building connected hardware is how SMS was engineered. Text messages were squeezed into the control channel that phones already used to talk to cell towers, the same channel that handles things like call setup. That is why a single SMS is capped at 160 characters: it had to fit inside a small, fixed-size signalling packet. This constraint turned out to be a feature. SMS is lightweight, store-and-forward, and works even when a data connection is weak or absent. The message waits in the SMSC until the device is reachable, then gets delivered. No persistent con

Developers inheriting sprawling SQL codebases or revisiting queries from weeks earlier know the frustration: a dense, unformatted block that obscures joins, filters, and logical flow. Readable SQL isn’t cosmetic — it directly affects debugging speed, peer review accuracy, and long-term maintainability. What it is SQL Formatter restructures raw SQL into clear, conventionally formatted code, running entirely in the browser. It applies consistent indentation, capitalisation of keywords, and logical line breaks — all without altering the query’s semantics. The formatter understands the syntax of all major database engines, including PostgreSQL, MySQL, SQL Server, and Oracle, so it preserves dialect-specific functions and operators rather than flattening them into a generic style. The tool is one of 200+ free browser utilities on DevTools. It processes all input entirely on your machine — no data ever leaves the browser, no account is required, and no analytics track your usage. That privacy-first design means you can safely format queries that contain proprietary business logic embedded in production SQL. The engine handles the full spectrum of SQL complexity: basic SELECT statements, multi-table joins, Common Table Expressions (CTEs), correlated subqueries, window functions, and DML operations like INSERT or UPDATE . Because it parses the input rather than applying regular expressions, deeply nested constructs retain their hierarchy, with each subquery or CTE level indented to show ownership. How to use it Paste any SQL fragment into the left-hand editor and the formatted result appears instantly in the output panel. A live preview updates as you switch formatting options, so you can tune the output without re-pasting. The primary configuration controls help you match your team’s conventions or personal preference: Dialect : selecting a specific database ensures that functions such as PostgreSQL’s STRING_AGG or MySQL’s GROUP_CONCAT are not inadvertently mangled, and th

As developers, we've all been there. Q: Need to decode a Base64 string? Open one website. Q: Need to convert an image to Base64? Open another website. Q: Need to validate a Base64 string? Search Google again. Q: Need to compare two Base64 values? Yet another tool. I found myself repeatedly switching between different websites, browser tabs, and terminal commands just to perform simple Base64-related tasks. So I decided to build something that solved this problem for me. The Goal Keep every commonly used Base64 utility in one place and make it work directly in the browser. No installations. No command-line knowledge required. No account creation. Just open the website and use the tool What You'll Find Instead of only providing an encoder and decoder, I wanted to cover the complete Base64 workflow. Some of the available tools include: Base64 Encode / Decode Image to Base64 Audio to Base64 Video to Base64 Base64 Validator Base64 Detector Base64 Compare Base64 Repair Base64 URL Encode Base64 File Decoder CSS Data URI Converter And more are being added regularly. Why I Built It Honestly, this started as a personal productivity project. I was using different Base64 tools almost every week and got tired of bookmarking multiple websites for related tasks. Having everything in one place turned out to be surprisingly useful, so I decided to make it public. Give It a Try https://base64converters.com I'm continuously improving it and would love feedback from fellow developers. Are there any Base64-related tools or workflows you use frequently that should be included?