Tidewave Web now supports React, allowing our coding agent to map page elements to React components, for faster and precise edits. It is fully integrated with our Inspector, so developers can simply select elements and prompt changes.
Tidewave Web is the coding agent for full-stack web development. It runs in the browser, alongside your web app, and is deeply integrated with your web framework, from the database to the UI. Conventional coding agents require you to constantly describe UI states, copy error messages, and switch the agent and the browser, while Tidewave can see your actual web pages, automatically map UI elements to their corresponding code, query your database, and test changes in real-time for seamless, efficient agentic coding.
Prior to this release, Tidewave Web supported server-rendered Phoenix and Rails applications. This releases adds React support, tailored to Phoenix and Rails backends. Support for standalone React applications and other frameworks is coming in the future. Read our documentation to learn more.
Revamped Inspector
To showcase the React integration, we have revamped our inspector to display framework-specific data on command. Hold the Ctrl key on Windows or the Cmd key on macOS, and Tidewave will show a purple overlay with the relevant component/template information:
This plays together with the recently announced editor integration: clicking any element while holding the Ctrl (or Cmd) key will open it in your favorite editor, regardless if it is a React component, a Rails template, or a Phoenix component.
Vite support
Tidewave Web will also automatically detect error pages coming from Vite and present you with a tooltip for a one-click fix:
If the error appears while Tidewave Web is testing your application, Tidewave Web automatically feeds the error message and stacktrace to the agent. If you are using other build tools and you want to see them supported, please reach out.
Happy coding!