标签：#Web

So you asked Claude to animate something. Maybe a logo, a loading screen, a data viz. It spat out a neat HTML file with CSS keyframes, everything looks crisp in the browser — and now you need it as an MP4. The obvious approach is screen recording. Open QuickTime or OBS, hit record, play the animation, stop, trim. Works, kind of. Except it's not frame-perfect. If your machine lags for half a second, that lag is baked into the video. The animation runs at whatever speed your CPU felt like that afternoon. Completely non-deterministic. And the moment you tweak something — wrong colour, timing off by 200ms — you're setting the whole thing up again, which is just tiring. Not to mention that every time you hit record you start at a slightly different frame, so swapping the asset in your video editor becomes a pain because nothing lines up the same way twice. There's a better way. You can use htmlrec — a CLI tool that renders HTML animations to video frame by frame, without touching your screen. It controls the browser clock directly, so every frame is captured at exactly the right moment regardless of your machine's load. Pixel-perfect, every single time. Install it with: brew install dsplce-co/tap/htmlrec ffmpeg How to convert an HTML animation to video The reliable way to convert an HTML animation to video is to render it headlessly, frame by frame, instead of screen-recording it. Point a tool at your HTML file, let it drive the browser clock, and capture each frame at an exact timestamp: hrec render animation.html -o out.mp4 This works for any self-contained HTML/CSS animation — a logo reveal, a loading screen, a chart, or anything an LLM like Claude generated for you. The full step-by-step is below. The workflow 1. Get your animation from Claude (skip if you already have an HTML animation) Ask Claude for whatever you need. Something like: "Create an HTML/CSS animation of a logo appearing with a fade and slight upward motion, black background, 3 seconds" You'll get back

There's a quiet lie rotting at the heart of modern software development, and almost nobody wants to say it out loud: the industry is drowning in people who can ace a LeetCode interview, argue endlessly about architectural patterns, and hold strong opinions about tabs versus spaces — but who have never actually shipped a product that real people use. We've built an entire culture around the performance of engineering rather than the practice of it. Walk into any dev team today and you'll find brilliant people who can recite the SOLID principles from memory, who have strong feelings about hexagonal architecture, and who will spend three weeks bikeshedding a folder structure — but who have never felt the particular anxiety of watching your own code process a real user's real money. Never felt that accountability. Never shipped something and then lived with the consequences. That's a problem! The industry has confused credentials and vocabulary with competence. A computer science degree, a GitHub profile full of tutorial clones, and the ability to reverse a linked list in a whiteboard setting are now routinely mistaken for the ability to build software that matters. They're not the same thing. The people who actually make software work — who ship under pressure, who fix production bugs at 11pm, who make pragmatic calls with incomplete information — often look terrible on paper. They'll choose a boring, proven technology over the shiny new thing. They'll skip the elegant abstraction in favour of something they can debug in a hurry. They understand that a running system that's 80% right beats a perfect system that's still in design. AI has made this worse. Now you can generate plausible-looking code, confidently-written documentation, and technically-accurate architecture diagrams without ever having built a system that stayed up under real load, without ever having migrated a production database at 2am, without ever having owned something from idea to invoice. Knowing ho

We are all using AI to write code now. Whether it's Claude Code, Aider, or Copilot, the speed is incredible. But there is a glaring bottleneck we don't talk about enough: AI code is often just slightly broken. 🤖💥 It forgets an import, misses a type definition, or fails a test. Usually, you only find out after you push to GitHub. Your CI/CD pipeline turns red 🔴, and you end up polluting your Git history with a dozen commits titled fix: linting or fix: missing test variable . I recently found a repository called no-mistakes that solves this brilliantly. It acts as a local proxy between your terminal and GitHub, forcing AI to test and fix its own code before anyone else sees it. Here is why it's worth a look. 👇 😩 The Problem With Traditional Workflows Right now, developers handle broken code in two ways: The CI/CD Walk of Shame 🚶: You push code, wait 5 minutes for GitHub Actions to fail, pull the error locally, fix it, and push again. Pre-commit Hooks (Husky) 🐶: You set up local hooks. When you try to commit, it yells at you about formatting and blocks the commit until you manually fix it. Both methods are passive . They tell you something is broken, but they leave the cleanup to you. When you're using an AI coding agent to generate the code in the first place, manually babysitting its output defeats the purpose. 🚀 Enter no-mistakes no-mistakes is a CLI tool that intercepts your git push . Instead of sending your code straight to origin, it routes it through a localized validation pipeline. ⚙️ How it actually works: 🧱 The Hidden Sandbox: When you trigger it, it creates a temporary git worktree in the background. Your active editor stays completely undisturbed. ✅ Validation: It runs your tests, linter, and build steps inside that isolated sandbox. 🔁 The AI Feedback Loop: If a test fails, it captures the error log and hands it back to an AI agent, essentially saying: "You broke this test. Fix it." 🟢 The Clean Push: Once the AI patches the code and all tests pass, it push

