App Builder July Release - GitHub integration, Drag & Drop and more

The July update of App Builder is here, coming with some quite significant updates! During the last several months, the product team has been focusing on enriching our web-based WYSIWYG tool not only with new components but also by adding amazing integrations, complementing the general application design and development process. The updates also include user experience enhancements which will make the design process smoother, easier, and much faster.

The July Release updates come in three key themes:

Features:

• GitHub Integration – integrating the GitHub service was first mentioned as a part of our roadmap during April webinar and the positive feedback that followed motivated us to focus and deliver it as soon as possible. As it was noted by the Infragistics Director of Development Konstantin Dinev, by bringing this integration instead of building our own service, we remove the friction of learning another tool, enabling developers to use one of the most popular services today for dev projects. This feature allows engineers to directly upload their app to a GitHub repo, private or public, and benefit from all GitHub features, such as code review and tracking PRs. So, once you are ready with the application, simply select Generate App, connect to GitHub or download the app files locally, then pick up a repository and upload the project. When the upload process is completed, you can go and check all your files on GitHub.

• Slider component – adding the Slider component to the App Builder will let designers build user-pleasing UX flows for more complex scenarios. The Slider component, delivered by the Ignite UI for Angular library, comes with various properties, such as options for having one or two thumbs (in case you need a slide range), setting the slider as stepped or continuous, and more.

• Banner – a simple but powerful Material Design component for showing and hiding information upon user’s request.
• New sample apps – the new Travel and E-commerce applications reveal UX scenarios and certain usage of components that can be quickly reused. Galleries, fancy horizontal scroll experience, layouts - simply load the sample apps and pick up what you need for your application.
• Korean translation – now you can find the entire App Builder translated into Korean.

Improvements:

• When previewing an app, now you can switch between "master" and "child views", using a dropdown in the toolbar, so you can preview the code for each view separately.

• Ability to reorder components in the document outline or design surface using drag & drop – that is a gamechanger that will dramatically speed up the app-building process. I am sure - all product designers will love it!

• Ability to reorder “master” and “child views” in the views tab of the toolbox using drag & drop.

• “Tab Layout” to allow custom content inside “Tab header”.
• Improved icons for "align-content" dropdown when wrapping is enabled in Flex layouts.
• Apps are generated using Ignite UI Angular v12.0.1 instead of v11.1.15 

Maintenance updates & bug fixes

• Improved load times and performance tweaks when using the App Builder UI.
• General bug fixes.

Wrap Up:

Briefly described, these are all the new features and components that you will face in the July update of App Builder. If you need more details, we encourage you to check out the updated documentation.