Some Coding Goals

Setting my own goals

It was not a super-productive summer for me, coding-wise. However, as I get away from ‘vacation-mode’ and back to ‘real life,’ in addition to improving as a teacher (more on that in another post), I want to improve as a coder.

Here’s the thing: There are a million ways to improve as a coder. And, I’m sticking to the ‘hobby coder’ label, so I don’t feel compelled to even try an know everything about coding, or even a specialization under the ‘coding’ header.

My task: is to be able to do the things I want to do, nothing more, but also nothing less. (To be honest, it will always be something less — I have an active imagination for what’s possible.) Now though, what I’d like to do is to make the things I make seem more like a ‘web application.’

What’s a web application?

The short answer is: it doesn’t matter. As a language teacher, I’m a big fan of the idea that words only mean what you and the person you’re speaking to understand. And, when I say web application, I mean it in contrast to a ‘web page.’

To me, a web page is static: Some guy (me) writes a bunch of stuff, takes a bunch of photos, makes a video, maybe, and puts it online. The web page is your chance to interact with what I’ve made, on my terms.

A web application, on the other hand, is magic. Sure, some guy (me) made it, but it’s a tool that I get to pick up and use how it best fits in my life. A web application is my chance to take something algorithmic I’ve made, and let you run with it.

Don’t you already do that?

To be fair, yes, I think that Dynamic EFL already qualifies as a web application. But, it doesn’t feel like it yet. It feels like a series of web pages that the user moves through, ending with a PDF, the most static document format of all time.

It’ll always end with a PDF, because the whole idea is that it’s supposed to be hidden. The learner isn’t supposed to know you used a ‘tool.’ The learner might hear the word ‘tool’ and think ‘shortcut.’ The whole idea is that the learner thinks “wow, the teacher invested time in me. I’m getting my money’s worth.”

So, maintaining the PDF format at the end, the way I see to make it feel more like an application is to make better use of transitions between pages and modals (the ‘foreground’ pages that open ‘over’ the rest of the page — logins are often done in modals).

The best web applications — gmail, Google calendar — don’t feel like pages at all. It feels like you enter an address into your browser, and then you interact with an application. That’s what I’d like to do.

A good argument for it

First, I rationalize it would help make what I do clear in comparison to what teachers are already paying for — static resources presented on web pages.

Second, it’s a sales point. Done smartly, the transitions and ‘web app experience’ simply feels more ‘modern.’ It helps to explain why I’m taking money.

A roadmap

I don’t have a roadmap in the traditional sense. That’s where this little goal-setting exercise breaks down. I’ve started experimenting and I’m finding it pretty hard. I have used JavaScript to dynamically change content on a web page, but I haven’t made the animation part of that work, and I haven’t been able to load a new django view into one <div> of a page.

So, I guess I have my work cut out for me.

The plan, now, is to leave Dynamic EFL how it is as I begin attracting beta testers. Instead, I have a new project idea that I want to start from scratch as a web application (using Google APIs, no less!) (more information on the actual project in a future post). Then, when that’s working, I’ll be able to apply lessons learned to Dynamic EFL.

Wish me luck.

Advertisements

It’s easier to expand than to fix…

I feel like everything I learn about coding is already a well-known software truism. But, I wanted to report in on my progress with the EFL worksheet software by saying that it’s moved back to the top of the priorities list and I’m working on it, but slowly.

There was a bug where the gap fill sentences created for capitalized vocabulary (‘Baltic Sea’ and ‘Vienna’ are examples) didn’t work correctly.

I immediately realized that the code put the entire sentence into lowercase (with Python’s .lower() method) before looking for the word. No problem, I thought, I’ll just find where the word is searched for and have it search for the lowercase text of the word. Problem solved.

I genuinely thought that was something I could do quickly, by way of getting back into the coding game…

More than an hour later, I found the spot where I forgot the extra .lower() call and everything was fixed. But I needed a full hour to figure out where in my code that happened.

A full hour.

I’m discouraged that I had such a hard time finding my way through my own code.

Updating the Interface

I have been busy, and frustrated, as I work on the worksheet generation app. And, unfortunately, I haven’t been adding new functionality or improving the existing functionality. At least, I haven’t been improving it from the point of view of how the worksheets are made. I’ve been working on how people make the worksheets.

This is what the app interface used to look like:

old-formattingIt really isn’t bad, it’s just very basic. I knew I’d change it at some point — I use this site more than anyone else, and I have an idea how I want it to look — but I wanted to focus on features.

Then, recently, I invited friends and colleagues to try the website out. And nobody seemed to understand what it did. I told them (in emails, in person) and they loved the idea, but the interface that seems obvious to me… well, it obviously isn’t.

I had an idea: I’ll make a sort of tour you take, before you can sign up, that will explain the functionality with screen-grabs. 

But, there are so many things on my plate, I know the chances of me making the same tour twice are not great. At least, not in the same year. So, logically, the interface should be changed.

CSS is hard!

The thing about CSS is this: you can  download templates (like I did for the landing page, from a great resource called Start Bootstrap), and I figured I could easily adapt the rest of my page to match it.

Wrong!

To be fair, I haven’t yet come across a CSS problem that, once I figured out how to articulate it correctly, didn’t have a clear answer somewhere. (Also, I love the resources provided by W3Schools, but hate their search functionality. Are they trying to make money there?) But, every step felt like an uphill battle.

Eventually, I got to a point where I was starting to be satisfied with the result.

Hosting static files on django is poorly explained!

I’m starting a list of things that were hard for me to learn about django, to eventually explain when I feel like I understand them. One thing would be the deployment to linode (remember that?) and another would be hosting static files.

After a lot of googling and basically blindly trying things, I’ve stumbled into a configuration that worked. But, for a while, it only worked on the linode site and not locally and I was too frustrated to change it. So, every change I made had to be pushed to the site to be tested, which was also frustrating.

Then, I got around to working out my development file hosting and was able to test changes more quickly (and without feeling like I’d have ‘broken’ the site just then when a friend would try to use it), but when I pushed my changes to the linode server, I realized that I’d broken hosting there!

Now, things seem to be working both locally and on the server, and I’m going to not play around with it. But, I have other projects cooking, and I’ll need to wrap my head around this.

So, what does it look like now?

Obviously, after all that drama, you’d expect something amazing, right? Well, it turns out that I can fix individual problems, but I don’t really have much of a vision of an overall design. So, while the layout is basically the same, the new formatting is something I’d rather spend my time looking at:

new-formatting

It has a title bar that remains fixed as you scroll, and functions are presented as buttons (because they seem to suggest action) and, rather than telling you “there is enough vocabulary to make a memory activity,” it simply doesn’t show you the option unless there is sufficient memory.

I can live with this for the rest of the academic year, I think. Now, I just have to clean up all the pages and make a tour, as well as finishing up my ‘minimum functionality…’