Tutorial for Heather Payne's project - Part 1
The Project
I recently discovered Heather Payne's excellent blog. She is the founder of the Ladies Learning Code project that teaches introductory technical skills to women interested in coding.
To practice her skills, she has proposed a project for herself. The details below are excerpted from Heather Payne's blog post:
- It’s a website.
- Visitors enter their first name and last name in a box.
- The site classifies you based on a) the number of Ladies Learning Code events you’ve been to, and b) the types of Ladies Learning Code events you’ve been to
- For example, if you’ve been to one Ladies Learning Code workshop, the site will tell you that you’re “en route to coding mastery” in some hilarious way. If you’ve been to only the launch party, the site will tell you you’re a “party animal” in some hilarious way. If you’ve been to three workshops, it will show you an image of a really happy cat, etc. I’ll probably come up with some other surprise categories for certain people, if I have time and can figure out how to do it.
- It’s going to include animated GIFs and be cheesy by design
- Goal: to get people who have not attended a Ladies Learning Code event to join our mailing list.
This project sounds great! But how does one go about building a website like this? There are a million and one technologies, tools, approaches, and processes to consider, and it gets all too much way too quickly! I thought I'd write a tutorial that shows how I would approach this problem for an advanced beginner's point of view. I am not a programmer by trade - I'm actually an English lit major.
Breaking it down
I think Heather has a great mind and she's already broken things down into steps. I'll take apart the problem some more.
First of all - entering first and last names in a box. That sounds like an Internet form. Where do we see these? On almost every single website out there! Login boxes to gmail or paypal, when we buy things online, subscribe to a newsletter - wherever you can fill information into a website, that's a web form.
What information do we want?
So there are two pieces to this puzzle. First of all is the information - what do we want? what are the qualities of the information we're trying to capture? This sounds like a stupid question - duh - first and last names, how complicated can it be? If you're so smart, why don't you tell me what is a first and a last name? Can they be
- English letters only or characters from foreign languages as well?
- Are numbers or spaces allowed? For example some people use names like happycat25. Some people have multi-word names that are not hyphenated like my friend Mary Jean.
- How long are these names usually? 25 characters? 50 characters?
Wow, how come we have to worry so much about these things? Because fundimentally, computers are not sentient beings (so far) and don't understand what names are. We understand what a name is though.
Now we narrow things down. I want my project to take- English and French characters for now (world languages are great, but it's too hard right now for me to build)
- Spaces, numbers, dashes and the usual symbols that you find in names are allowed. But things like @, %, ^, = should be filtered out. Who knows what people will put into that box! Note: this is a security issue - to be explained later on when we work with the data.)
- First and Last Names should have a max of 20 characters each.
Now we have some specs! We will keep revisiting these three "rules" as we proceed, to check if our assumptions about names are still valid.
Where do we keep the information?
The second part of the question is where do we keep this information?
Many people will jump straight into the deep end of the pool with the usual super technical answers: a database! MySQL! PostgreSQL! redis! MS Access! And now we descend into a pile of jargon that will only complicate things.What we really need is a place to keep stuff. Ideally it's some kind of table. Example:Record # | First Name | Last Name | number of events | types of events 1 Celine Dion 1 party 2 Michael Bublé 2 workshop 3 Rebecca Cunningham 3 party, workshop 4 Kit Cloudkicker 4 party, workshop
Yes I wish all these superstars came to Ladies Learning Code!
- It looks like excel so most people already know how put the data in.
- It's already online so we don't have to worry about setting up servers.
- It's protected by your google password so we don't have to worry about people doing bad things with your list, and very importantly,
- There seems to be a way for code to interact with Google spreadsheets.
Number 4 is very important. In computer jargon, it's called an Application Programming Interface (API). Not every online service has an API, and some services offer better API's than others. I don't know how good the Google spreadsheet API is. Will it let us do all the things we need to do? Who knows! Maybe it won't work and we'll have to find another way! That's part of the fun of programming. It's like driving around, finding adventure in an unfamiliar city.
PS: For coders looking for something more advanced, another good fit for this kind of data is redis, which is a simple storage device - simpler than a database, but more capable than a flat file.Now I am going to stop here. The next step is to take all these ideas that we have, and start putting them into technical terms. We will be looking up and reading a lot of documentation! Stay tuned!Top Tips for this lesson:
- Think about the problem, and then choose the tools.
- Be incredibly specific about what you want. The computer is not afraid of giving you everything that you want, all the time, and it's nag-proof.
- Always be on the lookout for API's. It's like people watching - you never know when you'll just run into a service that has a gem of an API.
