<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Golam Mostafa</title>
    <description>The latest articles on DEV Community by Golam Mostafa (@golam_mostafa).</description>
    <link>https://dev.to/golam_mostafa</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F587116%2F13962b16-f8b3-4883-88e0-5aafc87cd53a.png</url>
      <title>DEV Community: Golam Mostafa</title>
      <link>https://dev.to/golam_mostafa</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/golam_mostafa"/>
    <language>en</language>
    <item>
      <title>Self-Hosted vs. Managed: Coolify Against Vercel, Heroku, Netlify, and Railway</title>
      <dc:creator>Golam Mostafa</dc:creator>
      <pubDate>Mon, 15 Jun 2026 18:49:59 +0000</pubDate>
      <link>https://dev.to/golam_mostafa/self-hosted-vs-managed-coolify-against-vercel-heroku-netlify-and-railway-3bmd</link>
      <guid>https://dev.to/golam_mostafa/self-hosted-vs-managed-coolify-against-vercel-heroku-netlify-and-railway-3bmd</guid>
      <description>&lt;p&gt;&lt;em&gt;How our team thought through whether to run our own deployment platform or keep paying for someone else's. Pricing and feature details verified June 2026 — these change often, so we always recheck the vendor's pricing page before committing.&lt;/em&gt;&lt;/p&gt;




&lt;h2&gt;
  
  
  Why we wrote this
&lt;/h2&gt;

&lt;p&gt;If we ship web apps, we eventually hit the same fork in the road. We can hand our infrastructure to a managed Platform-as-a-Service (PaaS) — Vercel, Heroku, Netlify, Railway — and pay a monthly bill that scales with usage. Or we can run an open-source, self-hostable PaaS like &lt;strong&gt;Coolify&lt;/strong&gt; on a server we own and pay only for the hardware.&lt;/p&gt;

&lt;p&gt;The managed platforms give us convenience: we push our code, and global infrastructure, scaling, SSL, and databases are handled. The self-hosted route gives us control and a flat, predictable cost — at the price of doing our own operations.&lt;/p&gt;

&lt;p&gt;This post breaks down what each managed platform actually does, what it costs, and where it shines or stings. Then it does the same for Coolify, and finishes with a clear "what we can and cannot do" view of each side.&lt;/p&gt;




&lt;h2&gt;
  
  
  First, the two models in one paragraph
&lt;/h2&gt;

&lt;p&gt;A &lt;strong&gt;managed PaaS&lt;/strong&gt; abstracts the server away entirely. We never SSH into a machine; we push to Git and the platform builds, deploys, scales, and serves our app from its own infrastructure. We pay per seat, per usage, or both. A &lt;strong&gt;self-hosted PaaS&lt;/strong&gt; like Coolify is a control panel we install on &lt;em&gt;our own&lt;/em&gt; VPS or bare metal. It gives us the same git-push-to-deploy experience, automatic SSL, and a dashboard — but the servers, the uptime, the backups, and the security patching are ours to own. The software is free; the server is our only bill.&lt;/p&gt;




&lt;h2&gt;
  
  
  Vercel
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;What it is:&lt;/strong&gt; The frontend platform of choice for Next.js and modern JavaScript frameworks. Vercel is built around serverless functions, a global edge network, and an exceptional developer experience.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;What we can do with it:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Push to Git and get automatic builds, preview URLs for every pull request, and instant production deploys.&lt;/li&gt;
&lt;li&gt;Serve from a global edge CDN with very low latency worldwide.&lt;/li&gt;
&lt;li&gt;Run serverless functions and edge middleware close to our users.&lt;/li&gt;
&lt;li&gt;Use Next.js-specific features like Incremental Static Regeneration (ISR), image optimization, and edge config.&lt;/li&gt;
&lt;li&gt;Automatic HTTPS/SSL and zero-config deployments.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Pricing (June 2026):&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Hobby&lt;/strong&gt; — free, but &lt;strong&gt;non-commercial only&lt;/strong&gt;. If our app earns money, Vercel requires an upgrade.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Pro&lt;/strong&gt; — $20 per user per month, with $20 of usage credit per seat and 1 TB of bandwidth included. A 5-person team pays $100/month in seats &lt;em&gt;before any traffic&lt;/em&gt;.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Enterprise&lt;/strong&gt; — custom pricing, often starting in the five-figures-per-year range, with SSO, SLAs, and audit logs.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;What to watch:&lt;/strong&gt; Vercel's real cost is usage-based and can catch us off guard. Above the included tiers, we pay for Fast Data Transfer (~$0.15/GB), Edge Requests (~$2 per million), function execution, and image optimization. A growing SaaS app can run a few hundred dollars a month. On the free Hobby plan, hitting the limits takes the site &lt;em&gt;offline&lt;/em&gt; until the next billing cycle rather than charging overages.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Best for:&lt;/strong&gt; Frontend-heavy teams, Next.js apps, and anyone who values speed-to-ship and global performance over infrastructure control.&lt;/p&gt;




&lt;h2&gt;
  
  
  Heroku
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;What it is:&lt;/strong&gt; The platform that popularized git-push deployment back in 2007. Now owned by Salesforce, it remains a polished, full-stack PaaS — but it's no longer cheap, and the free tier is gone.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;What we can do with it:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Deploy full-stack apps in nearly any language using "dynos" (its container units).&lt;/li&gt;
&lt;li&gt;Attach a large ecosystem of add-ons (Postgres, Redis, monitoring, etc.) with a few clicks.&lt;/li&gt;
&lt;li&gt;Scale horizontally by adding more dynos (on Standard tier and above).&lt;/li&gt;
&lt;li&gt;Tight Salesforce integration via Heroku Connect for teams in that ecosystem.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Pricing (June 2026) — no free tier:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Eco&lt;/strong&gt; — $5/month for 1,000 dyno hours shared across the account; dynos sleep after 30 minutes of inactivity. Good for hobby/non-production.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Basic&lt;/strong&gt; — $7/month per dyno, always-on, no sleep.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Standard&lt;/strong&gt; — $25–$50/month per dyno, with horizontal scaling, metrics, and preboot.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Performance&lt;/strong&gt; — $250–$500/month per dyno for high-traffic, dedicated workloads.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Add-ons billed separately:&lt;/strong&gt; Postgres, Redis, and others stack on top of dyno costs.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;What to watch:&lt;/strong&gt; Costs compound fast because dynos, databases, Redis, and add-ons are each billed independently. The filesystem is ephemeral (data is wiped on restart), which forces adoption of managed Postgres/Redis. Enterprise pricing is opaque and negotiated.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Best for:&lt;/strong&gt; Teams that value a mature, battle-tested platform and simplicity over cost, especially those already in the Salesforce ecosystem.&lt;/p&gt;




&lt;h2&gt;
  
  
  Netlify
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;What it is:&lt;/strong&gt; The Jamstack pioneer — built for static sites, frontend apps, and serverless functions, with Git-based CI/CD and a built-in CDN.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;What we can do with it:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Deploy static sites and frontend frameworks with Git-based continuous deployment.&lt;/li&gt;
&lt;li&gt;Get unlimited deploy previews, custom domains with SSL, and form handling out of the box.&lt;/li&gt;
&lt;li&gt;Run serverless functions and edge functions.&lt;/li&gt;
&lt;li&gt;Use a managed Postgres database and basic firewall rules even on the free tier.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Pricing (June 2026) — credit-based model:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Free&lt;/strong&gt; — $0, with 300 credits/month, 100 GB bandwidth, 300 build minutes, custom domains, and unlimited preview deploys. Genuinely usable for small sites.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Personal&lt;/strong&gt; — $9/month with 1,000 credits.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Pro&lt;/strong&gt; — $20/month flat with 3,000 credits and, as of April 2026, &lt;strong&gt;unlimited team seats&lt;/strong&gt; (Netlify dropped per-seat pricing).&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Enterprise&lt;/strong&gt; — custom pricing for compliance and advanced security.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;What to watch:&lt;/strong&gt; The credit model bundles bandwidth, build minutes, and function invocations into one allowance — flexible, but it takes a minute to reason about. Exceed credits and we auto-recharge (paid plans) or the site pauses (free plan). Complex backends aren't its strength.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Best for:&lt;/strong&gt; Static sites, Jamstack apps, content-heavy frontends, and small teams that want a generous free tier and flat team pricing.&lt;/p&gt;




&lt;h2&gt;
  
  
  Railway
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;What it is:&lt;/strong&gt; A modern, usage-based PaaS positioned as the cleaner, cheaper answer to Heroku's dyno model. Strong developer experience, native databases, and billing that tracks actual usage.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;What we can do with it:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Auto-detect our stack and deploy with near-zero config (Next.js, Django, Rails, Rust, and more).&lt;/li&gt;
&lt;li&gt;Spin up PostgreSQL, MySQL, MongoDB, or Redis with one click — billed as part of usage.&lt;/li&gt;
&lt;li&gt;Get preview environments per pull request, an environment-variables UI, logs, and metrics.&lt;/li&gt;
&lt;li&gt;Set hard monthly spend caps (Pro) so the bill can't run away.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Pricing (June 2026) — usage-based with included credits:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Trial&lt;/strong&gt; — no permanent free tier; a 30-day trial with $5 one-time credit, no card required.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Hobby&lt;/strong&gt; — $5/month, which &lt;em&gt;includes&lt;/em&gt; $5 of usage credits (single-developer workspaces).&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Pro&lt;/strong&gt; — $20/month, including $20 of credits, unlimited workspace seats, and spend limits.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Enterprise&lt;/strong&gt; — custom, with a ~$2,000/month minimum, plus compliance (HIPAA/SOC 2), dedicated infra, and BYOC.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;What to watch:&lt;/strong&gt; Usage-based billing rewards efficiency but trades predictability — a database-heavy app can exceed its credit allowance, so we'd keep an eye on the usage dashboard. Most real production apps land around $20–$50/month.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Best for:&lt;/strong&gt; Developers and startups who want Heroku-like simplicity with modern, consumption-based pricing and don't mind monitoring usage.&lt;/p&gt;