Parallel AI Coding with Git Worktrees: Run Multiple Agents Without Conflicts Most parallel AI development problems stem from a single architectural mistake: multiple agents sharing the same working directory. Teams spin up three Claude Code instances, point them at the same project folder, and watch as file writes collide, branch checkouts interrupt each other, and lock files corrupt. The symptom looks like a race condition. The root cause is filesystem design. Git worktrees solve this by giving each agent its own isolated working directory while sharing a single .git repository. This distinction is critical. Developers get parallel execution without the storage overhead of full clones, and agents operate on separate branches without stepping on each other's file handles. The pattern has existed since Git 2.5, but AI coding workflows finally make it essential infrastructure. The Collision Problem: Why Multiple AI Agents Can't Share a Working Directory When you run git checkout feature-A in a directory where another process is reading files, the filesystem state changes underneath that reader. The other process doesn't see atomic transitions—it sees partial writes, missing files, and inconsistent dependency graphs. TypeScript compilers fail with "Cannot find module" errors. Dev servers crash because watched files disappeared mid-read. Lock files from package managers become corrupted when two agents run npm install simultaneously on different branches with different dependency trees. The obvious solution—staggering agent execution so only one runs at a time—defeats the purpose of parallel development. Teams that try this pattern end up with AI agents waiting in queue, each one blocking the next until it finishes. The bottleneck shifts from human typing speed to serial execution, and the productivity gains evaporate. Full repository clones work but waste disk space. A 2GB monorepo cloned five times for five agents consumes 10GB of redundant Git objects. Sparse checkou

Modern teams expect software to update instantly. Nobody wants to refresh a page every few seconds to see whether a task has moved from "In Progress" to "Done." Applications like Trello, Jira, and Linear have trained users to expect real-time collaboration. In this tutorial, we'll build a simplified real-time Kanban board using React, TypeScript, and WebSockets. Along the way, we'll cover project structure, state management, optimistic UI updates, and handling concurrent changes from multiple users. What We're Building Our application will support: Creating tasks Drag-and-drop task movement Real-time synchronization between users Optimistic updates Type-safe frontend architecture Tech Stack Frontend React TypeScript Vite React DnD Zustand Backend Node.js Express Socket.IO Database PostgreSQL Why WebSockets Instead of Polling? Many developers start with polling: setInterval (() => { fetch ( " /tasks " ); }, 5000 ); This works, but it's inefficient. Problems include: Unnecessary network requests Delayed updates Increased server load Poor user experience WebSockets maintain a persistent connection between client and server. Instead of asking: "Any updates yet?" the server simply says: "Here's an update." The result is lower latency and fewer network requests. Project Structure A scalable React project should avoid putting everything into a single components folder. Here's a structure that works well: src/ ├── api/ ├── components/ ├── features/ │ ├── board/ │ ├── columns/ │ └── tasks/ ├── hooks/ ├── store/ ├── services/ ├── types/ └── utils/ This feature-based organization scales much better than organizing solely by file type. Setting Up React Create the project: npm create vite@latest kanban-board cd kanban-board npm install Install dependencies: npm install zustand socket.io-client react-dnd react-dnd-html5-backend Defining Task Types Type safety becomes increasingly valuable as applications grow. export interface Task { id : string ; title : string ; description : s

