We need aurelia-ux tutorials

Though not really an official, detailed roadmap, Rob did give an overview here in November 2016:

Exciting times!

1 Like

This was one year ago! I think the community needs some fresh feedback about the future roadmap in order to make better and informed decisions.

For example, ember just announced version 3 https://www.emberjs.com/blog/2017/10/03/the-road-to-ember-3-0.html

Those things helps to develop a stronger community, make new people jump in and invest in the framework learning / picking.

Aurelia is awesome, way better than many other alternatives but we need to make some noise!

1 Like

Why do you wait for aurelia-ux instead of choosing one of the existing ones like bootstrap, materialcss etc.?
Check out https://material-components-web.appspot.com those components will be easily integrated into your aurelia app (they were designed for use in modular SPA’s)

First, Aurelia-UX is the official UI framework of the Aurelia.

Second, the Aurelia-UX has unique features that you can see in the link below:
Aurelia-UX wiki

Third, we need to use good features of Aurelia, not just pure HTML and CSS
Templating: Custom Attributes
Templating: Custom Elements Basics

So if you want to plan for a long term project, it will be very good to use official and recommended solutions that are integrated for a variety of fields.

We agree with your three points. Especially because we’re evaluating a SPA framework for a long term project.

After the first evaluating round there stays Angular 2 and Aurelia. For me, Aurelia looks great and I really like the philosophy! There is just one uncertainty about the UX. We have seen, that there is an npm module ‘aurelia-ux’ (version 0.3.0) and a showcase application https://github.com/aurelia/app-ux-showcase. But there is also the npm module ‘@aurelia-ux/core’ (version 0.6.0) with the same documentation / showcase app, like in the module ‘aurelia-ux’. We googeld a while to find some statements about it, but unfortunately without success…

Is there a short and current documentation about Aurelia-UX? Is the showcase application up to date? Should we use aurelia-ux or @aurelia-ux/core and it’s dependents? We think @aurelia-ux/core…? Is there a short example or how-to for @aurelia-ux/core? Thanks for your help…

I hope Mr. @EisenbergEffect 's roadmap will also include Aurelia-UX.

@dan here is a blog post that was published mid November that should help clear up some of your questions. Aurelia UX Overhaul.

To answer more directly, aurelia-ux is a legacy package at this point. The current package that should be used is @aurelia-ux/core. If you need the official Aurelia UX components the easiest package to bring in after that would be @aurelia-ux/components.

Currently all of the components have been split up into their own packages. This lets users pickand chose what they wish to use. Not everyone wants everything at once, but for those that do there is the components package. You can find all of the Aurelia UX packages here. NPM Aurelia UX

The UX Showcase is currently behind. Documentation is very high on the priority list, and in the coming weeks we should be figuring out just how to best put up documentation for Aurelia-UX. At that time the Showcase will likely be updated as well.

Also for an example, this is the most up to date example using Aurelia UX. aurelia-store-todo

This contains a few different ways to style UX components and basic usage of a few.


What matters to me is why you used Lerna?

Currently all of the components have been split up into their own packages. This lets users pickand chose what they wish to use. Not everyone wants everything at once, but for those that do there is the components package.

Why did not you use the plugin/feature in Aurelia? like our aurelia-toolbelt

Do we also have to use Lerna?

You will not need to use Lerna. Lerna is a tool for managing multiple packages and nothing more.

With the new structure, you can include all of the components or chose to include just a few of them. Lerna simply allows us to build all of the components and perform releases very easily and quickly and has already proven to be a timesaver for us.

To be clear, each individual component is still a plugin, so if you want to install Aurelia UX and the components you would simply include the following:

1 Like

@ZHollingshead Thanks for your quick answer and the links! We will have a look at them. Especially |aurelia-store-todo| sounds good. I‘m sure that this will provide us with valuable informations!

FWIW I created this post after having a bit of a play with aurelia-ux in the last few days: https://winterlimelight.com/2018/01/05/using-aurelia-ux-v0-6/


Hello @dan; my team is in a similar situation and we’re looking at Aurelia and Vue (I prefer Aurelia but we are a team). Can you share with the community why you bypassed Vue in favor of Aurelia? I am sure many of us are facing the same challenge: convince our team that Aurelia is “better” than Vue despite all the hype/publicity Vue is currently enjoying. Thank you very much for sharing and for your time.

Hi @frankmonroe; We didn‘t have a close look at Vue, just a very short one. We had a closer look at Angular. So unfortunately, I can not really tell you a lot about Vue.

Clean code, convention over configuration, the framework in general (it stays out of your way) and the philosophy - just to name a few – let us choose Aurelia

One thing – which almost gave Angular the preference - was the UX. It looked, that Angular already has a lot to offer to create easy and nice looking GUIs. Things like good documentation, fast development, a lot of experience, Material Design… . Now with Aurelia UX everything looks a bit different. If documentation is coming and easy to understand examples, then for me Aurelia is the one.

For us (we are a bunch of Java developers) good documentation and examples are important. Of course we know the “common way” to develop web applications, but we are not JavaScript and SPAs experts and still learning.… But now there are three books about Aurelia on the marked already and this was also argument to go with Aurelia. Like the growing community. Hope my answer helped a bit…

Thank you kindly for sharing.

FYI, Aurelia UX 0.7.0 was just released and the showcase was updated to reflect the new components.

There is also a live demo here until we can get the documentation hosted on the main Aurelia site. https://aux-demo.firebaseapp.com/getting-started

Based on the provided documentation I pose this question to you. What is missing from the documentation that would make Aurelia UX easier to use and get started with?


How about implementing theme selection in the showcase app? I’m also looking forward to ux-select. Once that arrives, I’m looking to try aurelia-ux in an internal proof-of-concept app at my workplace.

Here are a few resources to see components https://aux-demo.firebaseapp.com/forms and aurelia-ui-toolkits.github.io/demo-materialize/.

1 Like

Actually I realised that the theme option in the aurelia-ux demo can change the primary and accent colors, etc, but it would be nice also to be able to select a swatch and apply that as well.
Also, changing the primary color used to affect the sidebar color and the top bar but doesn’t any more. Perhaps that is by design, but the effect of seeing colors change in the demo immediately when you change them is part of the good user experience of the demo, and would be even better if a swatch could be selected.

The radio and checkbox components don’t have any code examples. What would be really, really nice though would be to have gistrun examples like the Aurelia Materialize Components demo has. :slight_smile:

Please don’t interpret my feedback as complaining, as I am just trying to give genuine feedback to help improve things if possible and I really like what you have done so far.

@ZHollingshead To answer your question, what is missing from the documents is a more full example using something like a drawer nagivation with newer CSS. I think relatively many using Aurelia are new to web development and have discomfort with all the build tools (there doesn’t seem to be a good example that uses CLI, WebPack, with add-onds such as bundle size visualizers) and some nice navigation to practice on.