&lt;h2&gt;
  
  
  Coolify — the self-hosted option
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;What it is:&lt;/strong&gt; An open-source, self-hostable PaaS (Apache 2.0 license) that we install on any server with an SSH connection — a VPS, bare metal, a Raspberry Pi, even an old laptop. It hit a stable v4.0 in 2026, has 55,000+ GitHub stars, and is the most popular self-hosted PaaS available. The community has shifted from calling it a "Heroku alternative" to a "self-hosted Vercel."&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;What we can do with it:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Git push to deploy&lt;/strong&gt; from GitHub, GitLab, Bitbucket, or Gitea — including self-hosted Git.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Automatic, auto-renewing SSL&lt;/strong&gt; via Let's Encrypt for our custom domains.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;One-click deploy of 280+ services&lt;/strong&gt; — databases (PostgreSQL, MySQL, MongoDB, Redis, ClickHouse), workflow tools (n8n), and more — plus anything that runs in Docker.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Multi-server orchestration&lt;/strong&gt; from a single dashboard.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Preview deployments per branch — including the backend and per-branch databases&lt;/strong&gt;, which Vercel itself can't do.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Automatic database backups&lt;/strong&gt; to any S3-compatible storage.&lt;/li&gt;
&lt;li&gt;A &lt;strong&gt;powerful API, a CLI, and a browser-based real-time terminal&lt;/strong&gt; for managing servers without leaving the dashboard.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Team collaboration&lt;/strong&gt; with roles and permissions, monitoring, and notifications via Discord, Telegram, or email.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;No vendor lock-in&lt;/strong&gt; — all settings live on our own server.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Pricing (June 2026):&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Self-hosted&lt;/strong&gt; — free forever, all features included, no per-seat fees and no feature gates. We pay only for the server. A capable VPS (e.g., Hetzner, ~4 vCPU / 8 GB RAM) runs roughly $6–$25/month. Real-world reports describe dropping from ~$150/month on managed platforms to under $30/month.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Coolify Cloud&lt;/strong&gt; — $5/month for up to 2 connected servers (+$3/month per additional server), with a 20% annual discount. Important nuance: Cloud manages the &lt;em&gt;Coolify control plane&lt;/em&gt; (the dashboard, updates, backups) — &lt;strong&gt;we still bring and pay for our own servers.&lt;/strong&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Where it falls short — the honest cons:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;No global edge network or CDN.&lt;/strong&gt; Our app runs in one region unless we put Cloudflare (or similar) in front of it.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;No Incremental Static Regeneration and no edge-middleware runtime.&lt;/strong&gt; If we rely on Vercel-specific edge features, we'd need to rewrite them.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;No true serverless "scale to zero."&lt;/strong&gt; Coolify runs long-lived containers and has a minimum footprint (roughly 2 CPU / 2 GB RAM), so it's not a FaaS replacement. (For functions, we'd pair it with something like Supabase, Cloud Run, or Lambda.)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;No built-in observability.&lt;/strong&gt; No analytics, error tracking, session replay, or uptime monitoring out of the box — a production-grade observability stack adds roughly $150+/month if we want it.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;We own the operations.&lt;/strong&gt; Patching, uptime, scaling decisions, and security are on us. A single-server setup is a single point of failure; real production needs multi-server planning.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Security and compliance are our responsibility.&lt;/strong&gt; Coolify has had at least one CVE on record and is generally not a fit out-of-the-box for regulated SOC 2 / HIPAA workloads.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;There's a learning curve&lt;/strong&gt; if our team is light on DevOps/Docker experience.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Best for:&lt;/strong&gt; Technically capable teams like ours that want full infrastructure control, data sovereignty, predictable flat costs, and freedom from vendor lock-in — and have (or are willing to build) the DevOps bandwidth to run it.&lt;/p&gt;




&lt;h2&gt;
  
  
  Head-to-head at a glance
&lt;/h2&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Dimension&lt;/th&gt;
&lt;th&gt;Vercel&lt;/th&gt;
&lt;th&gt;Heroku&lt;/th&gt;
&lt;th&gt;Netlify&lt;/th&gt;
&lt;th&gt;Railway&lt;/th&gt;
&lt;th&gt;Coolify&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;Model&lt;/td&gt;
&lt;td&gt;Managed&lt;/td&gt;
&lt;td&gt;Managed&lt;/td&gt;
&lt;td&gt;Managed&lt;/td&gt;
&lt;td&gt;Managed&lt;/td&gt;
&lt;td&gt;Self-hosted&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Primary strength&lt;/td&gt;
&lt;td&gt;Frontend / Next.js&lt;/td&gt;
&lt;td&gt;Full-stack, mature&lt;/td&gt;
&lt;td&gt;Jamstack / static&lt;/td&gt;
&lt;td&gt;Full-stack, usage-based&lt;/td&gt;
&lt;td&gt;Full control, any Docker app&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Free tier&lt;/td&gt;
&lt;td&gt;Yes (non-commercial)&lt;/td&gt;
&lt;td&gt;No&lt;/td&gt;
&lt;td&gt;Yes (generous)&lt;/td&gt;
&lt;td&gt;Trial only ($5)&lt;/td&gt;
&lt;td&gt;Software free; pay for server&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Entry paid price&lt;/td&gt;
&lt;td&gt;$20/user/mo&lt;/td&gt;
&lt;td&gt;$5/mo (Eco)&lt;/td&gt;
&lt;td&gt;$9/mo (Personal)&lt;/td&gt;
&lt;td&gt;$5/mo (Hobby)&lt;/td&gt;
&lt;td&gt;~$6–25/mo (VPS)&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Pricing predictability&lt;/td&gt;
&lt;td&gt;Usage can spike&lt;/td&gt;
&lt;td&gt;Stacks fast&lt;/td&gt;
&lt;td&gt;Credit-based&lt;/td&gt;
&lt;td&gt;Usage-based&lt;/td&gt;
&lt;td&gt;Flat / predictable&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Global edge CDN&lt;/td&gt;
&lt;td&gt;Yes&lt;/td&gt;
&lt;td&gt;No (single region)&lt;/td&gt;
&lt;td&gt;Yes&lt;/td&gt;
&lt;td&gt;No (single region)&lt;/td&gt;
&lt;td&gt;No (add Cloudflare)&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Serverless functions&lt;/td&gt;
&lt;td&gt;Yes&lt;/td&gt;
&lt;td&gt;Limited&lt;/td&gt;
&lt;td&gt;Yes&lt;/td&gt;
&lt;td&gt;Via services&lt;/td&gt;
&lt;td&gt;Not native (workarounds)&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Scale to zero&lt;/td&gt;
&lt;td&gt;Yes&lt;/td&gt;
&lt;td&gt;Eco sleeps&lt;/td&gt;
&lt;td&gt;Yes&lt;/td&gt;
&lt;td&gt;Yes&lt;/td&gt;
&lt;td&gt;No&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Managed databases&lt;/td&gt;
&lt;td&gt;Add-on&lt;/td&gt;
&lt;td&gt;Add-on&lt;/td&gt;
&lt;td&gt;Postgres included&lt;/td&gt;
&lt;td&gt;One-click, native&lt;/td&gt;
&lt;td&gt;We run them (or connect Neon, etc.)&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Built-in observability&lt;/td&gt;
&lt;td&gt;Yes&lt;/td&gt;
&lt;td&gt;Add-ons&lt;/td&gt;
&lt;td&gt;Some&lt;/td&gt;
&lt;td&gt;Yes&lt;/td&gt;
&lt;td&gt;No (add our own)&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Backend / long-running jobs&lt;/td&gt;
&lt;td&gt;Limited&lt;/td&gt;
&lt;td&gt;Yes&lt;/td&gt;
&lt;td&gt;Limited&lt;/td&gt;
&lt;td&gt;Yes&lt;/td&gt;
&lt;td&gt;Yes&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Per-branch backend + DB previews&lt;/td&gt;
&lt;td&gt;No&lt;/td&gt;
&lt;td&gt;No&lt;/td&gt;
&lt;td&gt;No&lt;/td&gt;
&lt;td&gt;Partial&lt;/td&gt;
&lt;td&gt;Yes&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Data sovereignty / on-prem&lt;/td&gt;
&lt;td&gt;No&lt;/td&gt;
&lt;td&gt;No&lt;/td&gt;
&lt;td&gt;No&lt;/td&gt;
&lt;td&gt;BYOC (Enterprise)&lt;/td&gt;
&lt;td&gt;Yes (fully)&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Vendor lock-in&lt;/td&gt;
&lt;td&gt;High&lt;/td&gt;
&lt;td&gt;High&lt;/td&gt;
&lt;td&gt;Medium&lt;/td&gt;
&lt;td&gt;Medium&lt;/td&gt;
&lt;td&gt;None&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Ops burden on us&lt;/td&gt;
&lt;td&gt;None&lt;/td&gt;
&lt;td&gt;None&lt;/td&gt;
&lt;td&gt;None&lt;/td&gt;
&lt;td&gt;None&lt;/td&gt;
&lt;td&gt;High&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;




&lt;h2&gt;
  
  
  What we CAN and CANNOT do: paid platforms vs. Coolify
&lt;/h2&gt;

&lt;h3&gt;
  
  
  With the paid platforms, we CAN:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Ship globally with edge CDNs and serverless functions with effectively zero operations work.&lt;/li&gt;
&lt;li&gt;Auto-scale from zero to large traffic spikes without touching a server.&lt;/li&gt;
&lt;li&gt;Lean on managed databases with built-in backups and high availability.&lt;/li&gt;
&lt;li&gt;Get compliance certifications (SOC 2, HIPAA on higher tiers), DDoS protection, and SLAs.&lt;/li&gt;
&lt;li&gt;Use platform-specific magic — Vercel's ISR and edge middleware, Netlify's form handling, Heroku's add-on marketplace.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  With the paid platforms, we CANNOT (easily):
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Predict the bill with certainty once usage scales — costs are tied to traffic, seats, and execution.&lt;/li&gt;
&lt;li&gt;Keep our data fully on our own infrastructure or on-premises (except Railway/others' enterprise BYOC).&lt;/li&gt;
&lt;li&gt;Escape vendor lock-in — platform-specific features mean migration has real switching costs.&lt;/li&gt;
&lt;li&gt;Run arbitrary long-lived or unusual workloads cheaply (serverless timeouts and per-resource billing get in the way).&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  With Coolify, we CAN:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Run unlimited apps and databases on one server for a flat, predictable monthly cost.&lt;/li&gt;
&lt;li&gt;Deploy &lt;em&gt;any&lt;/em&gt; Docker-compatible service, plus 280+ one-click templates.&lt;/li&gt;
&lt;li&gt;Keep 100% of our data on infrastructure we own — full sovereignty, no lock-in.&lt;/li&gt;
&lt;li&gt;Get git-push deploys, auto-SSL, multi-server management, and per-branch previews that include the backend &lt;em&gt;and&lt;/em&gt; a database.&lt;/li&gt;
&lt;li&gt;Run long-lived processes (schedulers, bots, AI pipelines) that serverless timeouts would kill.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  With Coolify, we CANNOT (without extra work):
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Serve from a global edge network or use true serverless scale-to-zero out of the box.&lt;/li&gt;
&lt;li&gt;Get built-in analytics, error tracking, or uptime monitoring (we assemble our own stack).&lt;/li&gt;
&lt;li&gt;Offload operations — uptime, patching, scaling, and security are our team's job.&lt;/li&gt;
&lt;li&gt;Treat it as turnkey for regulated SOC 2 / HIPAA workloads without significant hardening.&lt;/li&gt;
&lt;li&gt;Use Vercel-/Netlify-specific edge features without rewriting them.&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  So which should we choose?
&lt;/h2&gt;

&lt;p&gt;There's no universal winner — it depends on what we're optimizing for.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Vercel&lt;/strong&gt; — when we live in the Next.js/frontend world and want the best developer experience and global performance, and we accept usage-based billing.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Netlify&lt;/strong&gt; — when we build Jamstack/static sites and want a genuinely generous free tier and flat team pricing.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Heroku&lt;/strong&gt; — when we want a mature, simple, full-stack platform and cost is secondary to reliability and the add-on ecosystem.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Railway&lt;/strong&gt; — when we want Heroku-style simplicity with modern, pay-for-what-we-use pricing and native databases.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Coolify&lt;/strong&gt; — when we have (or want to build) the DevOps capability, value control and data ownership, and want to convert a variable cloud bill into a flat, low server cost — which is exactly our case as we deploy our own services on our own infrastructure.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The honest summary: the managed platforms give us &lt;strong&gt;time and zero operations&lt;/strong&gt;; Coolify gives us &lt;strong&gt;control and a low, predictable cost&lt;/strong&gt;. The right answer is whichever of those two our team is shorter on.&lt;/p&gt;




&lt;p&gt;&lt;em&gt;Pricing and feature details reflect June 2026 and are subject to change. We verify current numbers on each vendor's pricing page before making a decision.&lt;/em&gt;&lt;/p&gt;

</description>
      <category>devops</category>
      <category>infrastructure</category>
      <category>opensource</category>
      <category>webdev</category>
    </item>
    <item>
      <title>I state "You will love it - React Query".</title>
      <dc:creator>Golam Mostafa</dc:creator>
      <pubDate>Wed, 08 Oct 2025 04:29:29 +0000</pubDate>
      <link>https://dev.to/golam_mostafa/react-query-i-state-you-will-love-it-3oka</link>
      <guid>https://dev.to/golam_mostafa/react-query-i-state-you-will-love-it-3oka</guid>
      <description>&lt;h1&gt;
  
  
  🚀 ভালো লাগার আরও একটি utility: React Query
&lt;/h1&gt;

&lt;p&gt;React Query use করলে &lt;strong&gt;API fetch, cache, update&lt;/strong&gt; সব সহজ। RTK Query ঠিক আছে, কিন্তু complex scenario-এ clumsy হতে পারে।&lt;/p&gt;




&lt;h2&gt;
  
  
  👉 API Fetching সহজ
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;data&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;isLoading&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;error&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;useQuery&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;todos&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;],&lt;/span&gt; &lt;span class="nx"&gt;fetchTodos&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;শুধু useQuery বা useMutation call করতে হবে।&lt;br&gt;
Background-এ fetch, retry, error handling auto।&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;RTK Query:&lt;/strong&gt; Multiple queries বা complex retry verbose।&lt;/p&gt;




&lt;h2&gt;
  
  
  👉 Caching &amp;amp; Stale Data
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;data&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;useQuery&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;projects&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;page&lt;/span&gt;&lt;span class="p"&gt;],&lt;/span&gt; &lt;span class="nx"&gt;fetchProjects&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="na"&gt;staleTime&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mi"&gt;5000&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="na"&gt;keepPreviousData&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;
&lt;span class="p"&gt;})&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Flicker কমায়, pagination smooth।&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;RTK Query:&lt;/strong&gt; Requires more manual work than React Query.&lt;/p&gt;




