Posts

Fixing Aurelia Webpack PushState "index.html" Problem

If you’re using the Aurelia Webpack Skeleton and you’re developing locally using the development server, then you have probably encountered an issue with pushState and index.html resolution. You can see this problem happening on the official skeleton. But essentially you enable pushState in your main.js or main.ts file using config.options.pushState = true; and then you load up the app on port 9000 through http://localhost:9000 Navigating around, you’ll see that the app works. Hitting the /users route should change your URL to http://localhost:9000/users and things work. Now what happens if you refresh the page or trying hitting /users directly? You’ll get gibberish.

Functional Programming In Javascript? More like dysfunctional

I am all for developers pushing themselves, learning new things and refining their skills, but the one thing that really annoys me about front-end development right at this moment, is the opinion terrorists who are raving about functional programming. A few examples of the pro functional movement can be seen; here, here, here, here and here is a TypeScript oriented one. There are more out there though. I am a firm believer in using whatever it takes to get things done. Whether you still use jQuery or you prefer to write things from scratch without libraries or frameworks.

My MVP Workflow, How I Create Web Applications: From Conception To Creation

Everyone knows coming up with an idea is often the easiest part of an application. I come up with a lot of ideas on a regular basis, too many some would say. What is the best way to take an idea and actually build something usable, a working MVP (minimum viable product). I recently released a couple of quick ideas that took very little time to create, Pokego.run and Built With Aurelia. In the case of Pokego.run, I knew I needed to add in Google Maps, support authentication and ability to add markers to a map. For Built With Aurelia I knew I just needed to display submissions and allow registered users to submit projects.

R.I.P Apple

Well, the rumours were true: the iPhone 7 has been announced without a headphone jack. While nobody is truly surprised by this because, I wanted to believe it was only a rumour. Surely Apple wouldn’t kill off such a widely used feature? I am all for pushing technology forward, but we aren’t talking about VCR and DVD here, we are talking about the classic 3.5mm stereo headphone jack which has no true replacement.

Inline SVG Custom Element in Aurelia

A unique scenario popped up recently during a project I am building with Aurelia. I needed to cleanly be able to insert SVG images from a folder in my app and display them inline. Duplicating the SVG’s and inlining them was an option, or creating a custom element seemed like a better choice. What I ended up coming with is the rather simple, but elaborate looking custom element which essentially replaces itself with the contents of an SVG.

Sorting By Vote Count & Recently Added Date In Javascript

Recently whilst working on my web app Built With Aurelia I encountered a situation where I needed to sort by the highest upvoted items, but also sort secondly by the recently added items. The collection of items would look like this: Item 1 (5 votes) Item 2 (3 votes) Item 3 (2 votes) Item 4 (2 votes) Item 5 (1 vote) Item 6 (1 vote) Item 7 (0 votes) Item 8 (0 votes) Item 9 (0 votes) Item 10 (0 votes) The code that I wrote to achieve this was the following using the sort method in Javscript:

Introducing Built With Aurelia

Built With Aurelia is a nice little application that showcases what the Aurelia community are building with Aurelia and has been in the making for a while now. The idea stemmed from there being nowhere (until now) to see the great things that the Aurelia community have built. Initially it was going to be solely just applications, but the site also includes plugins and themes. So if you’ve built something with Aurelia as well as something for use in Aurelia, feel free to submit it to the site.

Adding The Aurelia Fetch Client Into An Aurelia CLI Project

So you’re using the CLI to build your next Aurelia application and you want to use the Fetch client? You might have noticed by default it does not come configured with the Fetch client. Fortunately, adding it in is a piece of cake. Firstly, we want to install the Fetch Client as well as a Fetch polyfill: npm install aurelia-fetch-client whatwg-fetch --save Now open up aurelia_project/aurelia.json At the bottom in the bundles section, more specifically vendor-bundle.js look for the prepend section and add in the polyfill as this will be global and we want to include it before anything else. You might notice I put it above the RequireJS line.

Issue Updating "aurelia-cli" or other global Node Modules?

As much as I love Npm, it can be quite buggy at times, especially on Windows. One such error I encountered recently was trying to install the latest version of the Aurelia CLI by typing npm install -g aurelia-cli in most cases this just works and updates the existing version. However, a couple of times now, I kept getting some error about “ENOENT: no such file or directory, rename” and then something about a node_modules/.staging folder.

Aurelia Goes Stable 1.0: RTM

It has finally happened. After a long beta and relatively short release candidate period, Aurelia has hit a version 1.0 stable release which you can read more about here from the horse’s mouth. This means you can now safely use Aurelia to build your applications with confidence that it will be stable. In all honesty, Aurelia as a core framework (not so much the tooling) has been stable since mid 2015 for me. Over the last year and a bit I have seen this framework grow from a small idea to an impressive and easy to use framework.