Coding

Mastery

The last post on this site before this one is from almost three years ago.  At the time, I was working as a temp for a web development and marketing company. About half my time was spent implementing WordPress sites. I worked on the Ohio Lottery page redesign, mostly implementing from the graphic designer’s photoshop file. I was pretty proud of my skill then, and it is pretty good — it’s pixel perfect to what the designer did on all the browsers of the time.  Today, just saying “pixel perfect design” sends a bit of a shiver down my back, because we can’t predict much about the user’s world except that we aren’t really sure what it is. As developers often say, “If I did it today, I’d do it differently.”

The other half of my time was spent working on digital signage.  That it, we’d sell you a TV screen, and a small (but powerful) computer, let you design what goes on your screen in the cloud, and do the magic that puts together the videos, events, tweets, and other content you want to appear on your screen. We had a product written by another company, tied to windows which worked fine, but needed more features. The vendor was a windows company, and we were more mac/open source focused. So, given that and the fact we couldn’t afford more from our vendor, we rewrote it in javascript, using node. Eventually the whole thing dumped on my lap, and then two months later, we were bought out by our vendor.

I got a full time job, and in the intervening time, my node javascript code has been pretty much retired in favor of the vendor’s (ie, our) C# solution.  Well, we’re the whole company now, and of the dozen or so developers, I’m the only one who doesn’t like C#. It makes me feel about the same way as “Pixel perfect design.”  Can I write it? More or less, it’s not that different than anything else, and there are clean ways to write things, and mostly all we’re doing is what I used to do in PHP, which is shuttle data from a database to a web page.  And I’m way way more comfortable on the front end of this, taking data, and making it into interactive web sites.

That part of my job hasn’t changed greatly — the signs we made were HTML5/css/JS things, often interactive, with maps and events and lots going on in some cases (less in others). It was all, for me, ultimately just providing the best user interface possible. I wrote a video game (a two player video game, in a single browser –that was a challenge!), we put signs in every major rest area in Ohio, connected by unreliable 3G mobile phones, but still had weather and news that was kept current. If I did it today, I’d do it differently.

I’d still choose JavaScript and node as my middleware (and possibly back end).

Twenty years ago, turning off JavaScript in my browser was just one of those things I did, like turning on file extensions in explorer, and moving my Windows toolbar from the bottom to the left. (I’m not the only person I know who does this;)  A decade ago, I was starting to really like JavaScript. At the county, I wrote my first AJAX, and used my first MVC Framework (CakePHP). At my last job (which is sort of my current job) I learned WordPress, and Node, and my happiness with PHP finally wore off. I’ll never be a hate of PHP, it has its place (and this is a wordpress site, for now). ut JavaScript? Well I’ve lived with it long enough that I’m starting to get to know it.

Being at a company with such a strong C# has actually made me care more about my JavaScript. I’ve learned that I, personally, don’t like strongly typed languages. Our C# code has some beginnings of the kind of stuff I saw in Java a decade ago.  Lots of nouns. Things that did things to themselves, but only in this one way. If you wanted something different, make another. A few weeks ago, I wrote an app that made use of a full service layer. Matching the patterns set by my co-worker (because this is what you have to do in a professional environment) in order to add four operations on a table: Edit, Save, List, and Set Password (it was a user table), required creating a dozen files, and editing 3-4 more. (This includes the controller getting the data, but not the models and view models I was using).

That code, for the large part, was cut and pasted from another sequence of code. I don’t know why we do it this way, I know it’s been like that for years, and to change this pattern is more than I can do.  The thing is, I don’t really understand it deeply. I know what each piece does. I even understand why we’re using a service later on this project. I don’t understand why it was implemented this way. I do understand that every programmer at my work understands it enough to implement it. The code, in large part because it doesn’t do much, is clean. It’s easy to reason about what it does — just not why.  (And I’m very happy with “easy to reason about” as a definition of code which is good enough.  Good enough code is what we’re shooting for here.)