&lt;h2&gt;
  
  
  👉 Updating &amp;amp; Mutations
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;mutation&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;useMutation&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;updateTodo&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="na"&gt;onSuccess&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;queryClient&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;invalidateQueries&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;todos&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;])&lt;/span&gt;
&lt;span class="p"&gt;})&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;onSuccess, onError, onSettled দিয়ে cache automatically invalidate।&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;RTK Query:&lt;/strong&gt; Tag system use করতে হয়, একটু verbose।&lt;/p&gt;




&lt;h2&gt;
  
  
  👉 Offline / Window Focus Handling
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;refetchOnWindowFocus&lt;/code&gt; → user active করলে fresh data।&lt;/li&gt;
&lt;li&gt;Retry automatically network fail হলে।&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;RTK Query:&lt;/strong&gt; Manual setup দরকার।&lt;/p&gt;




&lt;h2&gt;
  
  
  👉 File Uploads &amp;amp; Non-serializable Data
&lt;/h2&gt;

&lt;p&gt;React Query supports File, FormData direct use।&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;RTK Query:&lt;/strong&gt; ❌ serializable restriction → tricky। Cache Redux store-এ → File, FormData, Date support নেই।&lt;/p&gt;




&lt;h2&gt;
  
  
  👉 Multiple Queries &amp;amp; Dependent Queries
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;data&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;user&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;useQuery&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;user&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;userId&lt;/span&gt;&lt;span class="p"&gt;],&lt;/span&gt; &lt;span class="nx"&gt;getUser&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;data&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;projects&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;useQuery&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
  &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;projects&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;user&lt;/span&gt;&lt;span class="p"&gt;?.&lt;/span&gt;&lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="p"&gt;],&lt;/span&gt;
  &lt;span class="nx"&gt;getProjects&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;enabled&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="o"&gt;!!&lt;/span&gt;&lt;span class="nx"&gt;user&lt;/span&gt;&lt;span class="p"&gt;?.&lt;/span&gt;&lt;span class="nx"&gt;id&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;একসাথে multiple query handle করা সহজ।&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;RTK Query:&lt;/strong&gt; conditional skip করতে হয় → কম intuitive।&lt;/p&gt;




&lt;h2&gt;
  
  
  👉 API Error Handling &amp;amp; Conditional Invalidate
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nf"&gt;useMutation&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;updateData&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="na"&gt;onSuccess&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;queryClient&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;invalidateQueries&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;todos&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;]),&lt;/span&gt;
  &lt;span class="na"&gt;onSettled&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;queryClient&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;invalidateQueries&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;todos&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;])&lt;/span&gt; &lt;span class="c1"&gt;// success/error উভয়েই&lt;/span&gt;
&lt;span class="p"&gt;})&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Default: error হলে invalidate হয় না। চাইলে onSettled use করে success বা error উভয়েই invalidate করা যায়।&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;RTK Query:&lt;/strong&gt; conditional invalidate করতে extra code লাগে → beginner-unfriendly।&lt;/p&gt;




&lt;h2&gt;
  
  
  👉 Optimistic Updates
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nf"&gt;useMutation&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;updateTodo&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="na"&gt;onMutate&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="k"&gt;async &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;newTodo&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;queryClient&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;cancelQueries&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;todos&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;])&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;previousTodos&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;queryClient&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getQueryData&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;todos&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;])&lt;/span&gt;
    &lt;span class="nx"&gt;queryClient&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;setQueryData&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;todos&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;],&lt;/span&gt; &lt;span class="nx"&gt;old&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;[...&lt;/span&gt;&lt;span class="nx"&gt;old&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;newTodo&lt;/span&gt;&lt;span class="p"&gt;])&lt;/span&gt;
    &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;previousTodos&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;
  &lt;span class="p"&gt;},&lt;/span&gt;
  &lt;span class="na"&gt;onError&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;err&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;newTodo&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;context&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nx"&gt;queryClient&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;setQueryData&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;todos&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;],&lt;/span&gt; &lt;span class="nx"&gt;context&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;previousTodos&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;})&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;UI instantly update, error হলে rollback।&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;RTK Query:&lt;/strong&gt; onQueryStarted + updateQueryData → more complex।&lt;/p&gt;




&lt;h2&gt;
  
  
  👉 Infinite Queries (Infinite Scroll)
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;data&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;fetchNextPage&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;hasNextPage&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;useInfiniteQuery&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
  &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;projects&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;],&lt;/span&gt;
  &lt;span class="nx"&gt;fetchProjects&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;getNextPageParam&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;lastPage&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;lastPage&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;nextCursor&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Next page automatic track।&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;RTK Query:&lt;/strong&gt; Manual setup বা complex pattern।&lt;/p&gt;




&lt;h2&gt;
  
  
  ⭐ Awesome Devtools
&lt;/h2&gt;

&lt;p&gt;React Query devtools দিয়ে সব status (fetching, stale, active, etc.) দেখতে পারবেন। Debugging অনেক সহজ।&lt;/p&gt;




&lt;p&gt;💡 &lt;strong&gt;Conclusion:&lt;/strong&gt;&lt;br&gt;
I have used both RTK and React Query. But find that React Query is much simpler than RTK 😊.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://tanstack.com/query/latest/docs/framework/react/overview" rel="noopener noreferrer"&gt;DOCUMENTATION&lt;/a&gt;&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>react</category>
      <category>development</category>
    </item>
    <item>
      <title>Web LLM attacks</title>
      <dc:creator>Golam Mostafa</dc:creator>
      <pubDate>Sat, 15 Feb 2025 13:57:51 +0000</pubDate>
      <link>https://dev.to/golam_mostafa/web-llm-attacks-18ni</link>
      <guid>https://dev.to/golam_mostafa/web-llm-attacks-18ni</guid>
      <description>&lt;p&gt;Let's explore how to secure your LLM applications using JavaScript, with simple examples and clear explanations.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F39uf3qdszps20kedthjm.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F39uf3qdszps20kedthjm.png" alt="Diagram of various attack vectors" width="800" height="671"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  1. Understanding the Attack Surface
