question: example of released web apps which use Aurelia

opcodewriter commented 8 years ago

I heard Rob mentioned for quite a while now that there are companies which Aurelia in production for many months, but he cannot disclose their name, which can be understandable sometimes.

But are there any examples of web apps which uses Aurelia in production and whose names can be given?

I'm looking for:

a real product/service, so not a demo or POC. Also something which is like an internal product doesn't help, because I want to check it out.
some complexity in the data flow, must have several screens, different kinds of data flow between different UI components and views, validation, routing, etc. It must be something much more than the http://aurelia.io/docs.html app which shows static content
must use latest Aurelia or something close to the last version

Thanks

EisenbergEffect commented 8 years ago

@riddla I don't know much about Dash docsets, but all our articles are available in markdown format on github today. All our apis are available as json documents on github today. If you can work with those formats, then you should be able to generate other documentation formats today.

thelgevold commented 8 years ago

My experience is that people seem to like component demos accompanied by a short blog post. I might take one or two of my existing blog demos and port them to Aurelia.

insidewhy commented 8 years ago

kchomp.co is my company's aurelia web app. Should hit our first public milestone in the next two weeks.

forestmarie commented 8 years ago

@EisenbergEffect you can contact me for a case study. We are nearing code complete for v1 and we started a year ago. We obviously can't open source our code but our code base is pretty sizable now. 800 client side unit tests and about 50+ distinct views now with a good amount of custom attributes, components and value converters. Hands down most developer friend JS framework we have used.

stsje commented 8 years ago

@forestmarie I would be very interested in knowing how you structure your application (directories) :).

insidewhy commented 8 years ago

I'd be interested in hearing from anyone how long they have to wait while Aurelia is loading on mobile. Our project is 98kb bundled/minified and takes 3-4 seconds on a Samsung Galaxy S6.

vdangwal commented 8 years ago

Some Screen shot from our project. Its a LOB app with n-tier architecture. Aurelia + KendoUI + Materialize Css + Asp.Net Web API + SQL. aurelia_screen1 aurelia_screen2 aurelia_screen3

vdangwal commented 8 years ago

Its a first draft version of app and I am not a very good HTML developer. :)

Thanood commented 8 years ago

@vdangwal Looks very nice! :+1: Are you using vanilla KendoUI and materialize or one (or two) of the Aurelia bridges? :smile:

vdangwal commented 8 years ago

Bridges for both of them :) And if you remember, you helped me out on some issues with Materialize :+1:

Thanood commented 8 years ago

Yep, I remember.. The datepicker issue. :smile:

vdangwal commented 8 years ago

Yep.

dpinart commented 8 years ago

@ohjames We're also facing very, very long startup times on mobile devices. About 15 seconds in a Samsung Galaxy tab for a medium sized application. Once app is loaded performance is not bad.

I was thinking that probably the reason might be the usage of async/await es7 features that forces us to use babel-polyfill in order to create the regeneators, but I expended a whole day getting back to Promises and couldn't see any significative improvement

brandonseydel commented 8 years ago

@SPARTAN563 Do you want to add the application you guys are building here?

notheotherben commented 8 years ago

Sure, http://farmtracksa.com - it's in production, uses the latest version of Aurelia (give or take a week depending on priorities and workload) and is built using TypeScript+JSPM. It was originally based on the Skeleton Navigation project however its architecture has since been significantly changed and includes a couple of neat features such as:

Built in authentication and permissions management through the use of routing pipeline injection, router settings, the DI container and filters (for conditional display: if.bind="'permission/name' | can").
A customized version of the aurelia-http-client (using inheritance) which enables it to "mock" a strongly defined API by parsing an API Blueprint JSON output - removing the need for a server during testing.
A strong emphasis on DRY, making extensive use of components, globally registered resources etc.
A translation framework using i18next (prior to aurelia-translation being available, and adopting many of the same design principles, including some which I prefer for the time being).

Unfortunately it isn't open source and you will need to register to view the demo right now (we're working on putting together a static data version, but just haven't had the time yet) but please feel free to ask if you've got any further questions.

stefan-sopic commented 8 years ago

I'm currently working on a freelancing platform (http://fairlance.io), based on aurelia ES6 and gulp skeleton. Not really complex (so far) but multiple screens and a bit different code organization. https://github.com/fairlance/frontend

hadrienl commented 8 years ago

Hi,

You can try https://reverb.re

emcga commented 8 years ago

