Something needed mending
April 20, 2022, 11:53 am

While talking with some students, I noticed some parts of this site need some work. I did some spring cleaning and updated some things surrounding images. You might never even notice anything happened. A couple links were wrong. Some stuff I wrote 6 years ago and I never figured out how to do right, and now that I've learned more, and javascript and css have improved, some of those things could be fixed quite simply.

The march of time goes on, and things that were hard are now easy. Things that were great have crumbled, and some things that we set up long ago and forgot about suddenly find relevance again.

I've created a number of image uploaders over the years. With varying degrees of complexity and ux. But I often don't upload my images here, because it's such a hassle to resize them and upload them and rename them and archive them. It's a whole process. And sometimes my server just won't allow image uploads for php memory reasons.

And sometimes I remember that a long time ago I made a really good image uploader. One that works on mobile and accounts for all kinds of common factors that I want. Because I made it for me. And then suddenly I can start uploading images to my own website again, because it is not in fact a tremendous hassle anymore. In some ways it's a breeze. I did a little more work on my image uploader to make it even smarter, able to handle bigger images, and have a few more bells and whistles, and now it's pretty good. I'm kind of pleased with it, actually. Very pleased indeed.

I also started cataloging all my art recently. Figuring out who I drew, and making sure I had a full size archive of as much of my art created in the last few years as I could find. I'll be slowly leaking that stuff into my portfolio, as I figure out the best way to manage all of that.

Is it bad to not update your blog?
December 30, 2021, 10:29 pm

What if it was extraordinary times? What about then? What if life went absolutely nuts all around you, and you just sort of forgot to update it? What then?

It's been a hot minute since I've put very much on this website. I need to redesign it. I need to rewrite some things (especially an image uploader), and I need to make more of an effort to keep my self honest about my projects by posting about them in public. Let's see... where was I?

This year has been a series of big changes. At the beginning of 2021 I was let go from my full time status at the Academy of Art and I got a job as a Senior Frontend Engineer at a company called IMVU. This job has been really fantastic. But it's the first fully remote job I've ever had. Working fully remote is not something I ever sought, and it's been both freeing and frustrating in a lot of ways. I like to be around people, and if I'm totally honest, when I'm stuck in a house, I find it hard to motivate myself.

I am still teaching at the Academy sometimes. I like it. Not sure how much longer I'll be able to continue, but I think for now if they keep inviting me back, I'll continue teaching a class.

I worked on a number of personal projects. I've been doing a lot of things with themoviedb api. Did a little project with a friend for figuring out which of your friends you're most compatible with, based on the movies you like. And I just pushed a big update to filmswith, a website for browsing movie data, and comparing people and movies together. I rebuilt that app from the bottom up in React, and I've learned so much during the process.

I'm not sure I'd call 2021 a success. When 2020 started, I thought it was going to be such a good year. I had so many plans. In some ways it was great for me. But 2021 just feels like a blur. I'm not sure what to expect in 2022. I just have no idea. But I think I'm going to try to work on more personal projects. Here's hoping I can stick to that. Someone keep me honest.

Icons and libraries
July 10, 2020, 3:15 pm

So I have a thing that I work on periodically. It's a library of javascript code that is... well more or less a jquery replacement. But it's something I wrote, and it's something that does what I want. And I made it to learn a lot, but also because it's small, and it's clean, and I like it. It doesn't really have a name, but it's part of my apptools collection on github, and it just got a new release.

I was working on another project, my icon library, and I started to convert it to something that uses my library, and it had ALL KINDS of problems when it came to querying on an svg element. Turns out I had to solve lots of problems, and I had to solve a number of them, and I had to set up an ampps server to get everything working right, and it was just a whole thing.

But I think I fixed a number of necessary issues with my library, and it's never felt better. Not just its use, but also my whole work process got streamlined a bit, and it felt really good.

... Maybe I'll update my website one of these days.

A bit of an overreaction
March 7, 2020, 2:15 pm

So I've been learning react recently. I've been getting pretty far into it. I'm pretty confident at this point that I understand the concepts, and I'm able to execute on React Hooks effectively.

