Fade in Image Components With Ember
One nice effect when you have a number of images, especially in a gallery, is to setup placeholder images while your images load. This makes a much nicer experience, especially for those who are on slower connections, as they don’t have the images slowly load. This sounds like it would be fairly easy to do using CSS, and there are certainly a number of solutions to do this using CSS. However, in cases where you want to use the background-image
property, it’s challenging to get a nice fade-in effect. This is because the background-image
is not a valid animateable property, and also because we have no way of knowing when the browser has downloaded the background-image
, so if you just set the image, the user will see the image load which is a bad user experience.
Ember CLI - Easily toggle between mocks and live server
One of the great things about Ember is how productive I feel, and how it allows me to focus solely on the front end. Ember CLI makes this even faster, as it makes it super easy to create http-mocks of the backend, which allows me to continue working on the front-end while the Web API portion of the application is still being developed or finalized. If the same team member is working on both, sometimes an approach of starting with the UI also helps vet out the requirements for the Web API as well.
Combining MVC and Attribute Style Routing in Express
I’ve been writing a decent sized application using Node.JS and Express, and got frustrated with the routing situation. Every time I would add a new route method, I had to remember to also modify my Express configuration to add the route, and to remember what, if any, middleware I also wanted associated with that route.