On the other hand, I’m starting to see the Ossification of classes that came with Java. And the “this is the way it’s done best practices blah blah blah” speech that goes with that. Maybe you’re happy with that, but I could write the SQL queries to do my 4 things in about 10 minutes. (And writing them, as stored procedures was part of the task).  That gets me the data. Another half-hour to pass it through my service layer in any reasonable system (and Javascript, being typeless can handle this pretty well, one JSON string is pretty much like any other JSON string)  Instead,I sent 2-3 hours writing (copying) rote code, and then another hour going through and fixing all my syntax errors. Every line of code, every file added to implement something adds syntax errors. I’m not a perfect typist, and I’d be worse without the Intellisense in Visual Studio (then it would probably take me another 2-3 hours to fix the syntax errors instead of one). By the time I’m done, I have this byzantine thing that works, and I’m mentally tired, and I haven’t made anything that does anything much.

It’s huge, complex and it feels like gears that don’t do anything. I get the feeling that I could probably simplify this by having all the models implement an interface, and having all the service stuff implement an interface, and then the number of files I need drops in half or more. Everyone implements the same basic interface, and even the controller code is simpler. But it’s far far too late in this project for that. But all this type safety and structure makes someone happy, I think. It just isn’t me.

I read through the code that has been written by some of these C# people – people of intelligence and capability whose C# code is excellent, and I marvel at it a bit.  The amount that they try to shape it into C# is where it becomes crazy. JavaScript is not C#. It’s not strongly typed. And most very importantly JavaScript isn’t and Object Oriented language. Stop trying to make it work like one. (React.js does this some, the way that Backbone is implemented in on of our projects really wants to be OO).

I’m not saying you can’t do this with JS. ES6 has added the keyword class. But just talk to someone who’s done more than a few months of JS about lexical this and scoping. JS’s this does not work like any OO language ever. Even PHP is clearer on $this.

And I feel like I’m starting to get it. I write JS code, I listen to people who know JS online, and I find my code is like theirs. My code is nothing like the code I wrote a year ago, or even a few months ago. It’s better, and simpler in a way that I can’t explain.  I think I’m starting to get this.

Want to know how much I think I get it? So much I know how little I get it, that’s how much.  And it’s that learning and the experience I’m getting (and the fact that I’m working harder and better than every before) which is why this loosely typed, open source guy is working at a windows/C# shop. So long as I keep learning what I want, and keep getting better, I’m going to stay. Because Mastery is of the primary things that motivates me. (It’s more important than Authority and Purpose in the MAP style, at least for work).  I don’t think I’m the only programmer like this.

One of my goals this year is to extend my Mastery of what I love in code. Primarily this is JavaScript, but it’s also everything in the Human Interface sphere. Graphics tools, animation, responsive design. In the past few months, I’ve gotten a good grounding of Adobe Illustrator and that’s made me more productive than anything I ever knew about Photoshop. The most recent project has gained me kudos at work (and from the customer) for it’s look and feel. It’s simple, and most of my work has been in picking tools, and parts of tools that most cleanly express what the customer wants. But that’s the job, and I’m feeling good about it.

This week I talk to my boss about all of this, and where I’m going. Because I am a bit of an odd man out at work — my skills are needed because not everyone has them, but they also mean I don’t ‘fit’ in the way I could. I like my job, so let’s deal with it while it isn’t a problem. This is also something I’ve never done. Maybe I’m mastering this too.

Deeper into the JavaScript

In some ways this is a list of links to review again as I learn what I’m doing.

First is a StackExchange post about what everyone should know about Javascript.

That led me to the JavaScript Garden which has more information about quirks and best practices in JavaScript.

It also led me to this quiz that kangax wrote, showing with some simplicity some of the oddities of scope, syntax and so forth of JavaScript. I initially only got 4 right, although I’d probably have gotten a few more if I’d read and thought more carefully.  I went though the questions one by one, until I understood them, which is what this sort of quiz is for.