I made a quick little demo example TicTacToe game, because one of my colleagues was doing a tutorial, and I wondered if I could write one from scratch. And the answer is, I COULD, but also I pulled a tiny bit of code from one of my old examples. But honestly I just pulled the win arrays, because my brain shut down, and I couldn't think of how to do them for a second.

So if you're interested, here's a quick React app of TicTacToe, and the Github repo to go along with it.

I'm enjoying React a lot these days, and I've started multiple projects in it. It's groovy, and I like the build processes.

Do as I say, not as I do
March 4, 2020, 4:46 pm

My students are constantly required to have a work journal to record their progress. I rarely ever journal these days. Maybe it is because I can just tweet something out.

I started a new hobby, and a new project for it. Whenever I start something new, I can usually think of an app to go with it.

I started podcasting. I bought a bunch of equipment and I've recorded a bunch of material, but none of it has been released yet. So like... not casting. Just podding. Whatever.

Along those lines, I've started a new coded project this weekend called Agenda Run. It's an agenda software that is useful for people who are making speeches, or running group meetings, or... ya know... podcasting. I realized it was hard to keep on topic while podcasting, so I needed to make something to help with that. And of course, I bought a domain name. Cuz that's half the fun.

It's entirely possible if you click that link, that page will be broken. I am actively working on this, so whatever. It's also possible that you'll find it useful or useless immediately. Tell me your thoughts if you have any. I'm interested.

So I've gone a little overboard...
April 23, 2019, 12:58 am

I have a new thing I've been working on recently. I may as well post about it here.

I've been teaching now for about 10 years. I've never been better at programming and design than right now. I have not been sitting back idle, I have been attempting to push myself forward. The questions my students bring, and the projects they conceive have been amazing for my own personal growth as a professional.

Recently I began trying to write down some of the things I wish I had more time to talk about or teach during class. Either things that I came up with on my own for my own work, or things that are just beyond the scope of a design oriented school. Tutsos.com is a tutorial website, that I am becoming quite proud of. It is an organic recording of my own tools and how to make them from scratch.

One of the things I made offhandedly one night was a set of icons for a mobile design tutorial. And it ballooned out of control. I now have over 200 icons in a set that I designed. As a guy that never considered himself a designer, this is a big feat for me. If you'd like to check them out, they are searchable at icon.tutsos.com. But I'll just embed that here.

Javascript continues, so I make silly things
February 16, 2019, 2:56 pm

I am continuing my own javascript education. I have begun documenting some instructions, which I will divulge soon, hopefully, but I've also begun redesigning some old examples that I made for students, in order to make them more accessible. One such example is from my app development class where students often want to add more interesting interactions to their projects. It's difficult to suggest things to them, especially since simply pointing them at HammerJs rarely results in them spending effort to fully understand that library, and instead just confuses them by making them search all over the internet for a simple solution to that toolset.

So here's one fairly simplistic example. Not only for my students, but of my current goals. This is an IOS style list item swiper. You've definitely seen these before.

See the Pen Vanilla Javascript IOS style list item slide reveal by Hamilton (@bronkula) on CodePen.

The content inside of the elements, and the look of them, is mostly up to the developer. This particular class, which can be found on github, has a number of options, including an onupdate method which will be sent the swiper object to give the developer freedom do do lots of things.

Many interesting layouts can be created and used, and I'm still currently working on some other options. If you'd like to mess with these examples, you can find them on my Codepen.

The Unit Circle
December 15, 2018, 5:14 pm

I got a little bit obsessed with trigonometry this last year, and over the last week, I really tried to understand as much of it as I can, and how it is used in Javascript. I made a thing. There was a Reddit post about a unit circle gif, and I said to myself. I can make that, but better and interactive. And so I tried to. Here is an embedded version of my Unit Circle.

This thing is a kind of big deal to me, because it represents a lot of big things. One thing is my general shift over the last year toward actually documenting the things I make. I've been working hard on a lot of projects, including my drawtools and apptools libraries. I've been learning a lot about the latest ECMAScript in order to push my own knowledge and really be able to make these tools be great and useful.

