Building AI Apps Live from Cairo 🔴
Want to back the stream? The «داعم» membership on YouTube is EGP 60 a month: badges, emoji, and I answer your questions first on stream. Become a supporter
The gist
The stream centers on an extended practical experiment in refining a website with coding agents, especially hero-section motion, a dotted grid, connector lines, and a milestone progress bar. Luqman uses live previews, screenshots, and browser inspection to verify rendered results rather than trusting code alone, while investigating missing CSS keyframes, visual regressions, server or port confusion, and effects that disappear after refresh. Some motion became visible after switching to the project’s existing motion library, but other details remained under refinement; he emphasized limiting change scope and preserving good states in Git. He also explored a command center for projects with multiple agent roles and shared JSON status, while recognizing the risks of over-automation and of the management tool becoming a distraction. The choice between automated pipelines and steerable interactive sessions remained unresolved. Based on personal experience rather than a comprehensive benchmark, he compared Cursor, Warp, Antigravity, and Codex across embedded previews, terminal sandboxing, runtime control, context handoff, and usage limits. Audience questions covered WordPress versus newer platforms, Supabase and Firebase, turning a website idea into an Android app, and whether WordPress suits IPTV or OTT platforms, with an emphasis on content rights and legal risks. Unresolved issues included several interface animations, recovery of a deleted effect, YouTube API consumption, and YouTube’s inconsistent display of the live-stream duration.
108 moments from the stream
- 2:33:28
Ask the Coding Assistant to Confirm Its Understanding Before Execution
While refining a visual effect, Luqman specifies a simpler, more professional result: one green line connecting two elements instead of several lines and dots. He explains his approach of asking the coding assistant to restate its understanding before execution, making it easier to spot and question differences between the request and the implementation.
- 2:37:16
Refining Website Sections and Planning Arabic Support
Luqman visually reviews the page sections, simplifies some elements, and adjusts the grid background and its visibility while prioritizing content over less important details. He also notes that the site is heavily English-oriented and considers adding more Arabic or making the interface bilingual.
- 2:43:43
Restoring a Code-Rain Effect and Diagnosing a Disappearing Animation
He asks to restore an earlier code-rain effect in the hero section from project history or another recoverable source, and observes that an animation elsewhere disappears after scrolling away and returning, which may explain why it seemed absent before.
- 2:46:36
Reviewing Coding-Agent Suggestions and Preserving Work
He cautions against accepting a coding agent’s design changes without oversight, recommending that developers retain their own design judgment, review the results, and preserve good states in Git so they can be restored.
- 2:49:28
Exploring Coding-Agent Plugins and Skills
He experimentally inspects available plugins, skills, and agents, with references to GitHub and MCP servers, and says that the /reload plugins command lets him see what has been reloaded. Several plugin names and details are unclear in the captions.
- 2:53:44
Directing Multiple Agents to Address a UI Animation Issue
After observing that the animation still did not work, the speaker proposed assigning the issue to multiple agents and framed the session as a chance to learn from the project rather than only continue building. The captions do not establish a final fix.
- 2:55:16
Understanding Specialized Agent Roles and Creating Custom Agents
The speaker explores agents for roles such as brand consistency and code review, reading a description of an agent that reviews major project steps against the original design, code-quality standards, and best practices. He concludes that creating a custom agent does not appear difficult.
- 2:58:41
Selecting Plugins and Tools for a Coding Workflow
The speaker reviews workflow plugins, including GitHub integration through MCP and a code-simplification tool, and checks that Playwright is included in the setup.
- 2:59:51
An Opinion on the Evolution of Coding Automation Tools
The speaker argues that enthusiasm for an automation approach popular a few months earlier had faded as newer alternatives appeared, and notes that several companies and models were developing automation and loop capabilities. He also considers trying phone-based control and inspects TypeScript support and frontend-design options; some product names in this passage are unclear.
- 3:02:25
Security Guidance and a Skill-Creation Tool
While reviewing available options, the speaker encounters security guidance and then a tool described as creating new skills from scratch, updating and improving existing skills, and measuring skill performance.
- 3:07:01
Aligning UI Cards and Showing Waitlist Progress
A request to make two interface cards the same size and creatively show community progress toward a future launch condition, such as with a waitlist progress bar, without claiming the design was successfully completed.
- 3:10:43
Exploring Firecrawl for Website Extraction
Firecrawl is explored as a way to process or extract content from an existing website, with its open-source availability noted and an intention to try it; the captions do not establish a successful test result.
- 3:17:41
Testing a “Breathing Screen” Effect in the Hero Section
A discussion about layering a pulsing, phosphor-like “breathing screen” effect onto the current hero section while temporarily retaining its existing elements, so the result can be evaluated before anything is removed. The motion should support the presentation rather than serve as decoration alone.
- 3:18:43
Choosing Agents, Skills, and Plugins for a Design Task
An attempt to understand the practical distinctions among agents, skills, and plugins, followed by a concrete question about the best combination to use for implementing a particular frontend design in the current setup.
- 3:38:38
Equipping Codex with Plugins and Skills for a Website Workflow
Luqman added a set of plugins, skills, and tools to Codex, intending to refine their configuration later and combine them in a website project. The trial exposed an early issue: the screen-effect prototype was not clearly visible after refreshing.
- 3:42:59
Why a Prototype’s Visual Effect Must Be Clearly Visible
Luqman argued that a prototype fails its purpose when the visual difference is too subtle to evaluate, even if the code exists. He asked for a deliberately stronger effect so he could decide whether further refinement was worthwhile, noting that a mismatch between code and visible output creates wasteful review cycles. He proposed testing the new plugins, skills, and agents together through substantial website changes and comparing the result.
- 3:49:53
Debugging a Visual Effect That Disappears After Refresh
A visual effect in the “what I’m building” section did not persist after a page refresh. The requested workflow covered implementing the design specification, checking the code, brand, and visuals, then visually inspecting the development server and documenting the result with a screenshot; the captions do not confirm a successful fix.
- 3:56:03
Terminal Sandbox Limits Inside Coding Tools
The discussion noted that terminal sandboxing inside Cursor, Antigravity, or an IDE can restrict command functionality, while pointing to Warp as a dedicated terminal workflow. This was a practical observation about tool limitations, not a completed comparative test.
- 3:58:51
Balancing Usage Limits and Subscriptions for AI Coding Tools
He discusses a practical framework for choosing a subscription based on usage intensity and access to particular agents, suggesting that a primary tool plus a fallback may remove the need to subscribe to several assistants at once. This is his personal assessment, not a comprehensive benchmark.
- 4:04:09
What Is Max Mode in Cursor?
He examines Cursor’s Max Mode setting, which expands the context window so a model can consider more code on complex tasks, with token-based pricing at the model’s API rate. The segment explains the interface description rather than independently demonstrating better results.
Got a question about something in this stream?
Ask in the group