Ryan Schneiderman is the younger brother of a good friend of mine, Jason. They’re both developers — Jason works at Bloomberg and develops applications for the Bloomberg Terminal, a key piece of technology that traders, banks, and financial institutions worldwide use to get information on the price of a stock, for example, as fast as technologically possible. Though Jason doesn’t really use any of the technologies we’ve been exposed to in this class, he suggested Ryan would be a good choice.
Ryan graduated from Tufts University with a computer science degree last year and has been working as a freelance web developer since then. He recently finished a complete website for his father, a successful photographer in Vermont.
The first stage was architecting the overall project. He wanted to figure out what backend framework to use. Schneiderman eventually went with Django, which is a high-level Python web framework, mostly because he saw that a lot on job applications and assumed it was one of the more marketable backend architectures to learn. It turned out to be a really good framework to use for the website.
The first step after deciding to use it was to research a bunch of tutorials on how to use it, and then started to get simple “Hello World” pages working. He used Amazon Web Services to host the website. It was an early major hurdle, Schneiderman said, to know that he could host a Django application on AWS and then, from that point forward, it was just a matter of writing code.
The first thing he tried to do was just to display one of his dad’s images on a page with nothing else, just an image by itself on the front page. That in itself contacted all of the different parts of the application, from the database, to the view which queries the database and sending that information to the front end.
“I remember when I did that it was like the first ‘eureka’ moment,” Schneiderman said.
A lot of the early process was troubleshooting. it was a lot of Stack Overflow, Googling, some YouTube videos. Every step of the way Schneiderman said he gained a little better understanding of what’s going on, then chunking away, getting a breakthrough, and hitting another obstacle. Learning a new language or framework is a lot of small little victories that contribute to a greater understanding along the way.
“It was more a mental hurdle than anything else, just to stay the course and keep chipping away,” he said.
To design the prototype for what he wanted the site to look like, Schneiderman just used pen and paper just to figure out the aesthetic, the organization, what he wanted to have on each page.
As for giving his non-programmer father ability to use the site, Schneiderman said Django allows for a templated admin page that’s attached to the website. It’s basically an interface for the database, so you can upload images.
Django comes with a decent template structure to interface with the database from a user perspective. So that was actually one of the things that Schneiderman felt very fortunate to have chosen Django because otherwise he likely would have had to build an application that his dad could use to upload.
Most of the communication and collaboration between Schneiderman and his dad was on the functionality of the front end, which ended up being mostly HTML, CSS and JavaScript, including some React.
React is a JavaScript framework that allows for updated and state-based JavaScript. So for example, you can have constant rendering of different content that doesn’t require completely reloading the page.
On Schneiderman’s website there is a gallery that displays cascading images, and then when you click on the images, it enlarges it and then will take you to a separate page. And what you can do on the page is click on arrows that act as a slideshow and it gets you to different images. That function of moving through the images meant he had to reload the page every time.
But when he built the same slideshow on React, it was basically instantaneous. The tradeoff was that in order to do it, the page had to load more content up-front. So when the page is first loaded, all the images that you could possibly click on are already loaded, which takes a little longer.
This is as opposed to having one image on the page, then clicking through and sending a request to the backend to get a different image, so it was definitely worth it.
“If you’re planning on implementing anything dynamic on the front end, I would highly recommend looking into React,” Schneiderman said.
There was a lot of JavaScript, mostly interacting with dynamic content. For example, some images are vertical or horizontal, different sizes and proportions. When the page was loaded, Schneiderman wanted certain styling to be as a function of what the sizing of the image would be and of whether the image would be matted or framed.
With Django, there are certain tags where you can access content from the backend in the front end without having to do really complicated queries.
“It’s literally curly brace, percentage sign, and then whatever you named your image in the backend. Very simple,” he said.
Schneiderman recommended using YouTube videos to gain a high-level understanding of a new framework, and StackOverflow to get more granular. Google is also useful, but it’s key to use precise vernacular.
If he was to do the same project again, he likely would have used Bootstrap, which is a powerful HTML, CSS and JavaScript library Schneiderman wanted to use to simplify his CSS. Schneiderman styled the site by hand, and regrets not knowing about Bootstrap before.
Schneiderman, who coaches a middle school basketball team on the side, is now developing an app that helps basketball coaches and players facilitate the team building process. The app is within a website that can diagram and animate the plays. This way, players are able to study and learn plays more effectively and more academically, because the only time players are learning a play is in practice.