![App Builder Release: AI, CSS Grid Layout, & More App Builder release with ai](https://www.appbuilder.dev/wp-content/uploads/2024/08/app-builder-ai-css-grid-header.jpg)
![App Builder Release with React Code Generation! App Builder Release with React Code Generation!](https://static.infragistics.com/marketing/app-builder/blogs/app-builder-blog.png)
App Builder Release with React Code Generation!
June's release of App Builder is here, introducing an array of new features and improvements. Users can now design and generate code for their React apps, streamlining the development process for this popular framework.
This month, we are celebrating another milestone for App Builder! June is marked by significant enhancements to our low-code platform, enabling even faster app development. All thanks to major additions and brand-new low-code capabilities like the much-anticipated React Code Generation feature.
Additionally, first-time visitors can take advantage of the new Guest-access mode, allowing them to explore and use App Builder without signing up for an account. They can save their progress at any time by signing in, ensuring their work is preserved.
What else? Apart from the new React Code Generation, other improvements include two-way data binding support for Select, Text-area, and Radio-group components, providing seamless synchronization between the user interface and the data model. Users will also receive notifications for recent updates to Datasources their apps are using, enabling them to view and manage changes effectively.
Before diving into React Code Generation and all the new functionalities, if this is your first time learning about App Builder, let me quickly share why you should consider it as a key tool in the application development process for your organization:
- A visual app builder – the unified platform for product managers, designers, developers, and stakeholders.
- Cloud-based WYSIWYG drag & drop tool that helps companies design and build complete business apps 80% faster than ever.
- A low-code tool generating production-ready Blazor code, Angular code, Web Components, and React code from your Figma and Sketch designs.
React Code Generation
We are thrilled to announce that you can now design and generate your applications directly for React. React, known for its flexibility and efficiency, is a popular choice among developers. With the new React Code Generation feature, App Builder simplifies the process of creating React applications, allowing you to quickly build and deploy high-quality apps with ease.
![App Builder Release with React Code Generation! React code generation](https://www.appbuilder.dev/wp-content/uploads/2024/06/react-code-generation.gif)
Guest-access Mode for First-time Visitor
First-time visitors can now explore and use App Builder without the immediate need to sign up for an account thanks to the newly introduced Guest-access mode. This feature enables potential users to get a feel for the platform and start building their projects right away. Additionally, visitors can save their progress at any time by signing in with an account, ensuring that their work is never lost.
![App Builder Release with React Code Generation! Guest user flow in App Builder](https://www.appbuilder.dev/wp-content/uploads/2024/06/guest-access-flow.gif)
If you try to access any of the following key features, you will be asked to Log-in first:
– Code generation
– Adding a new Data source
– Getting a shared link for an app
– Publish to GitHub
– Creating a new workspace
– AI functionalities*
*If you’re curious to get an exclusive preview of our latest developments, feel free to reach out to me at zkolev@appbuilder.dev or join the conversation on our Discord channel.
Recently updated Datasources Notifications
Staying informed about changes to your app’s dependencies is crucial for maintaining its functionality. With the latest update, you will now receive notifications for updates to Datasources that your app relies on. This feature allows you to view the changes and stay on top of any modifications that may affect your application, ensuring smooth and uninterrupted operation
![App Builder Release with React Code Generation! Notification for recently updated data sources](https://www.appbuilder.dev/wp-content/uploads/2024/06/recently-updated-notifications.gif)
Two-way Data Binding Support
In our ongoing effort to enhance the functionality of App Builder, we have added two-way data binding support to the Select, Text-area, and Radio-group components, next in line would be the Combo component. This improvement ensures that any changes made to the user interface are immediately reflected in the underlying data model and vice versa. This seamless synchronization simplifies the development process, reducing the need for manual updates and ensuring data consistency across your application.
*For the time being, two-way data binding support for these three components is only availabe for Angular. In the upcoming weeks we are going to provide support for the rest of the platforms as well
Other improvements
- React apps are generated using Ignite UI for React 18.6.1
- Angular apps are generated using Ignite UI for Angular 17.2.0
- Web Component apps are generated using Ignite UI for Web Components 4.9.0
- Blazor apps are generated using Ignite UI for Blazor 23.2.204
Wrap Up
In conclusion, App Builder is a game-changer in the app development process. With its cloud-based visual builder, low-code capabilities, and new features, it’s a must-have tool for any organization. Try it out today! If you need more details, we encourage you to check out our:
To experience everything, head over to appbuilder.dev and start using the App Builder. As usual, we are always excited to get your feedback and hear what you want to add or recommend. So please email me at zkolev@appbuilder.dev and let me know how we can help you continue delivering value to your customers with Infragistics.
![App Builder Release with React Code Generation! App Builder Release with React Code Generation!](https://staging.appbuilder.dev/wp-content/uploads/2024/02/app-builder-wysiwyg.gif)
Related Articles
![App Builder Release: AI, CSS Grid Layout, & More App Builder release with ai](https://www.appbuilder.dev/wp-content/uploads/2024/08/app-builder-ai-css-grid-header.jpg)