Table of Contents Introduction Double-check everything Configure your Environment Variables Install/Update your Vendors Clear your Symfony Cache Install symfony/apache-pack Update composer.json public directory Build the assets Update Kernel.php Upload the project to cPanel Final Thoughts Introduction I'm new to Symfony and recently, I deployed a Symfony app to a shared hosting environment running cPanel with no SSH access. I could not figure out the best way to do it, let alone find useful resources online as most of them are outdated and felt inefficient. I faced a lot of errors like: failing to load the app with a 500 Internal Server Error, some static assets not loading, etc. I figured it out in the end. This motivated me to write this post to reduce the headache for other Symfony newbies like me. Alright, let's get into it. Most deployment guides online assume you can run Composer, clear caches, execute migrations, and run Symfony commands directly on the server. In shared hosting environments, that is often not possible so, my examples will assume you don't have it installed on the server. 1. Double-check everything The first step to building for production is double-checking everything if it's in intact. Yes, this is very important. In my case, I was faced with some static image assets failing to load because of wrong reference which was ignored on dev mode. I had something like: asset('/images/<filename> ) which was working in dev mode but failed to load the image in prod. the paths had to be like: asset('images/'). This was after checking how I defined other assets. So avoid things like this before hand. 2. Configure your Environment Variables For this, we will use the dotenv:dump command which is not registered by default, so you must register first in your services: # config/services.yaml services : Symfony\Component\Dotenv\Command\DotenvDumpCommand : ~ Then, run the command below. After running this command, Symfony will create and load the .env.local.ph

Working with modern APIs means living in JSON. But the moment your project touches a legacy enterprise system - a bank, a government service, or a SOAP endpoint that hasn't changed in a decade - you're suddenly dealing with XML. The challenge isn't just swapping syntax; it's understanding where the two formats are structurally incompatible, and what breaks silently when you ignore that. Why JSON and XML Don't Simply Map to Each Other JSON is compact and type-aware - it distinguishes between numbers, booleans, strings, and arrays natively. XML is verbose, treats all content as text, and has no concept of arrays. It only has repeated sibling elements. This gap is where most conversion bugs are born. A JSON array with just one item can silently become a plain object if your converter doesn't handle the edge case explicitly. The Three Biggest Conversion Pitfalls First is array ambiguity - XML has no array type, so a JSON array becomes repeated sibling elements. A single-item array is indistinguishable from a plain object unless your converter explicitly preserves the list context. Second is type erasure - XML flattens numbers, booleans, and strings into plain text, destroying the type information that many downstream systems depend on. Third is the single root element rule - JSON can have multiple top-level keys, but every valid XML document must have exactly one root element wrapping everything else. Handling Arrays the Right Way Always nest array items inside a named parent element. A JSON users array should produce a parent element containing individual child elements. This structure makes the list unambiguous to any downstream XML parser and prevents silent data loss during round-trips. Escaping Special Characters Characters that are perfectly valid inside a JSON string will break an XML parser immediately. Your conversion logic must escape these four: less-than becomes <, greater-than becomes >, ampersand becomes &, and double-quote becomes ". Skipping even one of

This article was originally published on hawksley.dev . I've owned the domain name hawksley.dev for a while now, but I've never done much with it aside from sending email. Over the weekend, I thought I might as well make good use of it and decided to create a blog. In the beginning, this site had a humble home page with some links to GitHub projects. A blog requires much more infrastructure for me to use it effectively. For one, it'd be great if I could just write my posts in Markdown and have them formatted by my project automatically. Having a look at the options available, the first that stood out was GitHub's Jekyll . It looked nice and had great integration with GitHub Pages, which I'm hosting with at the time of writing. However, it just felt too rigid. I needed something modern that I felt I could get my hands dirty with. Enter Astro. Why Astro In the grand scheme of things, the Astro framework is pretty new at just 5 years old. That hasn't prevented it from gaining popularity rapidly. It holds performance as a key design principle, anything that can be static will render statically. By default, it ships absolutely no JS to the browser, which felt perfect for my use case. I have no need for advertising or heavy tracking scripts weighing down my site. All I need is a place to write. Learning how to work with Astro was completely painless. I created a new GitHub repository and followed along with their very high-quality documentation to create a blog of my own. At the very end of it, I’d created a nice neat blog that loaded instantly and was easy to write for. I wasn't satisfied by using the tutorial's blog for my site, though, as it felt too cookie-cutter, and so I started again, now with confidence in the framework. The Design Decisions There were some definite design decisions I knew I wanted from the get-go. First-class light mode and dark mode support were a must. Plenty of blogs offered just one or the other, and after a bit of digging, it didn't seem tec

Configuring environment variables seems simple, but it frequently leads to two common issues in production-grade applications: Missing Variables: A developer adds a new variable locally but forgets to update the .env.example file. Other team members pull the changes, and their local environments crash. Leaked Credentials: A debug log like console.log(process.env) prints database connection strings or API tokens to the terminal, leaving them visible in plaintext logs. To solve this, we created @novaedgedigitallabs/envkit . It is a zero-dependency (other than Zod) utility that validates, loads, and masks environment variables, and keeps your example configurations updated automatically. Key Features Schema Validation: Define your environment variables with Zod to enforce types and formats. Log Masking: Automatically redact sensitive credentials in console output. Example Syncing: Automatically append missing variables to your .env.example file without overwriting comments or values. Module Support: Runs in ESM and CommonJS. Getting Started Install the package and Zod: npm install @novaedgedigitallabs/envkit zod Initialize your configuration in a file like env.ts : import { createEnv } from ' @novaedgedigitallabs/envkit ' ; import { z } from ' zod ' ; export const env = createEnv ({ schema : { DATABASE_URL : z . string (). url (), JWT_SECRET : z . string (). min ( 32 ), PORT : z . coerce . number (). default ( 3000 ), NODE_ENV : z . enum ([ ' development ' , ' production ' , ' test ' ]). default ( ' development ' ), }, secrets : [ ' JWT_SECRET ' , ' DATABASE_URL ' ], generateExample : true , // Appends new keys to .env.example at runtime }); Because the variables are validated using Zod, your editor will provide full TypeScript autocomplete and type safety: env . PORT ; // Resolved as a number env . JWT_SECRET ; // Resolved as a string Preventing Secret Leaks in Logs Logging environment configs is a common debugging habit. With envkit, any variables listed in the secre

One of the reasons I often find myself disagreeing with modern software trends is that many conversations revolve around features. How many features does it have? How quickly can we add more? What can we put on the marketing page? What can we announce next? Features matter. But I care far more about systems. Because at the end of the day, people don't buy features. They buy outcomes. And outcomes come from systems. The Car Analogy One of the easiest ways to explain my thinking is with cars. A car is made up of thousands of individual components. An engine. A transmission. Suspension. Brakes. Fuel systems. Electrical systems. Cooling systems. Sensors. Wiring. Each component is important. But nobody walks into a dealership and says: "I'd like to purchase six pistons, a transmission housing, and a fuel injector." They buy a car. They buy transportation. They buy a complete system. The individual parts only matter because they contribute to the overall experience. The customer doesn't want to think about every moving piece. They want to get in, turn the key, and drive. Drivers and Mechanics This is where I think technology often loses its way. Users are drivers. Engineers are mechanics. A driver should be able to: Start the vehicle Fill it with fuel Check the oil Wash it Perform light maintenance That's about it. They shouldn't need to understand combustion timing, transmission gearing, or electrical diagnostics to get to work. The mechanic, however, lives in the details. They tune the system. They replace parts. They troubleshoot failures. They recommend upgrades. They understand how the pieces fit together. Technology is exactly the same in my mind. Users should be able to focus on their goals. Engineers should focus on the machinery. Features Are Parts This is where I think software conversations sometimes become backwards. A feature is a component. A login screen is a component. A dashboard is a component. A database is a component. An API is a component. AI integra

I keep finding the same Stripe webhook bugs in SaaS launches Most early SaaS billing bugs are not in Stripe Checkout itself. They are in the glue around it: trusting the success redirect instead of the signed webhook parsing JSON before signature verification missing idempotency for retry events reflecting verifier errors from unauthenticated webhook routes updating subscription state without a replay/audit trail letting "Pro" access drift from the payment source of truth Over the last few days I have been shipping small public fixes around exactly this class of problem. Recent examples: Morphix: Cloudflare Worker Stripe webhook with signature verification, Supabase subscription sync, and event idempotency ledger https://github.com/yiyuanlee/morphix/pull/25 Open Mercato: hardened unauthenticated payment/shipping provider webhooks against raw verifier error reflection and missing rate limiting https://github.com/open-mercato/open-mercato/pull/2680 Covenant: webhook signatures hardened against replay and secret rotation gaps https://github.com/wienerlabs/covenant/pull/229 Volunteerflow: made a Stripe invoice.paid Founders Circle counter update transactional instead of partially committing user/counter state https://github.com/ppppowers/volunteerflow-project/pull/49 The pattern is boring in the best possible way: payment systems should be boring. The 48-hour version For a small SaaS that is about to turn on paid plans, I can take a bounded payment assurance sprint: inspect Checkout / webhook / subscription state flow verify signed webhook handling and raw-body behavior add idempotency around Stripe retry events ensure subscription status and entitlement state have one source of truth add a small regression test or smoke script leave a deploy/runbook note so the next failure is diagnosable Fixed scopes I am taking: $2,000 / 48 hours: one payment path hardened and documented $5,000 / 5 days: full launch pass across Checkout, webhook, subscription mirror, Pro gate, pricin

Introduction Nowadays, AI agents are becoming increasingly powerful at assisting users in their daily web activities. However, we cannot yet allow them to act completely autonomously—there is still a risk of them clicking on the wrong elements, for instance. In theory, these agents are capable of performing impressive tasks, provided they are guided step-by-step through the interface. The challenge here is not a lack of intelligence in the model, nor a shortage of web APIs to expose data to the agent. The core issue lies in the fact that the agent must currently "guess" its way through applications that were designed exclusively for humans. This is precisely the problem that WebMCP is here to solve. It is important to note that these are not intended to replace standard APIs as access points for an application. Instead, they provide a structured way for a web application to "instruct" the AI agent used in the browser on how to navigate its interface. This results in: Fewer misplaced clicks. Less trial-and-error when interacting with the UI. When utilized to their full potential, WebMCPs could redefine the user experience in the coming years. What is WEBMCP? As you may have guessed, WebMCP is a browser-side "guide/standard" for exposing tools to an AI agent directly from an active web page. During Google I/O, this new feature was introduced as a way for web applications to describe how a page functions—and what actions can be performed—to various AI agents. As a result, agents can execute these described actions faster, more efficiently, and with greater precision. Unsurprisingly, the syntax for creating these descriptions relies on JavaScript functions. These functions take natural language descriptions as parameters, along with structured schemas directly exposed from the web page. This is exactly where the power of WebMCP lies. Today, while we have Playwright (designed for end-to-end testing of web applications) and Playwright MCP (which extends this model to LLMs

built a dealer management system for a tea reseller (basically a billing/accounting app). The tech stack is: Frontend: Next.js 15 (App Router) Backend: Hono framework running on Bun Database: PostgreSQL with Drizzle ORM Auth: Better Auth (session-based, role-based access) About the business: ~400 customers (tea leaf suppliers) 5-10 staff users max Daily data entry (tea collection weights), monthly billing with deductions Database will be tiny — maybe 15 MB/year of pure text data They want it to feel like a desktop app but with data stored safely in the cloud Budget is very tight — ideally free or under $5/month What I've considered: Free tier stack (Vercel + Render + Neon) — $0 but Render free tier sleeps after 15 min, cold starts are annoying VPS (Hetzner/DigitalOcean ~$5/mo) — Hostinger Node.js hosting — doesn't support Bun or PostgreSQL PWA for the "desktop app" feel — seems like the right call My questions: For developers who build apps for small businesses in developing countries — what's your go-to deployment strategy? Is the free tier stack (Vercel + Render + Neon) reliable enough for production? Would you switch from Bun to Node.js just to have more hosting options? The Bun lock-in is becoming a pain. Is there a better approach I'm not seeing? Something between "run it on a local PC" and "pay for a VPS"? How do you handle backups for clients who can't manage their own infrastructure? Any advice appreciated. This is my first time deploying a production app for a real business and I want to get it right — it handles their financial data. submitted by /u/Iamxv [link] [留言]

tl;dr: I'm looking for a visual HTML builder - not a design tool, but something that specifically builds code Hi everyone, I feel the need to explain before anything, why I'm looking for this. Pls read the explanation before coming for me with "why don't you just write HTML and CSS normally, what's wrong with you". I've been a dev for 12+ years, mostly specializing in complex software. Give me a design system, business requirements (not even a fleshed out plan) and I'll give you something that works and is futureproof, as much as I can predict the future anyway. In all of that, I've always struggled with writing full pages with HTML and CSS. I find it hard to keep the whole context in mind and I've never come up with a way to structure it sensibly. Frameworks like Tailwind CSS drive me nuts because why do I need to memorize specific classes instead of just writing CSS? Anyway, that's not the point. Recently I realized that I need to diversify my service offering, and therefore start offering more of these custom built websites. But now I'm running into my personal limitation of being trash at HTML/CSS. AI isn't much help here because Claude Code is absolute garbage in implementing designs, and I'm not paying for 3 different AI subscriptions - that would work against my goal of making money. So now I'm looking for a more visual HTML and CSS editor. Design tools like Figma are one thing, but I'd like something that is made for people who know HTML, but just don't want to write it themselves. The workflow I imagine is something like this: I start with a blank slate. It prompts me to add fonts, colors and other foundational design system elements. This would set CSS variables. From here I can proceed to create pages or complete the design system with other components (buttons, inputs, etc) Each page contains common elements (header, footer, sidebar, whatever) + a blank area for me to drag and drop elements into. As I use the elements, I should be able to set classes, id

HELLO r/webdev , I GOT MY FIRST FREELANCE GIG =D! I was lucky enough to be in the right place at the right time, mentioned I am studying a degree in IT specialising in Web dev and design and was asked to make their e-commerce website for their new business. I am so happy and so excited, but I also have my worries. I'm worried I mess something up, especially when it comes to payment processing and data privacy. Is there ANY advice you can give a newbie, ESPECIALLY someone who is doing their first commissioned website. I'm just so anxious that I leak user data, don't put up the correct legal things (like privacy policies, etc.), mess up the storefront, all that jazz. Is there anyone who can maybe give me some helpful advice? I'm based in South Africa if that helps. submitted by /u/dvjar [link] [留言]

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

I deployed a Slack bot app built on the Claude Agent SDK to Railway, and immediately hit a string of landmines around the SDK itself. Every one of them was the "the logs don't tell you what's wrong" kind, and the second one in particular ate a lot of my time. Since other people are likely to get stuck in the same spots, I'm writing it down. This is aimed at junior-to-mid-level devs using @anthropic-ai/claude-agent-sdk ( query() ) in Node.js. TL;DR Gotcha 1 : In a root container, bypassPermissions isn't allowed, and the child process dies with code 1 . Worse, stderr is swallowed, so you can't see why. Gotcha 2 : stdio MCP servers don't wait for connection by default, so on turn 1 the tool list is empty — and the model "acts out" tool calls and fabricates the results. Gotcha 3 : haiku shows up in your API logs, but that's not the model degrading — it's by design. It's used for internal chores. Gotcha 1: bypassPermissions doesn't work in a root container What happened Code that ran fine locally started dying with code 1 the moment I deployed it to Railway — the agent did nothing and just exited. The entire error message was essentially this: Error: Claude Code process exited with code 1 That tells you nothing. The only stack trace was from my app; what the child process (the claude binary) actually said before dying was a complete black box. The cause query() spawns a claude binary internally. That binary refuses --dangerously-skip-permissions (which the SDK calls permissionMode: "bypassPermissions" ) when running as root or under sudo . It's a safety measure — skipping all permission checks as root is far too dangerous. Railway, like many container environments, runs as root by default, so if you've set bypassPermissions you will always hit this. You can't catch it locally if you're running as a normal user. Why there are no logs This is the nasty part. Unless you pass an options.stderr callback, the SDK discards the child process's stderr with "ignore" . In other wor

Announcing Limn Engine I'm excited to launch Limn Engine — a lightweight, zero-dependency HTML5 Canvas game framework for the browser. No npm install. No build step. No bloated dependency tree. Drop in a single script and start making 2D games. The Core Idea: Display + Component Limn Engine is built around two classes that cover 90% of what you need in a 2D game: Display — The Game Shell A singleton Display class that manages the canvas, runs the game loop, handles keyboard and mouse input, controls the camera, and manages scenes. Setting up a game is a one-liner: const display = new Display (); display . start ( 800 , 600 ); Let me try creating it step by step . Component — Every Object in Your Game A unified Component class that combines position, size, color/image, velocity, physics, and collision detection. No separate "Sprite" and "Body" classes — one object does it all. const player = new Component ( 40 , 40 , " blue " , 100 , 100 ); Components support three modes: Rectangle — solid color shapes for rapid prototyping Image — loaded from spritesheets or single image files Text — the Tctxt subclass for text elements with backgrounds, padding, and alignment Key Features Dual-Canvas High-Performance Rendering Call display.perform() to activate dual-canvas mode. Static backgrounds and tilemaps are drawn once to an offscreen buffer, then composited as a single drawImage() call per frame. This dramatically reduces draw calls and improves frame rates for complex scenes. display . perform (); display . start ( 800 , 600 ); Tilemap Levels Define game worlds as 2D arrays and initialize the tilemap engine with one call. Supports dynamic tile placement during gameplay — great for destructible environments and breakable blocks. display . map = [ [ 1 , 1 , 1 , 1 , 1 ], [ 1 , 0 , 0 , 0 , 1 ], [ 1 , 0 , 9 , 0 , 1 ], [ 1 , 0 , 0 , 0 , 1 ], [ 1 , 1 , 1 , 1 , 1 ] ]; display . tileMap (); Sprite & AnimatedSprite Load horizontal spritesheets and define named animation clips (idle,

Last Sunday I shared nestjs-docfy, a small library to move Swagger decorators out of NestJS controllers into companion *.controller.docs.ts files. The reception was better than I expected, and a lot of the feedback pointed in the same direction: the separation is nice, but writing those docs files by hand is still tedious. So I spent some time on that, and there's quite a bit new in this release. A CLI that writes the boilerplate for you The biggest addition is a generate command that reads your project with static analysis (no code execution, no ts-node overhead) and produces a pre-filled docs file for every controller: npx nestjs-docfy generate The generated file comes with inferred summaries, response types, and common error responses already in place. You edit from there instead of starting from scratch. It's idempotent by default, running it again won't touch files that already exist. When you add a new endpoint and want to merge only the new method block without losing your existing edits: npx nestjs-docfy generate --force The CLI auto-detects your project layout, so monorepos (Nx, Nest CLI, generic packages/ or apps/ structures) work without any configuration. There's also a --dry-run flag if you want to preview output before writing anything to disk. A check command for CI The other side of the workflow is keeping docs in sync as the codebase evolves. The check command exits with code 1 if any controller has undocumented methods or no companion file at all: npx nestjs-docfy check Output looks like this when something is out of sync: ✖ UsersController, undocumented methods: updateProfile, deleteAccount → run nestjs-docfy generate --force to merge new methods ✖ 2 controller(s) out of sync. Drop it into your pipeline and docs drift gets caught before it reaches main. Type-safe method keys The docs() function now enforces that every key in config.methods actually exists on the controller class. Typos are a compile error, not a silent runtime warning: docs ( User

Hi what are the checks we need to do after making a website idk what type of checks are there i made a website using claude and lovable used free version of both for backend i used supabase now i want to check if my website is all good so that i can add it in my portfolio i am a btech 1st year student have a very basic level of coding submitted by /u/Shivansh_Yadav07 [link] [留言]