&lt;/h2&gt;

&lt;p&gt;When you build an app with LLMs, you typically have this setup:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Users send inputs to your app&lt;/li&gt;
&lt;li&gt;Your app talks to the LLM service (like OpenAI or Claude)&lt;/li&gt;
&lt;li&gt;The LLM connects to other parts like databases and files&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Common Attack Vectors:
&lt;/h3&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Direct API Manipulation&lt;/strong&gt;
&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// ❌ Vulnerable Implementation&lt;/span&gt;
&lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;processUserRequest&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;userInput&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;llmResponse&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;llm&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;generate&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;userInput&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;filename&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;llmResponse&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;filename&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;fs&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;readFileSync&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;filename&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt; &lt;span class="c1"&gt;// Dangerous!&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;span class="c1"&gt;// ✅ Secure Implementation&lt;/span&gt;
&lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;processUserRequest&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;userInput&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;llmResponse&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;llm&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;generate&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;userInput&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;filename&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;llmResponse&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;filename&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

    &lt;span class="c1"&gt;// Check if path is safe&lt;/span&gt;
    &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="o"&gt;!&lt;/span&gt;&lt;span class="nf"&gt;isSafePath&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;filename&lt;/span&gt;&lt;span class="p"&gt;))&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="k"&gt;throw&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;Error&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Invalid file path&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

    &lt;span class="c1"&gt;// Use path sanitization&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;safePath&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;sanitizePath&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;filename&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;fs&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;readFileSync&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;safePath&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Hidden Prompt Injection&lt;/strong&gt;
&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// Example of checking for hidden content&lt;/span&gt;
&lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;checkForHiddenContent&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;userInput&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="c1"&gt;// Remove HTML tags&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;strippedInput&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;userInput&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;replace&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="sr"&gt;/&amp;lt;&lt;/span&gt;&lt;span class="se"&gt;[^&lt;/span&gt;&lt;span class="sr"&gt;&amp;gt;&lt;/span&gt;&lt;span class="se"&gt;]&lt;/span&gt;&lt;span class="sr"&gt;*&amp;gt;/g&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;''&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

    &lt;span class="c1"&gt;// Check for suspicious keywords&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;suspiciousPatterns&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;
        &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;ignore previous&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
        &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;system prompt&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
        &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;you are now&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;
    &lt;span class="p"&gt;];&lt;/span&gt;

    &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="o"&gt;!&lt;/span&gt;&lt;span class="nx"&gt;suspiciousPatterns&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;some&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;pattern&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; 
        &lt;span class="nx"&gt;strippedInput&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;toLowerCase&lt;/span&gt;&lt;span class="p"&gt;().&lt;/span&gt;&lt;span class="nf"&gt;includes&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;pattern&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
    &lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  2. Security Best Practices
&lt;/h2&gt;

&lt;h3&gt;
  
  
  2.1 Secure API Wrapper
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;class&lt;/span&gt; &lt;span class="nc"&gt;SecureAPIWrapper&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nf"&gt;constructor&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;llmClient&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;llm&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;llmClient&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
        &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;allowedApis&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;Set&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;getPublicData&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;processText&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;]);&lt;/span&gt;
        &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;rateLimiter&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;RateLimiter&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;
        &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;logger&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;AuditLogger&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

    &lt;span class="k"&gt;async&lt;/span&gt; &lt;span class="nf"&gt;executeApiCall&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;apiName&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;params&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="c1"&gt;// Check if API is allowed&lt;/span&gt;
        &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="o"&gt;!&lt;/span&gt;&lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;allowedApis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;has&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;apiName&lt;/span&gt;&lt;span class="p"&gt;))&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
            &lt;span class="k"&gt;throw&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;Error&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Unauthorized API access&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt;

        &lt;span class="c1"&gt;// Clean parameters&lt;/span&gt;
        &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;cleanParams&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;sanitizeParams&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;params&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

        &lt;span class="c1"&gt;// Check rate limit&lt;/span&gt;
        &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="o"&gt;!&lt;/span&gt;&lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;rateLimiter&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;canMakeRequest&lt;/span&gt;&lt;span class="p"&gt;())&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
            &lt;span class="k"&gt;throw&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;Error&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Rate limit exceeded&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt;

        &lt;span class="c1"&gt;// Log the call&lt;/span&gt;
        &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;logger&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;logApiCall&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;apiName&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;cleanParams&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

        &lt;span class="c1"&gt;// Make the actual API call&lt;/span&gt;
        &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;llm&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;callApi&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;apiName&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;cleanParams&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  2.2 Protecting Sensitive Data
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;class&lt;/span&gt; &lt;span class="nc"&gt;DataProtector&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nf"&gt;constructor&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;patterns&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
            &lt;span class="na"&gt;email&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="sr"&gt;/&lt;/span&gt;&lt;span class="se"&gt;\b[\w\.&lt;/span&gt;&lt;span class="sr"&gt;-&lt;/span&gt;&lt;span class="se"&gt;]&lt;/span&gt;&lt;span class="sr"&gt;+@&lt;/span&gt;&lt;span class="se"&gt;[\w\.&lt;/span&gt;&lt;span class="sr"&gt;-&lt;/span&gt;&lt;span class="se"&gt;]&lt;/span&gt;&lt;span class="sr"&gt;+&lt;/span&gt;&lt;span class="se"&gt;\.\w{2,}\b&lt;/span&gt;&lt;span class="sr"&gt;/&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
            &lt;span class="na"&gt;ssn&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="sr"&gt;/&lt;/span&gt;&lt;span class="se"&gt;\d{3}&lt;/span&gt;&lt;span class="sr"&gt;-&lt;/span&gt;&lt;span class="se"&gt;\d{2}&lt;/span&gt;&lt;span class="sr"&gt;-&lt;/span&gt;&lt;span class="se"&gt;\d{4}&lt;/span&gt;&lt;span class="sr"&gt;/&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
            &lt;span class="na"&gt;creditCard&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="sr"&gt;/&lt;/span&gt;&lt;span class="se"&gt;\d{4}[&lt;/span&gt;&lt;span class="sr"&gt;- &lt;/span&gt;&lt;span class="se"&gt;]?\d{4}[&lt;/span&gt;&lt;span class="sr"&gt;- &lt;/span&gt;&lt;span class="se"&gt;]?\d{4}[&lt;/span&gt;&lt;span class="sr"&gt;- &lt;/span&gt;&lt;span class="se"&gt;]?\d{4}&lt;/span&gt;&lt;span class="sr"&gt;/&lt;/span&gt;
        &lt;span class="p"&gt;};&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

    &lt;span class="nf"&gt;sanitizeText&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;text&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;cleanText&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;text&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

        &lt;span class="c1"&gt;// Replace each pattern with [REDACTED]&lt;/span&gt;
        &lt;span class="nb"&gt;Object&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;entries&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;patterns&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nf"&gt;forEach&lt;/span&gt;&lt;span class="p"&gt;(([&lt;/span&gt;&lt;span class="nx"&gt;type&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;pattern&lt;/span&gt;&lt;span class="p"&gt;])&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
            &lt;span class="nx"&gt;cleanText&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;cleanText&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;replace&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;pattern&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="s2"&gt;`[REDACTED &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;type&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;]`&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
        &lt;span class="p"&gt;});&lt;/span&gt;

        &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;cleanText&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;span class="c1"&gt;// Usage example&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;protector&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;DataProtector&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;userInput&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;My email is user@example.com and CC: 1234-5678-9012-3456&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;protector&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;sanitizeText&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;userInput&lt;/span&gt;&lt;span class="p"&gt;));&lt;/span&gt;
&lt;span class="c1"&gt;// Output: "My email is [REDACTED email] and CC: [REDACTED creditCard]"&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  3. Security Monitoring
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;class&lt;/span&gt; &lt;span class="nc"&gt;SecurityMonitor&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nf"&gt;constructor&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;events&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[];&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

    &lt;span class="nf"&gt;logEvent&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;eventType&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;severity&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;details&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;event&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
            &lt;span class="na"&gt;timestamp&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;Date&lt;/span&gt;&lt;span class="p"&gt;(),&lt;/span&gt;
            &lt;span class="na"&gt;type&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;eventType&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
            &lt;span class="nx"&gt;severity&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
            &lt;span class="nx"&gt;details&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
        &lt;span class="p"&gt;};&lt;/span&gt;

        &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;events&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;push&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;event&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

        &lt;span class="c1"&gt;// If high severity, send alert&lt;/span&gt;
        &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;severity&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;high&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
            &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;sendAlert&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;event&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

    &lt;span class="k"&gt;async&lt;/span&gt; &lt;span class="nf"&gt;sendAlert&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;event&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="c1"&gt;// Send to your monitoring service&lt;/span&gt;
        &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nf"&gt;fetch&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;your-monitoring-endpoint&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
            &lt;span class="na"&gt;method&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;POST&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
            &lt;span class="na"&gt;body&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;JSON&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;stringify&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;event&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
        &lt;span class="p"&gt;});&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  4. Security Checklist
&lt;/h2&gt;

