busbud/coding-challenge-frontend-a — pull request #2 by chesleybrown (2014-02-13 05:14:11+00:00)
Title: Chesley's Solution

That was actually pretty fun. Guess I'll run you through my thought pattern on all this.

Although I was tempted to try the web crawling one I ended up going with the frontend challenge as I enjoy using `Angular`.

When I initially checked out all the files, my first task was to improve the development workflow. I find this is essential for the start of any project. If the development process itself is restraining you're only making things more difficult for yourself. I'm familiar with `grunt` and I felt it was the perfect fit here so I began setting that up and picking the technologies I'd be using.

Since this was going to be client side, I knew I needed a package manager for importing any external client-side libraries I wanted (such as `Angular`, `lodash`, `normalize-css`, etc). I also knew I wanted to make the CSS maintainable and easily configureable so I chose `SASS` and `Foundation`. And a css normalization file is always a most.

I normally always include `lodash` because it's just so convenient to have for those moments you need it. I usually find it really speeds up development.

Of course, autocompletes have been done many times before and I'm not one for re-inventing the wheel. I strolled around and found a lightweight autocomplete that worked with Angular. I didn't want any `jQuery` dependancy for this project as it really just wasn't needed. Too much overhead for no real gain.

After using the angular autocomplete directive I chose I soon discovered it had a few bugs. So I ended up forking the project, fixing the bugs and also putting up pull requests to the original author so everyone could benefit from my fixes. https://github.com/JustGoscha/allmighty-autocomplete/pulls

I started trying to communicate with the API directly from the client but quickly noticed it was suffering from cross-domain restrictions. This wouldn't really be a problem if the project was actually under the busbud domain so I just quickly put together a node proxy to the API.

One thing confused me was the callback function within the API url. I never really witnessed that before, so I just ended up stripping the function name from the result. Feel free to explain why its there? Maybe I'm just missing something...

For the design, I didn't directly want to copy the suggestion provided, but I did use it as a heavy inspiration. And then lastly I created a simple random class background directive to randomize the city background on page load. Felt it made it a bit more friendly that way.

Unfortunately I only have my Mac at home (I normally do all my windows testing on my machines at work) so I haven't tested this in IE. I believe there will be a couple of issues in IE7, but they would be minimal and easy to fix.

If I had more time, I would have liked to add some unit/functional tests as well.

Anyway, let me know what you think.

Cheers,
Ches