GUI Libraries for Angular Javascript Framework

Angular is a fantastic JavaScript framework that simplifies the MVC for Web applications. Like jQuery, it does not come with a library of GUI widgets and CSS themes – it just does what it’s supposed to do and does it well. If you are a developer, you would most likely need a GUI library to build a modern and interactive Web GUI. That is why I spent a bit time to research on this.

In general, you can continue to use whatever Javascript GUI libraries you’ve been using except jQuery based ones. I heard Angular and jQuery do not work well together because both use the $ namespace which may cause conflicts. This may not be a good news for you as I know there are quite some GUI libraries depending on jQuery.

Lost VMs or Containers? Too Many Consoles? Too Slow GUI? Time to learn how to "Google" and manage your VMware and clouds in a fast and secure HTML5 App.

To avoid the potential issues, you can try Angular-ui which supports Twitter Bootstrap. This page lists all the GUI widgets by the Angular UI together with Bootstrap, including Accordion, Alert, Buttons, Carousel, Collapse, Datepicker, Dropdown Toggle, Modal, Pagination, Popover, Progressbar, Rating, Tabs, Timepicker, Tooltip, Typeahead. To build a rich Web application, there are still some important widgets missing, for example, Grid, Menu, Tree, etc. I hope they’ll add more widgets in the future.

GUI widgets is only one part for building rich Web applications. Another important part is the CSS which defines the look and feel of Web GUI. For developers, it’s not really a fun to play with these CSS themes. Luckily there are CSS libraries to help. Twitter Bootstrap is one of these libraries that can make your life easy as a developer. If you don’t know Bootstrap yet, you may want to read this great tutorial. After that, you would appreciate how easy Bootstrap can help you.

There are a few more similar CSS projects like HTML5Boilerplate, Foundation, etc. I have not yet tried any of these as Bootstrap + AngularUI has offered me enough for me to get my current work done. Honestly there’s hardly a best framework. Just pick one (it happens to be Bootstrap for me) and be good at it. After all, GUI is not my specialty and focus.

Besides the Bootstrap tutorial above, there are a few nice tutorials on different aspects of Bootstrap from w3resources.com. This tutorial for example focus on the HTML form which which you would need to send data back to the server. You can find other tutorials on the left side navigation pane of the form page.

This entry was posted in Software Development and tagged , , , . Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

2 Comments

  1. johans
    Posted September 16, 2013 at 3:28 am | Permalink

    Angular use of $ prefix does not impact on your options to use jQuery. The biggest factor is making Angular aware of your jQuery/other code so that UI updates are handled correctly. Secondly in many cases you can code more efficient components using Angular directives that leverage Angular scopes and data binding. In fact in many projects there is no need for jQuery – Angular includes jQLite which is a small footprint jQuery compatible library b

  2. Posted September 18, 2013 at 10:40 am | Permalink

    Thanks a lot Johans, very useful information.

    Steve

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*

You may use these HTML tags and attributes <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

  • NEED HELP?


    My company has created products like vSearch ("Super vCenter"), vijavaNG APIs, EAM APIs, ICE tool. We also help clients with virtualization and cloud computing on customized development, training. Should you, or someone you know, need these products and services, please feel free to contact me: steve __AT__ doublecloud.org.

    Me: Steve Jin, VMware vExpert who authored the VMware VI and vSphere SDK by Prentice Hall, and created the de factor open source vSphere Java API while working at VMware engineering. Companies like Cisco, EMC, NetApp, HP, Dell, VMware, are among the users of the API and other tools I developed for their products, internal IT orchestration, and test automation.