It took about an hour, a good part of which was reading kangax’s description of how delete works, and how the different scopes for global, function and eval work.  And I’m getting a clearer understanding of what happens in function declaration vs function expressions.  It’s also pretty clear that best practices have changed over the past few years as the products have matured and people’s understanding changes.

I’m thinking about the Meeting Room signs I wrote here for work, and how I wouldn’t release that code today.  They are working well and staying running, but the code is bad, potentially unsafe (not really as there are only 2-3 people who can enter text on the monitors) and I’d rather be proud of it.  Rewriting that for the new CakePHP platform here at work would be a good project while I wait on other things here.

Breaking It Into Shape

I’m having a conversation with some people about JavaScript.  A friend of mine is a veteran C++ coder, and is and  indie game developer working in that language.  He’s also learning JavaScript via codecademy.com. In some ways Codecademy is a bit oversimplified for us, as mature developers we can see through to where we’re going and skip steps to go there, but the learning process wants us to make a few obvious (to us, anyway) missteps in order to help justify the better way later.

I’m reminded of when I was trying to teach Algebra students in college.  I’d started my time as a math tutor teaching Calculus (which was a course or two behind where I was), but as time went on, the needs of the group I was working with moved more into the Basic Algebra area.  At the time, I wasn’t very good at it — I had trouble breaking down my thought processes into those basic blocks that the teacher required.  “Show all work” is an interesting directive, but it’s not very specific. If I can add three numbers, or do a factorization in my head, then what I’m showing is all my work, but it’s not enough for the teacher.  Plus, it didn’t help my students any when I could explain how I got to something.  {I think I’ve learned how to do this better in the 20+ years since then, but I have some empathy for those students I tried to help back then.}

That’s a bit of a digression from the online discussion, however. The discussion was about the OO properties of JavaScript.  Now, JavaScript is an object based language.  However, it doesn’t follow the typical OO model, with it’s inheritance, polymorphism, and other traits.  JavaScript uses object composition and prototypal inheritance instead.   It’s a functional language in the since that functions are an object type in JS (but not in the since that J or Haskell are functional languages — JS isn’t immutable, for example.)

Of course, you can do typical OO inheritance with JS.  the Dojo Toolkit does this.  They created a new function to inherit and extend classes. (IIRC it’s actually called extend in Dojo, I’ve also seen it called create in other libraries.)   If you are disciplined and use the function, you get behavior out of JS that mimics the way C++ or Java might work if they were loosely typed.

This was actually my original introduction to the language, and Dojo’s model spoke to me, as I’ve been working with OO languages for most of my career. (My first industry job was developing with PowerBuilder, for instance.)   As I’ve worked, I’ve moved more towards the lighter, more flexible jQuery. It seems to work more the way I need it to, particularly when I’m working with HTML– with jQuery I’m using a tool that fits with what I’m doing already; with Dojo, I’m using a tool that wants me to be working with its own paradigm.  The advantage of jQuery is that I can drop it and most of my apps will keep working.  They won’t be as nice or as responsive, but they’d still function — and that’s an important point.

I remember when I was first working with directX, writing a simple Concentration type game for my niece. One of the common questions on the directX mailing lists (this was a long time ago) was “How do I keep people from pressing Alt-Tab, and leaving my game?”  There were game-balance reasons to do this, at the time Ultima Online had a problem with people writing tools that could play the game for you — and to initialize those tools, you had to alt-tab out of the program and start them.  So by breaking alt-tab they could go back to the way games used to run pre-windows, as the only thing around with no game-breaking tools or processes running.

Of course, to break it back into the shape they were used to, they had to break Windows. So, very often, the response on the mailing lists was simply, “Don’t do that.”  Not that it deterred them, IIRC pressing Alt-tab wasn’t possible in early builds of EverQuest. There might have been one MMO that actually quit if you alt-tabbed.