&lt;p&gt;✅ Always implement these safety measures:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Input Validation&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Validate all user inputs&lt;/li&gt;
&lt;li&gt;Set maximum length limits&lt;/li&gt;
&lt;li&gt;Check for malicious patterns&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;API Security&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Use secure API keys&lt;/li&gt;
&lt;li&gt;Implement rate limiting&lt;/li&gt;
&lt;li&gt;Log all API calls&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Data Protection&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Remove sensitive information&lt;/li&gt;
&lt;li&gt;Encrypt data in transit&lt;/li&gt;
&lt;li&gt;Regularly check security logs&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  Example Implementation
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;class&lt;/span&gt; &lt;span class="nc"&gt;SecureLLMApp&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nf"&gt;constructor&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;apiWrapper&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;SecureAPIWrapper&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;llmClient&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
        &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;dataProtector&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;DataProtector&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;
        &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;monitor&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;SecurityMonitor&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

    &lt;span class="k"&gt;async&lt;/span&gt; &lt;span class="nf"&gt;processUserRequest&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;userInput&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="k"&gt;try&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
            &lt;span class="c1"&gt;// 1. Validate input&lt;/span&gt;
            &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="o"&gt;!&lt;/span&gt;&lt;span class="nf"&gt;checkForHiddenContent&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;userInput&lt;/span&gt;&lt;span class="p"&gt;))&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
                &lt;span class="k"&gt;throw&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;Error&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Suspicious content detected&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
            &lt;span class="p"&gt;}&lt;/span&gt;

            &lt;span class="c1"&gt;// 2. Sanitize sensitive data&lt;/span&gt;
            &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;cleanInput&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;dataProtector&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;sanitizeText&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;userInput&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

            &lt;span class="c1"&gt;// 3. Make API call&lt;/span&gt;
            &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;response&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;apiWrapper&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;executeApiCall&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
                &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;processText&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; 
                &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;text&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;cleanInput&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;
            &lt;span class="p"&gt;);&lt;/span&gt;

            &lt;span class="c1"&gt;// 4. Log success&lt;/span&gt;
            &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;monitor&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;logEvent&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;request_processed&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;info&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
                &lt;span class="na"&gt;inputLength&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;userInput&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;length&lt;/span&gt;
            &lt;span class="p"&gt;});&lt;/span&gt;

            &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;response&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

        &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;catch &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;error&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
            &lt;span class="c1"&gt;// Log any errors&lt;/span&gt;
            &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;monitor&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;logEvent&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;request_failed&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;high&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
                &lt;span class="na"&gt;error&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;error&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;message&lt;/span&gt;
            &lt;span class="p"&gt;});&lt;/span&gt;
            &lt;span class="k"&gt;throw&lt;/span&gt; &lt;span class="nx"&gt;error&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Remember
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Always validate user inputs&lt;/li&gt;
&lt;li&gt;Keep your security measures updated&lt;/li&gt;
&lt;li&gt;Monitor for unusual behavior&lt;/li&gt;
&lt;li&gt;Regularly test your security setup&lt;/li&gt;
&lt;/ul&gt;




&lt;p&gt;&lt;strong&gt;Acknowledgment&lt;/strong&gt;: This document references information from &lt;a href="https://portswigger.net/web-security/" rel="noopener noreferrer"&gt;PortSwigger Web Security&lt;/a&gt;.&lt;/p&gt;




</description>
      <category>webdev</category>
      <category>cybersecurity</category>
    </item>
    <item>
      <title>Prevent Authentication Security Issues</title>
      <dc:creator>Golam Mostafa</dc:creator>
      <pubDate>Fri, 14 Feb 2025 17:55:23 +0000</pubDate>
      <link>https://dev.to/golam_mostafa/guide-to-prevent-authentication-security-issues-38n</link>
      <guid>https://dev.to/golam_mostafa/guide-to-prevent-authentication-security-issues-38n</guid>
      <description>&lt;ol&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Use Strong Passwords&lt;/strong&gt;  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Enforce strong password policies. Use a password strength checker like &lt;strong&gt;zxcvbn&lt;/strong&gt; to guide users in creating secure passwords.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Example&lt;/strong&gt;: If a user tries "password123," the system should suggest using "MyStr0ng#Pass2025" instead.&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Prevent Username Enumeration&lt;/strong&gt;  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Return the same error message and HTTP status code for invalid usernames and passwords to avoid revealing whether a username exists.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Example&lt;/strong&gt;: Show "Invalid credentials" for both wrong usernames and passwords, without confirming which part was incorrect.&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Implement Account Locking&lt;/strong&gt;  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Temporarily lock accounts after a certain number of failed login attempts.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Example&lt;/strong&gt;: Lock an account for 10 minutes after 5 wrong attempts to prevent targeted brute-forcing.&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Limit Login Attempts (Rate Limiting)&lt;/strong&gt;  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Limit login attempts per IP address and block suspicious behavior.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Example&lt;/strong&gt;: Allow 5 attempts per minute per IP. Block further attempts for 15 minutes if the limit is exceeded.&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Add CAPTCHA for Extra Protection&lt;/strong&gt;  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Require users to complete a CAPTCHA after several failed login attempts.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Example&lt;/strong&gt;: After 3 failed logins, show a CAPTCHA like "Click all the images with traffic lights."&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Implement Multi-Factor Authentication (MFA)&lt;/strong&gt;  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Use app-based or hardware-based MFA instead of SMS.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Example&lt;/strong&gt;: After entering a password, require a 6-digit code from Google Authenticator or a similar app.&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Secure Password Reset&lt;/strong&gt;  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Use a time-limited, unique token for password reset links.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Example&lt;/strong&gt;: Send an email with a link that expires in 15 minutes. Ensure the link can only be used once.&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Avoid SMS-Based MFA&lt;/strong&gt;  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;SMS 2FA can be bypassed via SIM-swapping attacks. Use app-based authentication instead.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Example&lt;/strong&gt;: Encourage users to set up an authenticator app for 2FA instead of relying on SMS codes.&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Protect Additional Authentication Functions&lt;/strong&gt;  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Secure features like account registration, password recovery, and password changes.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Example&lt;/strong&gt;: Require users to verify their email before changing their password.&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Prevent Brute-Force Attacks on Multiple Accounts&lt;/strong&gt;  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Limit the number of login attempts across all usernames using shortlists of passwords.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Example&lt;/strong&gt;: If an attacker tries common passwords like "123456" or "qwerty" across accounts, block them after 5 attempts.&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Triple-Check Verification Logic&lt;/strong&gt;  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Regularly audit login and authentication logic to prevent bypass vulnerabilities.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Example&lt;/strong&gt;: Ensure the system verifies both the username and password properly and doesn't skip steps due to flawed code.&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Don’t Rely on Users for Security&lt;/strong&gt;  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Enforce secure practices like strong passwords and MFA automatically.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Example&lt;/strong&gt;: Block weak passwords like "Password123" and require a unique, strong password.&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Implement Robust Brute-Force Protections&lt;/strong&gt;  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Require CAPTCHA or other verification methods after multiple failed attempts.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Example&lt;/strong&gt;: After 5 failed attempts from the same IP, show a CAPTCHA and notify the account owner.&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Please feel free to add more :).&lt;/p&gt;




&lt;p&gt;&lt;strong&gt;Acknowledgment&lt;/strong&gt;: This document references information from &lt;a href="https://portswigger.net/web-security/" rel="noopener noreferrer"&gt;PortSwigger Web Security&lt;/a&gt;&lt;/p&gt;




</description>
    </item>
    <item>
      <title>SQL Injection (SQLi)</title>
      <dc:creator>Golam Mostafa</dc:creator>
      <pubDate>Thu, 26 Dec 2024 18:04:21 +0000</pubDate>
      <link>https://dev.to/golam_mostafa/sql-injection-sqli-58af</link>
      <guid>https://dev.to/golam_mostafa/sql-injection-sqli-58af</guid>
      <description>&lt;p&gt;SQL Injection (SQLi) is a trick used by hackers to mess with websites. They add fake input into forms or URLs to access or steal data from a website's database.&lt;/p&gt;




&lt;h3&gt;
  
  
  How to Spot SQL Injection
