From Design to Code in Seconds
- 1. From Design to Code in Seconds with App Builder
- 2. Today's Host Jason Beres Senior VP, Developer Tools jasonb@Infragistics.com
- 3. Today's Agenda 1. Quickly Design Apps with WYSIWIG Drag & Drop 2. Preview Designs Instantly in Your Browser 3. Produce Production Ready Code 4. Live Demo 5. Wrap Up House Keeping • Recording and slides will be available after the webinar. We’ll send a follow- up email • Please ask questions in the Questions window Infragistics.com/indigo-design
- 4. Problems Solved with App Builder Infragistics.com/indigo-design • (Most) developers do not like CSS, or web layout, or anything to do with Web design • This creates a ton of wasted time and no matter what, the result is not good • Have you heard “You’ll need to find someone else to make this look good”? • We solve that with a Web-based WYSIWYG IDE that ANY developer can learn
- 5. WYSIWIG Drag & Drop
- 6. 100% Cloud-Based WYSIWYG Infragistics.com/indigo-design • The fastest way to design complete business apps • Our toolbox and rich property editor give you full control over how your controls look and behave • Compatible with popular design tools like Sketch, no downloads or third-party dependencies • It’s like a VB6 / ASP.NET Web Forms / Windows Forms designer but for the Web
- 8. Instant Real-Time Preview Infragistics.com/indigo-design • Preview your code instantly in just a single click • Experience the look and feel of your app without having to compile or download • Switch to Code View and get the instant preview of the production-ready HTML, TypeScript, and CSS
- 9. Starts with UI Kits (Sometimes)
- 13. 3 Easy Ways to Get Your Source Code Infragistics.com/indigo-design Copy • Use Right-Click / CTR+C to copy from the Indigo.Design code viewer to the clipboard Download Zip • Download a Zip file with all source files. Simply run npm install / ng serve on the client and see your new app run live in the browser. Sync to GitHub • Sync your Indigo.Design project directly to GitHub, do pull requests from Indigo.Design and merge changes on GitHub. 1 2 3
- 14. Demo
- 15. Wrap-Up
- 16. What's Next? Infragistics.com/indigo-design • Indigo.Design App Builder is providing you the fastest way to go from Design to Code • Compatibility with Figma and Adobe XD coming by end of year, along with React & Blazor for UI Framework Support • Our next session will go deeper into Indigo.Design App Builder and GitHub integration!
- 17. Try Indigo.Design App Builder Today infragistics.com/products/indigo-design/app-builder Contact us for a Personalized Demo: sales@infragistics.com
- 18. Email With Questions! Jason Beres Senior VP, Developer Tools jasonb@Infragistics.com
- 19. Thank You!