In general, breaking something so it’ll work the way you want means you’ve got a bad technology fit to your design.  You either need to adapt to your technology by changing your design, or you need to change what technology you are using.  Some of the worst kludges and messed up, fragile code comes from not doing one of these things, and forcing these things to work together in ways they weren’t intended to.

I admit that while I’m pretty competent in JavaScript, I’m still learning how to work with the language. It’s like I’ve made it up the first couple flights of stairs — I can read and edit code; I can competently write code in the language.  And now I’m looking at the next flight which is a deeper understanding of how it works.  I’m sure there’s another stairwell after that, and so on.  You never stop learning.  But getting to grok how object composition and prototypal inheritance work at a fundamental level is my next stairway.

I think my boards project will really help with that, and it’s something I’m keeping in mind while I work on it.

 

 

Personal Project

I’ve always been of the mind that to really learn how to do something, you need a project.  A good project is one where you can use the new technology you’re learning to work with, but which has it’s own goals that aren’t necessarily perfectly in line with that technology.  You’ll learn where that tech is strong, where it’s weak and how to work with it.

A consistently designed technology will work similarly across its various parts.  Going deep gives you that kind of knowledge, down to the how of the tech.  A broad, light view of the tech is also useful, so you know what it can do — I find I can get that from reading a book, but to get that deep knowledge requires a project.If the project is something that you really need or want, even better.

So, one of my larger hobbies is gaming — which for me is a combination of my first love: pen and paper role-playing games, and my second love: computers.   I enjoy single player video games well enough, but the cool thing about the internet, is that it connects us to one another, and lets us (among other things) play games together.  Google+’s hangout feature means I can now see and hear those other people, but to play games with them, you often need something else.

In D&D that’s a battle map with figures on it.  For other games it’s a board or cards or something else — something that is a shared view of the state of the game, just like the different parts of a blog are the shared views of the posts and comments on the blog.   I’ve been working with G+ to run some games for friends, but we’ve not found a good virtual table top — they do exist, but the computer requirements for G+ are too high to really run another program on top of it.

I’ve also got a friend, Corvus Elrod who is working on a new RPG that will make heavy use of board game affordances.  The character sheet is essentially it’s own little board game, plus there’s potentially a shared board much like in other role-playing games.  This means you need even more visual input if you’re going to do things online.

As I unpacked the idea, I realized that most board games and virtual table tops have similar design methods, and play in similar ways, once you abstract it out.  This mostly applies to turn based games as opposed to continuous ones, which until WebSockets are more widespread is a better fit for the web, anyway.

I also floated the idea, on twitter, of writing up the project as I went along — dead ends, bad code (that gets better) and all.  I’ll start that next week, with a general design discussion, and some forays into real code.  The project is up, but there’s not much to see yet at boards.cultoftheturtle.com  (It also needs a decent name…)

 

And Speaking of JavaScript

Khan Academy has decided to make JavaScript it’s introductory language.

As I’ve said before, I think this makes a lot of sense.  JavaScript isn’t your typical language, I admit. Functions are first-class types; it’s prototypal, not object-oriented; it’s been much-maligned (and even by me).  My attitude about it has changed much in the past six years as I’ve been able to do real, interesting (and in production) things with it.

But more importantly, it reminds me of when I was 13 (thirty years ago) and our school got its first AppleII computer.  It had games (we played Oregon Trail, and Lemonade), but more importantly, built right into it at the command prompt was a BASIC interpreter. (Two of them, actually, AppleBASIC and IntegerBASIC.)  IBM PCs and their clones had GW BASIC or MS BASIC.   Commodore had it, Atari had it, I think TRS-80 had it, and my Time/Sinclair 1000 had it.  It was right there, on the chip in many cases, in the computer you were using.  There were no barriers — there were no IDEs either, but you could type

