标签：#X

The symptom is simple: you open /dashboard?search=invoice&page=2 , copy an old snippet, and get undefined , stale values, or the wrong API entirely. The root cause is that Next.js now has two routing models, and the correct query-string API depends on where you read the params: App Router Server Component page: use the searchParams prop App Router Client Component: use useSearchParams() Shared client component across both routers: useSearchParams() still works Here is the exact fix for each case. The App Router server-side fix If you are inside app/.../page.tsx , use the page prop. In the current Next.js docs, searchParams is a promise in modern App Router pages. // app/dashboard/page.tsx export default async function Page ({ searchParams , }: { searchParams : Promise < { [ key : string ]: string | string [] | undefined } > }) { const { search = '' , page = ' 1 ' } = await searchParams return ( < main > < h1 > Dashboard </ h1 > < p > Search: { search } </ p > < p > Page: { page } </ p > </ main > ) } Use this when the query string affects data fetching, pagination, filtering, or metadata for the page itself. The App Router client-side fix If the component is interactive and already marked 'use client' , use useSearchParams() from next/navigation . ' use client ' import { useSearchParams } from ' next/navigation ' export default function SearchSummary () { const searchParams = useSearchParams () const search = searchParams . get ( ' search ' ) ?? '' const page = searchParams . get ( ' page ' ) ?? ' 1 ' return ( < p > Searching for < strong > { search || ' everything ' } </ strong > on page { page } </ p > ) } Two details matter: useSearchParams() is read-only. In the App Router docs, Next.js explicitly recommends the page searchParams prop if you are already in a Server Component page. The shared-component pattern that survives both routers This is the cleanest answer if you are migrating gradually or sharing a search bar between pages/ and app/ . ' use client ' impo