&lt;/h3&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Single Quotes ('')&lt;/strong&gt;: Enter a single quote (&lt;code&gt;'&lt;/code&gt;) in a form or URL. If you see an error, the website might be vulnerable.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Always True Condition&lt;/strong&gt;: Try entering &lt;code&gt;OR 1=1&lt;/code&gt; (always true) or &lt;code&gt;OR 1=2&lt;/code&gt; (always false) and see if the site behaves differently.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Delays&lt;/strong&gt;: Use commands like &lt;code&gt;SLEEP(5)&lt;/code&gt; to see if the page takes longer to load.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;External Calls&lt;/strong&gt;: Test if your input makes the site connect to another server.&lt;/li&gt;
&lt;/ol&gt;




&lt;h3&gt;
  
  
  Example: Finding Hidden Items
&lt;/h3&gt;

&lt;p&gt;For example:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;https://example.com/products?category=Gifts
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The site might use this command to get the products:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight sql"&gt;&lt;code&gt;&lt;span class="k"&gt;SELECT&lt;/span&gt; &lt;span class="o"&gt;*&lt;/span&gt; &lt;span class="k"&gt;FROM&lt;/span&gt; &lt;span class="n"&gt;products&lt;/span&gt; &lt;span class="k"&gt;WHERE&lt;/span&gt; &lt;span class="n"&gt;category&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="s1"&gt;'Gifts'&lt;/span&gt; &lt;span class="k"&gt;AND&lt;/span&gt; &lt;span class="n"&gt;released&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This hides unreleased items (&lt;code&gt;released = 1&lt;/code&gt; shows only ready products).  &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;What Hackers Do:&lt;/strong&gt;&lt;br&gt;&lt;br&gt;
They can change the URL to:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;https://example.com/products?category=Gifts'--
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This changes the database query to:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight sql"&gt;&lt;code&gt;&lt;span class="k"&gt;SELECT&lt;/span&gt; &lt;span class="o"&gt;*&lt;/span&gt; &lt;span class="k"&gt;FROM&lt;/span&gt; &lt;span class="n"&gt;products&lt;/span&gt; &lt;span class="k"&gt;WHERE&lt;/span&gt; &lt;span class="n"&gt;category&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="s1"&gt;'Gifts'&lt;/span&gt;&lt;span class="c1"&gt;--' AND released = 1;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The &lt;code&gt;--&lt;/code&gt; ignores the rest of the query, showing &lt;strong&gt;all products&lt;/strong&gt;, even hidden ones.&lt;/p&gt;




&lt;h3&gt;
  
  
  Example: Show Everything
&lt;/h3&gt;

&lt;p&gt;Hackers can show all items, even unknown categories, by using:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;https://example.com/products?category=Gifts'+OR+1=1--
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This creates a query like:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight sql"&gt;&lt;code&gt;&lt;span class="k"&gt;SELECT&lt;/span&gt; &lt;span class="o"&gt;*&lt;/span&gt; &lt;span class="k"&gt;FROM&lt;/span&gt; &lt;span class="n"&gt;products&lt;/span&gt; &lt;span class="k"&gt;WHERE&lt;/span&gt; &lt;span class="n"&gt;category&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="s1"&gt;'Gifts'&lt;/span&gt; &lt;span class="k"&gt;OR&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="c1"&gt;--' AND released = 1;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Since &lt;code&gt;1=1&lt;/code&gt; is always true, the database returns &lt;strong&gt;everything&lt;/strong&gt;.&lt;/p&gt;




&lt;h3&gt;
  
  
  Example: Hacking a Login
&lt;/h3&gt;

&lt;p&gt;Think of a login form that checks username and password. Normally, it might do this:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight sql"&gt;&lt;code&gt;&lt;span class="k"&gt;SELECT&lt;/span&gt; &lt;span class="o"&gt;*&lt;/span&gt; &lt;span class="k"&gt;FROM&lt;/span&gt; &lt;span class="n"&gt;users&lt;/span&gt; &lt;span class="k"&gt;WHERE&lt;/span&gt; &lt;span class="n"&gt;username&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="s1"&gt;'user'&lt;/span&gt; &lt;span class="k"&gt;AND&lt;/span&gt; &lt;span class="n"&gt;password&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="s1"&gt;'pass'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;A hacker can enter this as the username:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;user' OR '1'='1
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The query becomes:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight sql"&gt;&lt;code&gt;&lt;span class="k"&gt;SELECT&lt;/span&gt; &lt;span class="o"&gt;*&lt;/span&gt; &lt;span class="k"&gt;FROM&lt;/span&gt; &lt;span class="n"&gt;users&lt;/span&gt; &lt;span class="k"&gt;WHERE&lt;/span&gt; &lt;span class="n"&gt;username&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="s1"&gt;'user'&lt;/span&gt; &lt;span class="k"&gt;OR&lt;/span&gt; &lt;span class="s1"&gt;'1'&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="s1"&gt;'1'&lt;/span&gt; &lt;span class="k"&gt;AND&lt;/span&gt; &lt;span class="n"&gt;password&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="s1"&gt;'pass'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Since &lt;code&gt;1=1&lt;/code&gt; is always true, the hacker logs in without a password.&lt;/p&gt;




&lt;h3&gt;
  
  
  Be Careful
&lt;/h3&gt;

&lt;p&gt;Testing SQLi is risky. Commands like &lt;code&gt;OR 1=1&lt;/code&gt; might delete or change important data if misused. Always handle websites and data responsibly. &lt;/p&gt;




&lt;p&gt;To stay safe, websites must properly check user inputs and use secure coding practices.&lt;/p&gt;




&lt;p&gt;&lt;strong&gt;Acknowledgment&lt;/strong&gt;: This document references information from &lt;a href="https://portswigger.net/web-security/" rel="noopener noreferrer"&gt;PortSwigger Web Security&lt;/a&gt; and ChatGPT.&lt;/p&gt;




</description>
    </item>
    <item>
      <title>OWASP Top 10</title>
      <dc:creator>Golam Mostafa</dc:creator>
      <pubDate>Mon, 16 Dec 2024 13:11:34 +0000</pubDate>
      <link>https://dev.to/golam_mostafa/owasp-top-10-34b7</link>
      <guid>https://dev.to/golam_mostafa/owasp-top-10-34b7</guid>
      <description>&lt;p&gt;The &lt;strong&gt;OWASP Top 10&lt;/strong&gt; is a list of the most common and dangerous security risks for web applications. If you're building a website or an app, you need to know these risks to keep your system safe.&lt;/p&gt;




&lt;h2&gt;
  
  
  1. &lt;strong&gt;Broken Access Control (A01)&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;This happens when users can access things they shouldn’t, like admin pages or other users' data.  &lt;/p&gt;

&lt;h3&gt;
  
  
  Example:
&lt;/h3&gt;

&lt;p&gt;Imagine a normal user visiting:&lt;br&gt;&lt;br&gt;
&lt;code&gt;https://example.com/admin&lt;/code&gt;&lt;br&gt;&lt;br&gt;
If they see admin pages, that’s broken access control.&lt;/p&gt;

&lt;h3&gt;
  
  
  How to Fix:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Use &lt;strong&gt;Authorization&lt;/strong&gt; to check who can access what.
&lt;/li&gt;
&lt;li&gt;Add &lt;strong&gt;Role-Based Access Control (RBAC)&lt;/strong&gt;: e.g., Admin, User, Guest.
&lt;/li&gt;
&lt;li&gt;Use &lt;strong&gt;Secure Cookies&lt;/strong&gt;.
&lt;/li&gt;
&lt;li&gt;Always validate inputs on the backend.&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  2. &lt;strong&gt;Cryptographic Failures (A02)&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;This happens when sensitive data like passwords or credit card info isn’t protected properly.&lt;/p&gt;

&lt;h3&gt;
  
  
  Example:
&lt;/h3&gt;

&lt;p&gt;Storing passwords as plain text:&lt;br&gt;&lt;br&gt;
&lt;code&gt;Password: mypassword123&lt;/code&gt;&lt;br&gt;&lt;br&gt;
If a hacker gets this, it’s game over.&lt;/p&gt;

&lt;h3&gt;
  
  
  How to Fix:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Use &lt;strong&gt;strong encryption&lt;/strong&gt; for passwords like &lt;strong&gt;bcrypt&lt;/strong&gt;.
&lt;/li&gt;
&lt;li&gt;Use &lt;strong&gt;HTTPS/TLS&lt;/strong&gt; to secure data during transfer.
&lt;/li&gt;
&lt;li&gt;Example:
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;   &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;bcrypt&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;require&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;bcrypt&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
   &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;hashedPassword&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;bcrypt&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;hash&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;mypassword123&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;10&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
   &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;hashedPassword&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;h2&gt;
  
  
  3. &lt;strong&gt;Injection (A03)&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;This happens when a hacker sends harmful code (like SQL or scripts) into your application.  &lt;/p&gt;

&lt;h3&gt;
  
  
  Example:
&lt;/h3&gt;

&lt;p&gt;If your website takes input like this:&lt;br&gt;&lt;br&gt;
&lt;code&gt;SELECT * FROM users WHERE id = 1;&lt;/code&gt;&lt;br&gt;&lt;br&gt;
A hacker could type:&lt;br&gt;&lt;br&gt;
&lt;code&gt;1; DROP TABLE users;&lt;/code&gt;  &lt;/p&gt;

&lt;h3&gt;
  
  
  How to Fix:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Validate and sanitize&lt;/strong&gt; all inputs.
&lt;/li&gt;
&lt;li&gt;Use &lt;strong&gt;parameterized queries&lt;/strong&gt;. Example in Node.js:
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;   &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;query&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;SELECT * FROM users WHERE id = ?&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
   &lt;span class="nx"&gt;db&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;query&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;query&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;userId&lt;/span&gt;&lt;span class="p"&gt;]);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;h2&gt;
  
  
  4. &lt;strong&gt;Insecure Design (A04)&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;This happens when your system is not designed securely in the first place.&lt;/p&gt;

&lt;h3&gt;
  
  
  Example:
&lt;/h3&gt;

&lt;p&gt;An app that allows weak passwords like "1234" is insecure by design.&lt;/p&gt;

&lt;h3&gt;
  
  
  How to Fix:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Use &lt;strong&gt;OWASP resources&lt;/strong&gt; to follow secure design patterns.
&lt;/li&gt;
&lt;li&gt;Perform regular security reviews.&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  5. &lt;strong&gt;Security Misconfiguration (A05)&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;This happens when your app has default settings or unnecessary features enabled.&lt;/p&gt;

&lt;h3&gt;
  
  
  Example:
&lt;/h3&gt;

&lt;p&gt;Leaving the default username and password:&lt;br&gt;&lt;br&gt;
&lt;code&gt;admin / admin123&lt;/code&gt;  &lt;/p&gt;

&lt;h3&gt;
  
  
  How to Fix:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Keep systems &lt;strong&gt;up-to-date&lt;/strong&gt;.
&lt;/li&gt;
&lt;li&gt;Remove unused features and accounts.
&lt;/li&gt;
&lt;li&gt;Use &lt;strong&gt;safe error messages&lt;/strong&gt; like "Invalid credentials" instead of exposing details.&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  6. &lt;strong&gt;Vulnerable and Outdated Components (A06)&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;This happens when your app uses old software or libraries with known security issues.&lt;/p&gt;

&lt;h3&gt;
  
  
  Example:
&lt;/h3&gt;

&lt;p&gt;Using an old version of a library like &lt;code&gt;express&lt;/code&gt; that has vulnerabilities.&lt;/p&gt;

&lt;h3&gt;
  
  
  How to Fix:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Update your libraries and software regularly.
&lt;/li&gt;
&lt;li&gt;Use security tools like &lt;code&gt;npm audit&lt;/code&gt; to check for vulnerabilities.
&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  7. &lt;strong&gt;Identification and Authentication Failures (A07)&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;This happens when attackers can bypass login systems.&lt;/p&gt;

&lt;h3&gt;
  
  
  Example:
&lt;/h3&gt;

&lt;p&gt;Allowing weak passwords like "password123" or not locking accounts after failed logins.&lt;/p&gt;

&lt;h3&gt;
  
  
  How to Fix:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Use strong &lt;strong&gt;authentication&lt;/strong&gt; like &lt;strong&gt;JWT tokens&lt;/strong&gt;.
&lt;/li&gt;
&lt;li&gt;Store passwords securely.
&lt;/li&gt;
&lt;li&gt;Protect against &lt;strong&gt;brute-force attacks&lt;/strong&gt;.
&lt;/li&gt;
&lt;li&gt;Example: Lock an account after 5 failed attempts.&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  8. &lt;strong&gt;Software and Data Integrity Failures (A08)&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;This happens when your software or data is tampered with during updates or transfers.&lt;/p&gt;

&lt;h3&gt;
  
  
  Example:
&lt;/h3&gt;

&lt;p&gt;A hacker changes your app update to include malware.&lt;/p&gt;

&lt;h3&gt;
  
  
  How to Fix:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Always verify updates with digital &lt;strong&gt;signatures&lt;/strong&gt;.
&lt;/li&gt;
&lt;li&gt;Use &lt;strong&gt;trusted sources&lt;/strong&gt; for libraries.
&lt;/li&gt;
&lt;li&gt;Keep everything &lt;strong&gt;up-to-date&lt;/strong&gt;.&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  9. &lt;strong&gt;Security Logging and Monitoring Failures (A09)&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;This happens when you don’t track suspicious activities on your app.&lt;/p&gt;

&lt;h3&gt;
  
  
  Example:
&lt;/h3&gt;