10 PRINT "Hello World"

And you were good to go.

Now of course, everyone with a modern computer — or even one not particularly modern — has a web browser, which for programming purposes is nothing but a JavaScript interpreter, sitting right there.  And if you’re running Chrome or have FireBug installed, you’ve got something I never had when I was poking around writing programs to solve quadratic equations — a full on, interactive debugger.

All those tools make working with JavaScript pretty reasonable, and the price is excellent.  There are no barriers, something we’ve missed for a while in programming education.  And I think, in the coming decades, being able to program a computer (even in limited ways) is part of computer literacy, something everyone needs to know.  So this is a great thing, and I completely get and support what Khan Academy is doing here.

Java[Script] Online Learning

I’ve been doing the codecademy.com JavaScript classes, and following along with Code Year.  I don’t really need to know how to, say, code a function in JavaScript.  But JavaScript has intrigued me for a while now, particularly after I got over my early animus against it, back when I felt it’s name was just a confusion for Java, and a dangerous new development. [I have been online for a very long time.]  I think it makes an interesting choice as a first language,  much like BASIC when I was first learning programming, JavaScript is there on every machine available to the budding programmer.  And also on their tablets, smartphones and any other device which has a graphical browser.

It’s also just good for me to see how other people program– perhaps especially those who know their code and style will be visible.  In my current position, I manage a single other tech employee, and while the county does have other programmers, we are organizationally separate from them.  IT professionals (or as I usually cal l us “Geeks”) learn from each other.  It’s hard to get that kind of training from college, because just a  few years out of college and the tech has changed, the best practices have altered, and things are new again.  We have to always keep learning, and we do that primarily from each other.  Thankfully there’s an Internet full of us geeks out there to learn from. so I’m not completely isolated.

A friend pointed me to CodingBat which has both Java and Python coding puzzles and practice.  I’ve been working through the Java ones, which highlights even more of the differences it has with JavaScript, even without considering object models or language style and ethos.  I have been fighting with Java’s substring on several of these (often going about the code in a different, if equally efficient method) but I’ve hit several that really need to make use of substring.

In PHP, which is the language I’ve spent the most time in, substring takes three parameters: the string, the start index, and the length of the substring you want.  (Strings aren’t objects in PHP like they are in Java and JavaScript.)   This seems reasonable to me.  I want the four characters starting with the second one, in php I say

substring($str,1,4);

And if I pass in the string “Hello World”, I get “ello” out.

JavaScript opts for a different implementation, taking the first index, and the final index.  So in the same example, but in javascript I’d get something that looks like this:

str.substring(1,5);

That seems reasonable to me, start and finish.  It’s like an interval in math (although a closed one).

Java pretty much confounded me though, I tried both of those and neither worked, so I finally did what I should have started with, and searched the docs.  Now I’d looked at it, but it was just substring(startIndex,endIndex), which matched my understanding so I hadn’t looked further.  But when I read it today, I realized  that endIndex is actually not inclusive in the Java implementation.  Which means that the proper code for Java is:

str.substring(1,6);

Of course, in Java I also have to make sure my string is at least 7 characters long before invoking that. JS and PHP will do something intelligent (returning “”, for instance, or just returning what is there, and not necessarily 4 full characters).   Which makes me wonder sometimes at the mindset of the Java people.  I’m not saying boundary checking is bad — it’s necessary.  But it could have been in the function, and built into the language instead of elsewhere.  I guess this makes sense because substring length = endIndex – startIndex. But somehow it seems counter-intuitive to me.

Ultimately though, it’s what it is.  Languages all do the same thing, or so my college COBOL professor said,  “Input, Processing, Output.  Learn that and you have the key to all languages.”  Most things are just syntactical sugar, so program with your help docs handy and you can do pretty much what you want with any language.  You’ll just stumble occasionally, which is one more reason why you keep learning and testing your skills.