Aurelia-ui-framework is a UI framework that I'm currently using for an internal LOB application my company is developing. It's pretty nice to work with, and its developer is friendly and responsive to all questions/concerns. Also, Aurelia itself has been an absolute pleasure to work with. Thanks @EisenbergEffect and your team of devs for such an amazing framework! I convinced my team to switch to Aurelia over a year ago and have not been disappointed.

utrolig commented 7 years ago

If anyone is still wondering about stuff like this, I can probably make a couple examples of how I structure my applications in aurelia. I've made a couple of production-applications the last month, none of them huge, but I've found Aurelia to be much easier and intuitive to use than other frameworks.

I usually use the Aurelia-CLI for all my projects, and setup my folder-structure like this.

src/
    components/
        header/
            header.html
            header.ts
            header.scss
        nav/
            nav.html
            nav.ts
            nav.scss
    resources/
    views/
        dashboard/
            sub-page/
                sub-page.html
                sub-page.scss
                sub-page.ts
            dashboard.html
            dashboard.ts
            dashboard.scss
            dashboard.routes.ts
            dashboard.service.ts
    app.html
    app.ts
    app.constants.ts
    app.routes.ts
    enviroment.ts
    main.ts

Components

In this folder I create all my "global" components, which don't belong to any specific view.

Views

In this folder I create all the views, and sub-views. I define all the routes separately by doing it like this:

dashboard.routes.ts

export const DashboardRoutes = {
    route: 'dashboard',
    name: 'Dashboard',
    nav: true,
    data: {
        icon: 'dashboard',
    },
    moduleId: 'views/dashboard/dashboard'
}

I then import all the routes in app.ts with the following code.

import { RouterConfiguration } from 'aurelia-router';

import { DashboardRoutes } from '.views/dashboard/dashboard.routes';

export class App {

  configureRouter(config: RouterConfiguration): void {
    config.title = 'Stian App';
    config.map([
      {
        route: '',
        redirect: 'home',
      }
    ]);
    config.mapRoute(DashboardRoutes);
  }
}

Nav

When using the nav component, I have a nav.service as well, which broadcasts events about its state (open, closed) which the main application subscribes to, to be able to resize the main content-div based on which components are taking up screen-space. After resizing the main content-div I also have to redraw google maps.

Let me know if any of this stuff is actually useful, and if there's anything else I can contribute with. I've only been using Aurelia for about a month, and programming for a year - but I've found this is a good way to separate code and keep it clean.

damianof commented 7 years ago

We worked for about 12 months (part-time) using Aurelia back in July 2015, went through some pain a couple of times with breaking changes when we updated to most recent versions. Then we froze our app on Aurelia beta a couple of months ago as we had to release our own beta (we finally did a few weeks ago). You are welcome to sign in using a Twitter account at [https://www.entensive.com] to check it out. Please mind, we are currently gathering feedback from beta users and are not planning to upgrade to Aurelia 1.0.0 yet, but that will come in a few months.

hadrienl commented 7 years ago

@damianof "Password must contain at least one upper-case, one lower-case, one number, and one symbol, and must be between 8 and 20 chars." =_= WHY 20 chars MAX?? https://www.xkcd.com/936/

damianof commented 7 years ago

@hadrienl The min and max length are actually driven from configuration. We can make it whatever we want, but early we made a decision that we should have a max. Do you feel 20 is too low?

notheotherben commented 7 years ago

@damianof might be worth having a gander through https://blogs.dropbox.com/tech/2012/04/zxcvbn-realistic-password-strength-estimation/ in which many of those points are touched on. We've integrated zxcvbn with our Aurelia app and had great results.

hadrienl commented 7 years ago

@damianof there should never be a maxlength for a password. A good password is not a password with special chars, but a very long one. Read the linked xkcd.

insidewhy commented 7 years ago

early we made a decision that we should have a max

You made a mistake then, the great thing about this one is it's easy to fix.

damianof commented 7 years ago

@ohjames thank you for pointing that out. @hadrienl thank you for your feedback. We'll keep the max length though, maybe increasing it a bit. But we don't like the idea to have it open to infinite length.

damianof commented 7 years ago

@SPARTAN563 thank you for your feedback as well

insidewhy commented 7 years ago

@damianof "Not liking the idea" isn't a reason to do something in computer science, scientific principles should be applied.

damianof commented 7 years ago

@ohjames Thank you again.Ultimately, each business is in charge of handling its own risk and decisions as its life depends on it. I definitely appreciate your feedback, but I hope you understand we are ultimately in charge of our decisions. I'm glad you feel strongly about following principles. That is a good thing.

insidewhy commented 7 years ago

Feeling strongly about principles, no, autistic desire for order, yes. I'm now going to pretend that you don't exist so I can continue my day without feelings of horror ;)