&lt;p&gt;If someone tries to log in 100 times and fails, and you don’t log or monitor it, you might miss a brute-force attack.&lt;/p&gt;

&lt;h3&gt;
  
  
  How to Fix:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Add proper &lt;strong&gt;logging&lt;/strong&gt; and &lt;strong&gt;monitoring&lt;/strong&gt;.
&lt;/li&gt;
&lt;li&gt;Use tools like &lt;strong&gt;Winston&lt;/strong&gt; or &lt;strong&gt;ELK Stack&lt;/strong&gt;.
&lt;/li&gt;
&lt;li&gt;Example: Log failed login attempts:
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;   &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s2"&gt;`Failed login attempt for user: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;username&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;`&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;h2&gt;
  
  
  10. &lt;strong&gt;Server-Side Request Forgery (SSRF) (A10)&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;This happens when an attacker tricks your server into making a request to an internal system.&lt;/p&gt;

&lt;h3&gt;
  
  
  Example:
&lt;/h3&gt;

&lt;p&gt;A hacker sends:&lt;br&gt;&lt;br&gt;
&lt;code&gt;http://localhost/admin&lt;/code&gt;&lt;br&gt;&lt;br&gt;
If your app fetches this URL, it exposes internal data.&lt;/p&gt;

&lt;h3&gt;
  
  
  How to Fix:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Validate all URLs before making requests.
&lt;/li&gt;
&lt;li&gt;Don’t allow users to directly input URLs.
&lt;/li&gt;
&lt;li&gt;Example: Use a whitelist of trusted URLs.&lt;/li&gt;
&lt;/ul&gt;




&lt;p&gt;&lt;strong&gt;Acknowledgment&lt;/strong&gt;: This document references information from &lt;a href="https://owasp.org/www-project-top-ten/" rel="noopener noreferrer"&gt;OWASP&lt;/a&gt;, &lt;a href="https://www.linkedin.com/in/foyzul/" rel="noopener noreferrer"&gt;Foyjul Karim&lt;/a&gt; and ChatGPT.&lt;/p&gt;




</description>
    </item>
    <item>
      <title>File Upload Vulnerabilities</title>
      <dc:creator>Golam Mostafa</dc:creator>
      <pubDate>Sat, 23 Nov 2024 17:25:53 +0000</pubDate>
      <link>https://dev.to/golam_mostafa/file-upload-vulnerabilities-12oe</link>
      <guid>https://dev.to/golam_mostafa/file-upload-vulnerabilities-12oe</guid>
      <description>&lt;h3&gt;
  
  
  What Are File Upload Vulnerabilities?
&lt;/h3&gt;

&lt;p&gt;File upload vulnerabilities occur when a server lets users upload files without proper checks. Attackers can exploit this to upload harmful files, like scripts, instead of safe ones, like images. Sometimes, just uploading the file causes damage; other times, attackers trigger the file to execute with a request.  &lt;/p&gt;




&lt;h3&gt;
  
  
  How Do These Vulnerabilities Happen?
&lt;/h3&gt;

&lt;p&gt;Even when protections exist, flaws in implementation can still allow attacks. Common issues include:  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Blocking some dangerous file types but missing others.
&lt;/li&gt;
&lt;li&gt;Relying on file properties that attackers can fake using tools.
&lt;/li&gt;
&lt;li&gt;Inconsistent validation across the website.
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;These small mistakes give attackers ways to bypass security measures.  &lt;/p&gt;




&lt;h3&gt;
  
  
  Exploiting Flawed File Upload Validation
&lt;/h3&gt;

&lt;p&gt;Attackers often exploit weak validation to upload harmful scripts, like web shells. For example, a PHP script like this reads secret files:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight php"&gt;&lt;code&gt;&lt;span class="cp"&gt;&amp;lt;?php&lt;/span&gt; &lt;span class="k"&gt;echo&lt;/span&gt; &lt;span class="nb"&gt;file_get_contents&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s1"&gt;'secret.txt'&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt; &lt;span class="cp"&gt;?&amp;gt;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Or, a script like this can run system commands:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight php"&gt;&lt;code&gt;&lt;span class="cp"&gt;&amp;lt;?php&lt;/span&gt; &lt;span class="k"&gt;echo&lt;/span&gt; &lt;span class="nb"&gt;system&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nv"&gt;$_GET&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="s1"&gt;'cmd'&lt;/span&gt;&lt;span class="p"&gt;]);&lt;/span&gt; &lt;span class="cp"&gt;?&amp;gt;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Attackers can send:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;GET /hack.php?cmd=whoami
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This shows the server's identity and gives attackers control.  &lt;/p&gt;




&lt;h3&gt;
  
  
  Flawed File Type Validation
&lt;/h3&gt;

&lt;p&gt;Some servers validate file uploads by checking the &lt;strong&gt;Content-Type&lt;/strong&gt; header for expected MIME types like &lt;code&gt;image/jpeg&lt;/code&gt;. However, if the server trusts this header without checking the file’s actual contents, attackers can easily bypass the validation.  &lt;/p&gt;

&lt;p&gt;For example, an image upload form may send this request:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;POST /images HTTP/1.1  
Host: example.com  
Content-Type: multipart/form-data  

--boundary  
Content-Disposition: form-data; name="image"; filename="example.jpg"  
Content-Type: image/jpeg  

[binary data]  
--boundary--
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;If the server only verifies the &lt;code&gt;Content-Type&lt;/code&gt; value, attackers can fake this using tools like Burp Repeater and upload malicious files disguised as images.  &lt;/p&gt;




&lt;h3&gt;
  
  
  Protecting Against File Upload Vulnerabilities
&lt;/h3&gt;

&lt;p&gt;To prevent these attacks:  &lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Verify file content matches the declared type.
&lt;/li&gt;
&lt;li&gt;Store uploaded files in non-executable directories.
&lt;/li&gt;
&lt;li&gt;Use strict whitelists for allowed file types.
&lt;/li&gt;
&lt;li&gt;Scan files for malicious content.
&lt;/li&gt;
&lt;/ol&gt;




&lt;p&gt;&lt;strong&gt;Learn More&lt;/strong&gt;: &lt;a href="https://youtu.be/rPdn88pO7x0" rel="noopener noreferrer"&gt;Watch the Tutorial&lt;/a&gt;  &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Acknowledgment&lt;/strong&gt;: This post is inspired by insights from &lt;a href="https://portswigger.net/web-security/" rel="noopener noreferrer"&gt;PortSwigger Web Security&lt;/a&gt; and ChatGPT.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>cybersecurity</category>
    </item>
    <item>
      <title>SSRF Attacks: The Silent Threat Hiding in Your Server</title>
      <dc:creator>Golam Mostafa</dc:creator>
      <pubDate>Sat, 16 Nov 2024 19:24:26 +0000</pubDate>
      <link>https://dev.to/golam_mostafa/ssrf-attacks-the-silent-threat-hiding-in-your-server-4a8l</link>
      <guid>https://dev.to/golam_mostafa/ssrf-attacks-the-silent-threat-hiding-in-your-server-4a8l</guid>
      <description>&lt;h3&gt;
  
  
  &lt;strong&gt;What is SSRF (Server-Side Request Forgery)?&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;Server-Side Request Forgery (SSRF) is a web vulnerability where attackers trick a server into making unauthorized requests to internal or external systems.&lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;strong&gt;How Does It Work?&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;An attacker sends a malicious URL in a request that the server processes as legitimate. The server then makes the request on the attacker’s behalf. &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Example:&lt;/strong&gt;&lt;br&gt;&lt;br&gt;
A shopping app checks stock by making a backend API request:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight http"&gt;&lt;code&gt;&lt;span class="err"&gt;POST /product/stock  
stockApi=http://stock.server.com/check?productId=6&amp;amp;storeId=1  
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;An attacker modifies the URL to point to the server's admin page:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight http"&gt;&lt;code&gt;&lt;span class="err"&gt;POST /product/stock  
stockApi=http://localhost/admin  
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The server fetches and returns restricted admin data, bypassing access controls. &lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;strong&gt;Why Does This Happen?&lt;/strong&gt;
&lt;/h3&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Access Control Gaps:&lt;/strong&gt; Checks are skipped for local requests.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Recovery Features:&lt;/strong&gt; Admin access is granted to local users without authentication.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Hidden Interfaces:&lt;/strong&gt; Admin tools on separate ports trust local machine requests. &lt;/li&gt;
&lt;/ol&gt;

&lt;h3&gt;
  
  
  &lt;strong&gt;Protect Against SSRF&lt;/strong&gt;
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Validate and sanitize input URLs. &lt;/li&gt;
&lt;li&gt;Use URL whitelists. &lt;/li&gt;
&lt;li&gt;Restrict internal service access. &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;SSRF can be critical, but good design and input validation can prevent it.&lt;/p&gt;




&lt;p&gt;&lt;strong&gt;Acknowledgment&lt;/strong&gt;: This document references information from &lt;a href="https://portswigger.net/web-security/" rel="noopener noreferrer"&gt;PortSwigger Web Security&lt;/a&gt; and ChatGPT.&lt;/p&gt;




</description>
      <category>security</category>
      <category>websecurity</category>
      <category>webdev</category>
    </item>
    <item>
      <title>Weaknesses in Two-Factor Authentication</title>
      <dc:creator>Golam Mostafa</dc:creator>
      <pubDate>Tue, 12 Nov 2024 19:54:40 +0000</pubDate>
      <link>https://dev.to/golam_mostafa/weaknesses-in-two-factor-authentication-c6i</link>
      <guid>https://dev.to/golam_mostafa/weaknesses-in-two-factor-authentication-c6i</guid>
      <description>&lt;p&gt;Two-factor authentication (2FA) is meant to add extra security by asking for a password and then a code. However, some websites don’t fully enforce the second step.&lt;/p&gt;

&lt;p&gt;For example, imagine logging in to a site that asks for your password, then moves to a page asking for a code. If the website considers you "logged in" after just the password, you might be able to skip the code and access secure pages.&lt;/p&gt;

&lt;p&gt;To check if this flaw exists:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Enter your password.&lt;/li&gt;
&lt;li&gt;When asked for the code, try going directly to a secure page.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;If it works, the 2FA isn’t doing its job, and hackers could exploit this to bypass security.&lt;/p&gt;




