A day of Javascript


Today I’ve been trying, trying really hard to apply some of that JavaScript knowledge to a simple problem, something that if I was doing it in HTML and PHP would have taken about an hour, and I’ve not done PHP for as long as I haven’t done JavaScript, but that’s not a fair comparison as like most people that used JavaScript in the past I did very limited things like pop up a window or an alert when something went wrong. I only had one thing to do today, add some functionality to a web app to upload files and store them locally on the server.

I’ve only spent 12 hours on it so far, and it sort of works if you ignore the fact that Drag and Drop won’t work an the progress bar doesn’t appear / update or that it doesn’t close the upload popup at some point, but if you’re willing to apply some manual intervention it will upload a file eventually and it will (after you’ve closed the upload dialog and refreshed the page…) display the new item.

I think some of the challenge is the many layers to the app, with html, css, javascript, bootstrap, angular, jquery and nodeJS; there’s just a lot of places doing stuff and it’s not all quite settled into my head yet… combine that with only recently having played with all of those and it’s a little confusing. I spent a lot of time trying to steal peoples code to save time from various open sourced git repos, I basically found that after stealing 5 and none working that I was wasting my time so I just took one as an example and went from there, This one in fact.

With in a couple of hours I had most of it down but not working, having dedicated this sprint to button first development I got the UI looking just right before moving on to any code. I then set about making the javascript bits work and I managed to get everything working apart from drag and drop, so it wasn’t posting data but it was showing files. For some reason the drop event I had setup was not getting triggered, every time I dropped something on it it did nothing ad the browser just opened it as a file.

Annoying, I imagine that something I’ve done in bootstrap or angular has had an impact on it but I don’t know and have just had to abandon it for now, maybe it’s the modal? maybe it’s some weird local issue, either way I’ll have to come back to it.

Some lessons learned

What’s the point in wasting a day on various elements of JavaScript if I’m not going to learn anything. Well I learnt loads! I learnt how to use the debugger in Webstorm which was pretty neat, once I’d clicked that button I found my issue in my node code really quickly, next time that will hopefully save me 2 hours :)
I also learnt that at my level of skill, using someone else’s complicated library for stuff is a bit hit and miss, especially if it requires working with multiple technologies that I’m also not familiar with…

In short at least by writing it my self / re-writing it from other’s examples I had some time to digest it and understand it, of course it doesn’t work but I fell better for having a go :) I am still relatively hopeful that in a few months this will all be second nature, but which time I would have probably forgotten all the ruby I know :)

Anyway, a short one today, more programming tomorrow and hopefully after another full day I would have the upload box working.

JavaScript and me

Where did it all go wrong

It must have been about 10 years ago when I first did some JavaScript and at the time I thought it was pretty good, I only used it on and off between then and university but with no real direction. I enjoyed JavaScript that much that I didn’t think twice about using it for my final year project at university, at the time Web2.0 and AJAX was all the craze but no libs existed and everything had to be done by hand. I was struggling to find a project in my final year and I happened across a geospatial professor at university and with google maps not having been out long I set about creating a geoblog that could be updated via email. it was a PHP backend with a Javascript and XML front end, there was just an index and everything, management, logins, maps etc was dynamic.

Cutting edge stuff! and yet I hated it, it took the magic out of the process and after I finished that project I vowed never to touch it again! well until I was forced into it…

Learning from the ground up

Last week I was sort of forced into it, although the week before I took my self to that pain so I am some what to blame.

Either way, I decided that this week would be a learning week so I’ve been going through W3 Schools and Code Academy to re-familiarise myself with JavaScript. I’ve got to say the Code Academy stuff was good and I’d recommend it to anyone that wants to learn how to program.

I found it useful to recap the stuff I could remember and I learnt a few things too, but then I came across This this which does a good job of explaining why certain ways of doing things are better.

I imagine that all of this reading and learning will help a little but I don’t do that good with reading… practicals are always good, so next week will be all about actually doing something with Node.js

Making something good

One of the big reasons for learning a language is to use it, and by having a practical use for it it helps motivate you to do more, luckily there is a project that we started and I have purpose. My role is the web UI / server side of a larger piece of work, luckily I have some help… Hopefully in a month or so i’ll be able to give out some more details but it will be a little while to get it up and off the ground and sort of doing what it’s meant to in a prototype style. If we can pull it off it’s fair to say it will revolutionise how we currently work and provide a good platform the managing what we do, really looking forward to getting it to the basic prototype phase so we can start iterating on each bit until it’s perfect!

When in doubt, use more JavaScript

Oh, gawd, why

Over the last couple of weeks i’ve been playing with some new technology, not to any depth but just enough to get a feel for it. The week before last it was all Python & Django followed by AngularJS, well this week has been a bit more Javascript in the form of Node.js; granted I’ve not done much but I’ve done some.

As always it started in a random planning session where we have decided that we will make our own tool that will replace our current monitoring tools, the architecture was all drawn up, queue services, agents, plugins, a super fast “worker” process for handling the queue and a management console for pushing commands in and displaying results.

Because of my last two blog posts I got volunteered to do the front end, which is good as I will learn more AngularJS which I would like and I will learn more bootstrap which I would like, I also thought I’d get to write a nice backend in the language of my choice; turns out, not so much.

Would it be Ruby now I’m getting proficient with it? maybe Python, the rest is in Python, I could live with python, it’s not too dissimilar to ruby. It turns out it would be in node.js, oh gawd why. I’m not a fan of JavaScript, and here’s why; back in the day for my university final year project, back when AJAX had just come out and there were no libraries to do it I made a GeoBlog, using google maps API’s, JavaScript and PHP. It had over 1000 lines of javascript, there were no debuggers, the best you had was a console to point out syntax errors. Well that was a nightmare, at least now things have improved with proper debuggers in the browser etc etc so this time would be better…

Sort of…

To be honest node.js isn’t that bad to write simple things in, I’ve been getting more confused by having controllers and routes for both angular and node and trying to keep that separation in my head. I’ve so far been keeping good to my promise to do button first development so other than writing a simple api to return json I’ve not had to do much in node yet and only a little angular but at some point i’m going to get really stuck.

For some reason all these moving parts haven’t yet fallen into place and I’m wondering if I need to go back to some basics and re-vist javascript in it’s pure form and start building on that to get int node and angular. At the moment my coding is purely google, copy, paste, edit; not much in the way of understanding and if I’m going to make this thing work I need more of an understanding.

Maybe I should start with my old friend w3schools followed by some Code Academy followed by all of these

Busy week ahead I think, wonder if it will help or confuse me more, either way more updates next week I think :)