atsu85 commented 7 years ago

@utrolig, regarding Your sample project structure with scss files next to each component. Are You manually scoping the scss content so it would affect only that specific component or have You automated it using build pipeline to do smth like 1) extract style elements from Aurelia custom element templates 2) wrap the extracted styles with custom element tag name (to scope the styles to specific custom element) 3) feed the result to scss, to create single css file?

For example if i have a file: src/my-demo-ce.html:

<template>
    <div>style me!</div>
    <style>
        div {
            background-color: red;
        }
    </style>
</template>

then the build tool would copy templates from src and produce smth like: build/my-demo-ce.html:

<template>
    <div>style me!</div>
</template>

and build/styles.scss:

my-demo-ce { /* WRAPPER: based on the custom element tag name to target elements from specific custom element*/
    div {
        background-color: red;
    }
}
/* ... syle definitions extracted from other custom elements */

Note, I also asked this question through Gitter channel, but didn't get a positive answer, even tough is suspect someone has already implemented it (or smth conceptually similar to it) ;)

hadrienl commented 7 years ago

@atsu85 I don't really understand the goal of your asking… It will only works once since my-demo-ce.html will have its style tag removed and you'll have to write your scss file. So, what you're asking for is just a way to automatically create the scss file when you create the html file, a task which is very simple to do manually…

utrolig commented 7 years ago

@atsu85 I haven't done anything custom in regards to scoping/encapsulation of the styles.. I just make sure to name my styles to avoid issues.

So for example sub-page.scss would have all its styles called

.sub-page-header .sub-page-element .sub-page-element-header .sub-page-element-body

But this is actually the one thing I miss in Aurelia compared to Angular2. Style encapsulation is awesome in angular2, and I wish there was a simple way we could achieve the same result in Aurelia.

damianof commented 7 years ago

@ohjames funny, as for the past year it has been the other way around for me. Angular, especially for rendering performance, has lots of issues.

utrolig commented 7 years ago

@ohjames could you elaborate on some specifics?

EisenbergEffect commented 7 years ago

Closing this issue since we've got the new site up.

EisenbergEffect commented 7 years ago

@utrolig There is apparently a bug in list rendering which crops up in edge cases which only one or two people are experiencing. He happens to be one. If it was properly reported earlier, it would have been fixed, but it wasn't until today. We are committed to resolve whatever critical issues are reported, provided that we can reproduce them. If they aren't reported or aren't reproducible then there's not much we can do. We fixed all the list rendering issues we knew about either during the alpha or the beta period.

It's important to realize that open source is about community. Every member of our team, when they are working on Aurelia, is choosing not to spend time with their wives, kids, etc. or enjoy their own hobbies. Some people even choose to consult less in order to spend even more time on Aurelia. That's a big sacrifice, especially for those who have been doing this for years. We work hard and we believe in what we're doing. We also invite everyone else to join with us in making Aurelia great. Contributing to Aurelia by helping with issue reporting and fixing has a positive effect on thousands of companies all over the world. If you experience a bug, the best response is to consider how you can help out, not to lash out, throw a fit or "take your toys and go home" (the comment above was intentionally put here in order to get the attention of a lot of people and leave a negative sentiment). That's not the type of behavior we think is acceptable in our community. Instead, consider how a very small contribution can positively affect the lives of thousands if not hundreds of thousands of people.

vdangwal commented 7 years ago

Well said Rob. 👍👍👍

Get Outlook for iOShttps://aka.ms/o0ukef

On Fri, Nov 11, 2016 at 12:59 PM -0500, "Rob Eisenberg" notifications@github.com<mailto:notifications@github.com> wrote:

@utrolighttps://github.com/utrolig There is apparently a bug in list rendering which crops up in edge cases which only one or two people are experiencing. He happens to be one. If it was properly reported earlier, it would have been fixed, but it wasn't until today. We are committed to resolve whatever critical issues are reported, provided that we can reproduce them. If they aren't reported or aren't reproducible then there's not much we can do. We fixed all the list rendering issues we knew about either during the alpha or the beta period.