And I'm kind of really proud of myself. People look at my art and they either like it or they don't. But people see the things I code and it feels like they think "I wish I understood this" Because I must be so excited about it. And they aren't. My code is like a high schooler's poetry. No one cares. I'm writing a pity party right now. That's what this is. I'm having a party just for me, and the topic is poor me. But it's what I feel sometimes.

I just have to say for myself that I'm proud of me. And if you're proud of me, I hope that you'll share some of the dumb things that I make sometimes.

Javascript Functions, Closures, and the IIFE
June 29, 2018, 9:14 am

When writing code in Javascript or any programming language, one of the core concepts that a developer has to wrap their heads around is the function. If variables are values to be referred to at a later time, functions are whole sets of code to be referred to later.

Function

function myFunc() { // Do something }

You can also define a function as a value, or as an anonymous function. Normally functions are hoisted to the top of the code and run first, but an anonymous function is created inline with the rest of the code around it.

Anonymous Function

var myFunc = function() { // Do something }

There is value in both of these methods. It is important to know your options and explore their relevance. But there are even more options.

Sometimes it can be handy to define a function that defines it's own lexical scope. This allows local variables to be set up statically.

Closure

function foo(){ var id = 5; var bar = function() { console.log(id); } return bar; } var foobar = foo(); foobar();

This series of code has some very interesting implications for scope and how to create functions that have their own values. The id variable only exists inside the foo function, but the foo function returns the bar function as a value, and since the bar function was made inside foo, and after id, it also has access to the id value. Closures allow you to segregate your values and give unique scope to parts of your project. This becomes especially useful when you want to write code for libraries and larger repositories.

Immediately Invoked Function Expression

(function() { // Do something })()

Then there is this beast. A function with no name. No real declaration, but put inside of an expression syntax that fires it off immediately. What is the point? Why wouldn't the do something code simply be code, why does it need to be wrapped up like this?

Well, defining a function anonymously allows it to be passed around by value in a much more flippant manner. Most often anonymous functions are used for callback reasons. However, if it tries to access values that were created outside of it's scope it accesses them dynamically at their current value. This can be an unwanted effect, that is most often run into when defining a callback function inside of a loop.

If you make 3 buttons dynamically in a loop, and have them each print out the iterator value on click, all of them will print out the last value, because at the time of clicking, the iterator would have only its final value.

for(let i=0;i<3;i++){ $("body").append($("< button>").click(function() { console.log(i); })); }

This exact situation is when an anonymous function called immediately to provide closure to its scope is most effective. But it gets more complicated. Any method that is expecting a function to be passed into it must receive a function. And a closure that returns a function as a value is a goofy thing to look at.

Anonymous Closure Callback Immediately Invoked Function Expression

var i = 5; $("button").click( (function(id) { return function() { console.log(id); } })(i) ); i = 10;

Now, that's just weird to look at your first time. It will start to make sense the more you end up using it. The IIFE is being passed a variable in order to give closure to it's current value. The i variable gets passed in at the end of the closure, and then is referred to on the inside as id. This means that no matter what might happen to i in the future, when the click happens, the value of i has been stuck into the static value of 5 in id.

[edit] So um... turns out that loop example doesn't produce the result I said it would which means.... That's not actually a problem when you use the let declaration, instead of the var. But the final example still matters.

A minor suggestion
August 17, 2016, 8:51 pm

I have always held off suggesting books for students to read when learning things in my class. Mainly, because I believe that someone else's methods and speeds of teaching will often interfere or even hinder someone learning things in my class. I think websites like Code Academy and Lynda provide brilliant tools for people to learn things at their own pace and at multiple levels. But being that I teach high level classes, I often find these sites either move too slow, or never reach a proper level.

I have, however, recently read a book that I feel is quite good, and I could recommend to people wanting to learn programming using the Javascript language. Eloquent Javascript is really quite a good book. I often tell my students that really the only thing they need is a reference for the guidance they will get in a class. In that case, I would usually just point someone at Javascript Pocket Reference