Introduction When you're scaling infrastructure or managing network security, proxies become essential tools—but they solve fundamentally different problems. A reverse proxy sits between your users and your backend servers, while a forward proxy sits between your users and the internet. This distinction might sound academic, but it shapes your entire architecture: from load balancing and security posture to compliance requirements and cost structures. Choosing the wrong proxy type can lead to bottlenecks, security vulnerabilities, or unnecessary infrastructure complexity. This article walks you through real-world scenarios, pricing considerations, and decision frameworks to help you deploy the right solution. Forward Proxies: Controlling Outbound Traffic What Forward Proxies Do A forward proxy intercepts requests from your internal network and forwards them to external servers on the internet. From the external server's perspective, the proxy is the client—the real origin of the request is masked or modified. Common use cases include: Employee internet access control : A company deploys a forward proxy so IT can block malicious domains, filter content, and enforce acceptable use policies Data residency compliance : A financial services firm routes all outbound API calls through a forward proxy in a specific geographic region to meet regulatory requirements Web scraping at scale : When extracting data from multiple websites, forward proxies rotate request sources to avoid IP-based blocking DDoS mitigation for outbound traffic : Distributed request aggregation through a forward proxy can reduce fingerprinting risks Pricing and Infrastructure Costs Forward proxies typically charge per: Concurrent connections : Enterprise solutions like Zscaler or Palo Alto Networks start around $5–15 per user/month Data transferred : Cloud-based forward proxies charge $0.05–$0.30 per GB, depending on geography and provider IP rotation : Proxy services offering residential IPs (for non-

"We could really be facing the great filter."

A syndication job noticed before I did A scheduled task publishes one blog post a day to a developer community. It fetches the article from my own site, converts it, and posts it. At 10:00 it failed four times with this: Server error '521 <none>' for url 'https://neuragrowth.co/blog/schema-grammar-ceiling/' 521 is Cloudflare saying the origin server did not answer. So the interesting failure was not in the syndication job at all. My whole site was down, and had been for over three hours by then. The server itself was fine: four days of uptime, load under 0.2, disk at eight percent. But systemctl is-active nginx said failed , and nothing was listening on 80 or 443. nginx resolves your upstreams before it starts The journal had the whole thing in three lines: 06:49:54 systemd[1]: Stopping nginx.service... 06:49:54 nginx[36027]: [emerg] host not found in upstream "example-backend.tld" in /etc/nginx/sites-enabled/site:104 06:49:54 nginx[36027]: nginx: configuration file test failed Line 104 was a small proxy I had added months earlier so the public site could forward one form endpoint to a backend on a different host without revealing its name: location = /api/lead-capture { proxy_pass https://example-backend.tld/api/lead-capture ; proxy_ssl_server_name on ; proxy_set_header Host example-backend.tld ; } When proxy_pass contains a literal hostname, nginx resolves it while parsing the configuration , and treats failure as a fatal config error. That resolution happens inside ExecStartPre=/usr/sbin/nginx -t , so a name it cannot look up means the unit never starts. The config was not wrong. It was valid before the restart and valid after, and nginx -t passed by hand seven hours later. It was invalid for about one second. Why DNS was gone for exactly that instant Ten seconds of journal, reconstructed: 06:49:44 apt-daily-upgrade.service starts 06:49:53 "Reexecution requested ... (unit apt-daily-upgrade.service)" 06:49:53 systemd reexecuting (it had just upgraded itself) 06:49

The Challenge: Realtime in the Age of Server Components The paradigm shift toward React Server Components (RSC) and the Next.js App Router has fundamentally changed how we architect web applications. We are now defaulting to server-side rendering, which is fantastic for performance, SEO, and initial load times. However, a common friction point arises when we need to inject high-frequency, bidirectional realtime data into these server-rendered pages. Too often, developers fall into the trap of importing heavy socket libraries directly into their server components or wrapping their entire application in massive context providers, effectively bloating the client bundle and negating the performance gains of the App Router. The Solution: The "Client Island" Pattern Instead of fighting the architecture, we can embrace "Client Islands"—a pattern where we isolate the stateful, client-side logic into a tiny, focused leaf component. By keeping the WebSocket management strictly client-side, we ensure that our server-rendered pages remain lightweight, fast, and cacheable. Implementing the WebSocket Island The goal is to keep the WebSocket connection lifecycle outside of the rendering flow. We utilize useEffect to manage the connection, ensuring it only runs on the client, and we tap into data fetching libraries like TanStack Query or SWR to surgically update the UI. ' use client ' ; import { useEffect } from ' react ' ; import { useQueryClient } from ' @tanstack/react-query ' ; export function RealtimeSync ({ token }) { const queryClient = useQueryClient (); useEffect (() => { const ws = new WebSocket ( `wss://realtime.example.com?token= ${ token } ` ); ws . onmessage = ( event ) => { const data = JSON . parse ( event . data ); queryClient . setQueryData ([ ' items ' ], data ); }; return () => ws . close (); }, [ token , queryClient ]); return null ; // This component renders nothing, just manages the side effect } Persistence via RootLayout To prevent the connection from dropp

When you're building a multi-tenant app, there's one bug category that's worse than any other: a user seeing someone else's data. Not a crash, not a broken button — a genuine privacy failure. I recently built a Next.js + Supabase + Stripe starter kit, and before I'd call the database layer "done," I wanted to actually prove the security held, not just assume it did because the code looked right. The setup Supabase's Row Level Security (RLS) lets you write policies directly in Postgres that filter rows based on who's asking — the database itself becomes the security boundary, not just your application code. That's powerful, but it also means a single wrong policy (or a missing one) silently exposes everything. Here's the policy pattern I used for an owner-scoped table: create policy "projects: owner reads" on public . projects for select to authenticated using (( select auth . uid ()) = owner_id ); Simple enough. But "simple enough" is exactly the kind of thing worth verifying rather than trusting. The actual test Rather than just trusting the policy, I ran an impersonation test directly in the SQL editor: begin ; set local role authenticated ; set local request . jwt . claims = '{"sub":"<a-real-user-id>"}' ; select id , name from public . projects ; rollback ; This temporarily pretends to be a specific user (inside a transaction that touches nothing) and asks: what can this user actually see? Run it with the real owner's ID — you get their rows. Run it with a fake or different user's ID — you should get zero rows back, not an error. That's the key detail: RLS filters rows out silently rather than throwing a permission error, so "nothing happened" is actually the success signal, not a bug. I did the same check for writes — attempting to delete another user's row from a different account's session, confirming it returns 0 rows affected rather than either succeeding or throwing. Why this matters more than it seems It's easy to write an RLS policy that looks right and s

In exchange for free stuff, devices make home connections part of a proxy network.

Debian voted to allow developers to use AI tools in their contributions to the Linux distribution's "development, maintenance, [and] documentation." The new policy on AI acknowledges that "responsible" use of AI can improve developers' productivity, and goes on to say, "generative AI is neither exempt from nor subject to special rules beyond the standards already […]

Dealing with multiple Excel or CSV files is a common task in business. Whether it is sales reports from different regions, customer data across various campaigns, or financial records by month, the need to combine these files into a single, cohesive dataset is constant. Manually copying and pasting or even using complex formulas can quickly become a time sink, prone to errors, and a source of frustration. What if you could automate this repetitive process? Imagine setting up a workflow that automatically merges your Excel files for you. That is where Microsoft Power Automate comes in. And when your data is messy, inconsistent, or riddled with duplicates, AI tools can take your automation to the next level. This guide will walk you through building robust workflows in Power Automate to combine your Excel workbooks. We will also explore how AI can address the often overlooked challenge of data cleaning and standardization, turning disparate data into a clean, unified source. Why Automate Excel Merges? The benefits of automating Excel data consolidation extend beyond simply saving time. Consider these advantages: Time Savings: Free up hours spent on manual data handling, allowing you to focus on analysis and strategic tasks. Reduced Errors: Eliminate human error from copy-pasting, formula mistakes, or missing data. Consistency: Ensure data is merged and formatted uniformly every time, regardless of who runs the process. Scalability: Easily handle increasing volumes of files without proportional increases in manual effort. Timeliness: Get up-to-date consolidated reports faster, enabling quicker decision-making. The Old Way: Manual Merges and VBA Limitations For years, consolidating data meant either painstaking manual copy-pasting, using VLOOKUP or INDEX/MATCH across sheets, or resorting to VBA (Visual Basic for Applications) scripts. Manual methods are slow and error-prone, especially with large datasets or many files. VBA offered a significant improvement, providing c

While Trump administration cuts have contributed to the epidemic of foodborne illnesses this summer, there are also deeper issues that make the American food supply chain susceptible to parasites and bacteria outbreaks.

In this episode, Scott Jenson, a veteran UX designer known for his work on the Macintosh, Google Maps, and Chrome examines the long-term stagnation of desktop operating systems and the limitations of current mobile and cloud-centric models. By Scott Jenson

Every self-hosted project I run starts the same way: a brand new VPS and about twenty minutes of setup before I install a single application. That twenty minutes is what separates "my server" from "someone else's crypto miner." A fresh box with a public IP starts getting probed within minutes, and the default configuration on most images is built for convenience, not safety. This is the secure baseline I set up on every new server, before Docker, before n8n, before anything else. It is also the starting point our production n8n guide assumes you already have. Every command below was checked against current Ubuntu LTS documentation, and I flag the parts that genuinely need a real server to verify. Key takeaways Never do daily work as root. Create a sudo user and log in as that instead. Use an SSH key and turn password login off, but only after you confirm the key works. Deny everything at the firewall by default, then open only the ports you actually use. Turn on automatic security updates so patches land while you sleep. If you plan to run Docker, remember that published ports skip UFW. Bind them to 127.0.0.1 . Prerequisites A VPS running a current Ubuntu LTS. Both 24.04 "Noble Numbat" and 26.04 "Resolute Raccoon" work well. I run long-lived boxes on Hostinger VPS hosting , which is also what powers the n8n guide. An SSH key pair on your own machine. If you do not have one yet, Step 3 creates it. A terminal, and a note of your provider's recovery console. Most hosts, Hostinger included, give you a browser based console in their control panel. That is your way back in if you ever lock yourself out, so find it before you start. Disclosure: some links in this guide, including the Hostinger link above, are referral or affiliate links. If you sign up through them we may earn account credit or a commission, at no extra cost to you. We only point at tools we actually run. Step 1: Log in and update the system Right after the server boots, log in with the credentials your pr

Dirk Lemmerman has released FlexGanttFX as an open-source resource-scheduling framework under the AGPL license. This JavaFX library enables Gantt chart creation for various industries, optimizing performance with a Canvas rendering method. The framework includes features for task dependency modeling and direct editing, accommodating diverse project planning needs. By Erik Costlow

Teaching an AI agent to upgrade .NET, React, and Next.js apps for real — not just talk about it Every engineering team has that repo. The one running a framework version from three or four years ago. Everyone knows it needs an upgrade. Nobody wants to be the one who breaks production doing it. That's the problem UpgradePilot — an open-source, multi-agent upgrade pipeline — is built to solve. And this week we shipped the piece that made it stack-agnostic: real, working upgrade automation for .NET, React, and Next.js, including repos that mix a .NET backend with a React or Next.js frontend in the same codebase. Here's what that actually means, because "AI upgrades your code" is a claim that's earned a lot of well-deserved skepticism. The design principle: shell out to the real tool, never fake it The easy version of this feature is an LLM that reads your package.json, guesses at new version numbers, and writes some plausible-looking code changes. That's not what we built. Every step in UpgradePilot's pipeline calls the actual toolchain: .NET — real dotnet restore, dotnet build, dotnet list package --outdated, dotnet ef migrations add. Package version bumps are verified by an actual restore, not assumed to work. React / Next.js — real npm install, npm run build, npm outdated. Codemods run through the actual react-codemod and @next /codemod CLIs — we pulled the real transform names directly from those projects' GitHub repos rather than guessing, because a fabricated transform name just fails at runtime. Target versions aren't invented. PackageTargetVersions come from dotnet list package --outdated and npm outdated — the same commands you'd run yourself. Codemod selection isn't invented either. UpgradePilot pulls React's and Next.js's own GitHub release notes, classifies breaking changes, and matches them against a verified catalog of real codemod transforms. If a step can't do something for real, it says so — with a confidence score and an explanation — instead of prete

During your birthday week, you can claim a special gift from Xbox. Let's see what it is and how to claim it.

Welcome back to TechCrunch Mobility, your hub for the future of transportation and now, more than ever, the role AI is playing in it.

Help wanted: validate a React faceted search SPFx sample in SharePoint Online A new read-only React faceted search sample is ready for the PnP SharePoint Framework webparts repository: Pull request: https://github.com/pnp/sp-dev-fx-webparts/pull/6480 Sample: https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-faceted-search The web part uses SharePoint Search REST ( /_api/search/query ) to search the current site. It supports: Search terms FileType and ContentClass refiners Result counts and metadata Safe encoded query/refiner values Loading, empty, access-denied, throttling, error, and retry states Responsive, accessible Fluent UI rendering The implementation is intentionally read-only and does not use a custom backend or Microsoft Graph. Local verification completed: 4/4 Jest tests passed TypeScript and webpack build passed ESLint passed Production .sppkg packaging passed Gallery metadata validator corrected and rerun successfully Tenant validation is still needed. If you have a SharePoint Online tenant, please test search indexing, result links, refiners, permissions, empty/error states, and narrow web-part widths. Real screenshots and negative findings are welcome; no local screenshot is being presented as tenant evidence. Please share feedback on the pull request. Thank you!

Help wanted: validate a configurable SharePoint list SPFx sample I have opened a new SharePoint Framework sample for a read-only, configurable list and records browser: Pull request: https://github.com/pnp/sp-dev-fx-webparts/pull/6476 The sample targets common SMB/SME data-view scenarios without reimplementing SharePoint’s editing experience. It uses React 17, Fluent UI v9, PnPjs v4, and SPFx 1.23.2. What the sample does Configures a SharePoint list title and visible internal fields. Uses explicit PnPjs $select / $expand queries and bounded pages. Supports text, number, currency, date, Boolean, choice, hyperlink, and person fields. Provides sorting, bounded paging, optional search, responsive table/card views, safe links, and native item-form links. Includes loading, empty, retry, permission, throttling, generic error, keyboard, and accessible status states. Keeps the MVP read-only: no create, edit, delete, attachments, bulk actions, or custom query language. Help needed Could someone with access to a SharePoint Online tenant please try the sample and report back on: Configuring it against a small ordinary list. Field discovery and supported field rendering. Sorting, search, paging, empty results, and error/retry behavior. Permission handling and narrow-viewport rendering. Keyboard operation and safe item links. One or two representative screenshots for the README. Dummy data is fine. Please remove or blur tenant names, site URLs, user names, record details, and all other sensitive information before sharing screenshots. The code builds and tests locally, but I do not currently have a tenant available for end-to-end validation. Tenant feedback and screenshots would materially help complete the pull request. Thank you to anyone who can spare the time to test it. sharepoint #spfx #opensource #react

Hey all 👋 Last episode a power cut exposed an uncomfortable fact: my cluster's entire memory lived in one SQLite-flavored database, on one laptop, bound to one Wi-Fi address, guarded by one aging battery. Four single points of failure in a trench coat. The fix isn't making that database unkillable. The fix is making it unimportant . If every manifest lives in git and something reconciles the cluster against git continuously, then "the datastore died" stops being a tragedy and becomes a reboot with extra steps. So: Flux . Here's the setup, and the four ways I face-planted installing it. 🗂️ The Shape of the Repo clusters/homelab/ flux-system/ <- Flux writes this at bootstrap; hands off infrastructure.yaml <- points at infrastructure/ apps.yaml <- points at apps/ infrastructure/ controllers/ <- Longhorn + Envoy Gateway HelmReleases configs/ <- GatewayClass, Gateway, StorageClasses apps/homelab/ airflow/ <- the actual point of all this Three Flux Kustomizations, chained: infra-controllers → infra-configs → apps , via dependsOn . That chaining is not decoration. My GatewayClass can't exist until Envoy Gateway's CRDs exist, and the CRDs arrive with the controller's Helm chart. Without dependsOn , Flux sprints ahead, tries to create a GatewayClass into a cluster that's never heard of GatewayClasses, and fails with the enthusiasm of a golden retriever running into a glass door. dependsOn plus wait: true turns that into: install controllers, wait until healthy , then configs, then apps. Boring. Sequential. Correct. The three great virtues. 🔑 Sidequest 1: The Token Bureaucracy flux bootstrap github needs a GitHub token, and the docs-diving summary is: Classic PAT: repo scope. Needed if Flux should create the repo. Fine-grained PAT (pre-created repo): Contents read/write, Metadata read, and — the one everyone misses — Administration read/write , because Flux installs an SSH deploy key on the repo, and deploy keys are an admin operation. Here's the nice part: the deploy key is

I’m looking for a little community help validating a new SharePoint Framework sample: React Flex Forms . What does it do? The sample contains two SPFx web parts: Form Designer — creates and manages one-page form definitions using supported SharePoint field types. Form Renderer — loads a published form, validates responses, and saves submissions to a SharePoint list. The sample includes automated tests and the local lint, build, and packaging checks are passing. The remaining gap is real-tenant validation and the static screenshots required for the PnP sample README. Could you help? If you have access to a SharePoint Online tenant and a few minutes to spare, please try the sample and capture: The Form Designer working in the SharePoint-hosted workbench. The Form Renderer displaying and submitting a published form. Dummy data is completely fine. Please remove or blur tenant, site, list, user, and other sensitive details before sharing. Feedback about provisioning, permissions, validation, submission, keyboard use, responsive behavior, dark theme, or high-contrast mode would also be very valuable. You can attach the scrubbed screenshots and observations directly to PR #6473 . The setup instructions are included in the sample README. This is a small request, but it would significantly speed up the final validation and help move the contribution toward completion. Thank you to anyone who can lend a tenant or share feedback. sharepoint #spfx #opensource #webdev