It's important to realize that open source is about community. Every member of our team, when they are working on Aurelia, is choosing not to spend time with their wives, kids, etc. or enjoy their own hobbies. Some people even choose to consult less in order to spend even more time on Aurelia. That's a big sacrifice, especially for those who have been doing this for years. We work hard and we believe in what we're doing. We also invite everyone else to join with us in making Aurelia great. Contributing to Aurelia by helping with issue reporting and fixing has a positive effect on thousands of companies all over the world. If you experience a bug, the best response is to consider how you can help out, not to lash out, throw a fit or "take your toys and go home" (the comment above was intentionally put here in order to get the attention of a lot of people and leave a negative sentiment). That's not the type of behavior we think is acceptable in our community. Instead, consider how a very small contribution can positively affect the lives of thousands if not hundreds of thousands of people.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHubhttps://github.com/aurelia/framework/issues/333#issuecomment-260016533, or mute the threadhttps://github.com/notifications/unsubscribe-auth/AF7ihEDrjV3gjW2K0UW-M-wO4J-X7hz3ks5q9K0agaJpZM4HglJy.

opcodewriter commented 7 years ago

I'm the OP of this, it's pretty sad to see how it got completely off-topic, arguing on password design or SCSS or complaining about Aurelia. Why's so hard to have some common sense!? I think having concrete examples of fully fledged Aurelia apps is helpful.

Closing this issue since we've got the new site up.

@EisenbergEffect, I might need to catch up, what is the new site you mentioned, does it have a list of apps developed with Aurelia?

gheoan commented 7 years ago

I believe @EisenbergEffect refers to http://builtwithaurelia.com/.

opcodewriter commented 7 years ago

@Gheoan thanks, that's nice. That's even more appropriate than this thread on GitHub, and it's something I've been thinking about too.

sensedeep commented 7 years ago

FYI:

We’ve been working on our Aurelia app, which is a cloud based Intrusion Detection Service for most of the year and have had a very positive experience.

We are launching late December and having used other frameworks before, we are very happy with the result and the major part Aurelia has played.

Aurelia continues to save us lots of dev time.

thank you all

Michael O'Brien SenseDeep Inc. mob@sensedeep.com

On Nov 11, 2016, at 9:59 AM, Rob Eisenberg notifications@github.com wrote:

helping

geea-develop commented 7 years ago

Hi all. We have a website in production, without a lot of traffic which is good for now. available in 4 languages https://hopayacht.com it uses Aurelia framework and if you go by mobile you can see Aurelia with Framework7. We have a lot of work ahead of us but if anyone has any questions feel free. Thanks for all the community around Aurelia which helps us to overcome different problems.

opcodewriter commented 7 years ago

@geea789 looks nice. How come your dist/app-bundle-ca2c680a57.js is 1.2MB ?

geea-develop commented 7 years ago

@opcodewriter meaning its too small or too big?

opcodewriter commented 7 years ago

@geea789 not sure exactly, because I don't know all the functionality of the app, but since it's just minified JS, it looks pretty big to me.

opcodewriter commented 7 years ago

the whole app is 3.2MB which is too big if you ask me

geea-develop commented 7 years ago

@opcodewriter actually right now it has a lot of functionality. too much. looking back i would separate it into multiple apps, each for different sections of the site. something like suggested here. http://stackoverflow.com/questions/33473457/multiple-aurelia-apps-on-one-page

Thanood commented 7 years ago

It's not only minified JS, it's also html and css in app-bundle (and a lof of System.registerDynamic calls containing strings). Btw.: I'm impressed you get it to load so fast with SystemJS.

Agrejus commented 7 years ago

I know you are looking for a production app, but I have a test production app I can share. I am doing iterative development in my spare time, so anyone can check back for updates.

Link: http://www.skygroundlabs.net/

Like I said, the app isn't 100% ready, I am still working on it, but here is the code for anyone to check out. Fork it, share it, I don't mind. There isn't any sensitive information in it. I used the Aurelia ESNext Webpack Skeleton as a base.

Code: https://github.com/jdemeuse1204/CreditMattersWebSite

Since this is a test site, I do not mind sharing login credentials for a test user. They are:

U: james.demeuse@gmail.com P: abAB12!@

NOTE: I am doing mobile first development, if you make your browser width smaller the site will look better in mobile form.

If you have any other questions, feel free to email me at james.demeuse@gmail.com

aurelia / framework

question: example of released web apps which use Aurelia #333

Components

Views

Nav