&lt;p&gt;&lt;strong&gt;Acknowledgment&lt;/strong&gt;: This document references information from &lt;a href="https://portswigger.net/web-security/" rel="noopener noreferrer"&gt;PortSwigger Web Security&lt;/a&gt; and ChatGPT.&lt;/p&gt;




</description>
      <category>webdev</category>
      <category>security</category>
    </item>
    <item>
      <title>Authentication vs. Authorization: Key Differences and Security Risks Explained</title>
      <dc:creator>Golam Mostafa</dc:creator>
      <pubDate>Sat, 09 Nov 2024 15:14:21 +0000</pubDate>
      <link>https://dev.to/golam_mostafa/authentication-vs-authorization-key-differences-and-security-risks-explained-312c</link>
      <guid>https://dev.to/golam_mostafa/authentication-vs-authorization-key-differences-and-security-risks-explained-312c</guid>
      <description>&lt;p&gt;When accessing online accounts or secure areas, two key security concepts play a role: &lt;strong&gt;Authentication&lt;/strong&gt; and &lt;strong&gt;Authorization&lt;/strong&gt;. Both are essential, but they serve different purposes. Let’s explore the differences with clear examples and highlight security risks, such as brute-force attacks and username enumeration, that threaten them.&lt;/p&gt;

&lt;h3&gt;
  
  
  What is Authentication?
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Authentication&lt;/strong&gt; is all about verifying identity. In simple terms, it’s how a system checks if you are really who you claim to be.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Example:&lt;/strong&gt; Imagine Carlos tries logging into a website with the username “Carlos123.” &lt;strong&gt;Authentication&lt;/strong&gt; is the process that checks if Carlos is indeed the person who created that account by verifying his password.&lt;/p&gt;

&lt;h3&gt;
  
  
  What is Authorization?
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Authorization&lt;/strong&gt; comes after authentication. Once the system knows who you are, authorization decides &lt;strong&gt;what you are allowed to do&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Example:&lt;/strong&gt; After Carlos logs in, his account permissions determine what he can access. For instance, he might be authorized to view personal data but not to delete another user’s account.&lt;/p&gt;

&lt;h3&gt;
  
  
  Brute-Force Attacks
&lt;/h3&gt;

&lt;p&gt;A &lt;strong&gt;brute-force attack&lt;/strong&gt; is when an attacker tries different usernames and passwords repeatedly to gain access. Often, this is done with automated tools that test a vast number of login combinations very quickly.&lt;/p&gt;

&lt;h4&gt;
  
  
  How Brute-Forcing Works
&lt;/h4&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Guessing Passwords:&lt;/strong&gt; Attackers use common or predictable passwords, such as “Password123” or “Admin2023!” They might even try patterns based on the target, like adding “123” or “!” to simple words (e.g., “mypassword1!”).&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Automated Tools:&lt;/strong&gt; Tools like Hydra or Burp Suite make it easier to brute-force logins at high speed, increasing the chances of guessing correctly.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;strong&gt;Example:&lt;/strong&gt; Carlos uses “Carlos2023” as a password. An attacker using a brute-force tool could guess this password if it tries combinations based on his name.&lt;/p&gt;

&lt;h3&gt;
  
  
  Brute-Forcing Usernames
&lt;/h3&gt;

&lt;p&gt;Usernames often follow patterns, making them easier to guess.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Example:&lt;/strong&gt; Many companies use email addresses as usernames, like “&lt;a href="mailto:firstname.lastname@company.com"&gt;firstname.lastname@company.com&lt;/a&gt;.” High-level accounts often use simple names like “admin” or “administrator,” which attackers know to try first.&lt;/p&gt;

&lt;h4&gt;
  
  
  Checking for Publicly Visible Usernames
&lt;/h4&gt;

&lt;p&gt;Attackers can look for usernames on public pages. Sometimes websites unintentionally reveal usernames through profile links or in HTTP responses, providing attackers with information for brute-force attempts.&lt;/p&gt;

&lt;h3&gt;
  
  
  Brute-Forcing Passwords
&lt;/h3&gt;

&lt;p&gt;While strong passwords are harder to guess, attackers know common tricks users apply to meet password requirements. For example, users might change “mypassword” to “Mypassword1!” to meet complexity rules. Attackers exploit these patterns by targeting predictable variations.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Example:&lt;/strong&gt; If the original password “mypassword” is too weak, the user might create “Mypassword1!”. Attackers know these patterns, making brute-force attacks more efficient.&lt;/p&gt;

&lt;h3&gt;
  
  
  Username Enumeration
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Username enumeration&lt;/strong&gt; allows attackers to discover valid usernames by observing system responses.&lt;/p&gt;

&lt;h4&gt;
  
  
  How It Works
&lt;/h4&gt;

&lt;p&gt;When entering a correct username with a wrong password, some sites give a different error message than for an incorrect username. This helps attackers confirm if a username exists, reducing the work needed to brute-force the password.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Example:&lt;/strong&gt; If Carlos enters “Carlos123” with an incorrect password, the site might say, “Incorrect password,” rather than “Username not found.” This confirms to an attacker that “Carlos123” is a valid username.&lt;/p&gt;




&lt;p&gt;&lt;strong&gt;Acknowledgment&lt;/strong&gt;: This document references information from &lt;a href="https://portswigger.net/web-security/" rel="noopener noreferrer"&gt;PortSwigger Web Security&lt;/a&gt; and ChatGPT.&lt;/p&gt;




</description>
      <category>webdev</category>
      <category>security</category>
    </item>
    <item>
      <title>Horizontal privilege escalation</title>
      <dc:creator>Golam Mostafa</dc:creator>
      <pubDate>Mon, 28 Oct 2024 05:54:24 +0000</pubDate>
      <link>https://dev.to/golam_mostafa/horizontal-privilege-escalation-f7h</link>
      <guid>https://dev.to/golam_mostafa/horizontal-privilege-escalation-f7h</guid>
      <description>&lt;p&gt;&lt;strong&gt;What is Horizontal Privilege Escalation?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Horizontal privilege escalation is when a user can see &lt;strong&gt;another user’s data&lt;/strong&gt; that they shouldn’t have access to. For example, if you can view your account but change the &lt;strong&gt;URL&lt;/strong&gt; to see someone else’s account, that’s a security problem called &lt;strong&gt;Insecure Direct Object Reference (IDOR)&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Example of IDOR&lt;/strong&gt;&lt;br&gt;&lt;br&gt;
Say your account page has this URL:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;https://example.com/myaccount?id=123
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;If someone changes &lt;code&gt;id=123&lt;/code&gt; to a different number, they could accidentally see &lt;strong&gt;another user’s account&lt;/strong&gt;. This happens because the website isn’t protecting users’ data properly.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;How Some Sites Try to Prevent It&lt;/strong&gt;&lt;br&gt;&lt;br&gt;
Websites sometimes use special codes, like long &lt;strong&gt;GUIDs&lt;/strong&gt; instead of numbers, to make guessing harder. But even these codes can show up in other parts of the website, like messages or comments, where they can be misused.&lt;/p&gt;

&lt;p&gt;Horizontal privilege escalation exposes &lt;strong&gt;private data&lt;/strong&gt; and shows why websites need strong &lt;strong&gt;security controls&lt;/strong&gt; to protect each user’s information.&lt;/p&gt;




&lt;p&gt;&lt;strong&gt;Acknowledgment&lt;/strong&gt;: This document references information from &lt;a href="https://portswigger.net/web-security/" rel="noopener noreferrer"&gt;PortSwigger Web Security&lt;/a&gt; and ChatGPT.&lt;/p&gt;




</description>
      <category>webdev</category>
      <category>security</category>
    </item>
    <item>
      <title>Unprotected Functionality</title>
      <dc:creator>Golam Mostafa</dc:creator>
      <pubDate>Tue, 22 Oct 2024 17:44:24 +0000</pubDate>
      <link>https://dev.to/golam_mostafa/unprotected-functionality-2f7l</link>
      <guid>https://dev.to/golam_mostafa/unprotected-functionality-2f7l</guid>
      <description>&lt;p&gt;&lt;strong&gt;Title: Vertical Privilege Escalation&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Vertical privilege escalation happens when regular users access admin-only areas due to weak access control and vice versa.&lt;/p&gt;

&lt;h3&gt;
  
  
  Example:
&lt;/h3&gt;

&lt;p&gt;A user types &lt;code&gt;example.com/admin&lt;/code&gt;. If there’s no restriction, they can access the admin panel without permission.&lt;/p&gt;

&lt;h3&gt;
  
  
  Key Points:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Direct URL Access&lt;/strong&gt;: Typing sensitive URLs like &lt;code&gt;/admin&lt;/code&gt; can bypass security.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;robots.txt Exposure&lt;/strong&gt;: Can accidentally reveal admin URLs.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Brute Force&lt;/strong&gt;: Attackers guess URLs to find admin pages.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Dangers:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Unauthorized changes, data access, or system takeover.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Prevention:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Use strict role-based access controls.&lt;/li&gt;
&lt;li&gt;Always secure sensitive areas, don’t rely on hidden URLs.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Title: The Flaw of Security by Obscurity&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Hiding sensitive functionality behind a hard-to-guess URL isn’t true protection. This is known as "security by obscurity."&lt;/p&gt;

&lt;h3&gt;
  
  
  Example:
&lt;/h3&gt;

&lt;p&gt;An admin URL like &lt;code&gt;insecure-website.com/administrator-panel-yb556&lt;/code&gt; might seem secure because it's not guessable. But if the URL is in the JavaScript, any user can inspect the code and find it.&lt;/p&gt;

&lt;h3&gt;
  
  
  Key Points:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Hidden URLs&lt;/strong&gt; aren’t real security.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Visible in Code&lt;/strong&gt;: Scripts or code can leak sensitive URLs to regular users.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Solution:
&lt;/h3&gt;

&lt;p&gt;Always enforce strict access control; never rely on hiding URLs.&lt;/p&gt;




&lt;p&gt;&lt;strong&gt;Acknowledgment&lt;/strong&gt;: This document references information from &lt;a href="https://portswigger.net/web-security/" rel="noopener noreferrer"&gt;PortSwigger Web Security&lt;/a&gt; and ChatGPT.&lt;/p&gt;




</description>
      <category>webdev</category>
      <category>cybersecurity</category>
    </item>
  </channel>
</rss>
