Demo Page - Breaking Bad for All
This is Part 3 of Breaking Bad Series on my attempt to build a web app.
See Part 1: A Small Intro
See Part 2: The Parallax Universe
Breaking B.A.D: Break the steps. Build And Deploy.
Part 3: Creating a prelaunch sign-up site
Toolbox: - Heroku - HTML5/CSS3 - Twitter Bootstrap - Ruby on Rails
Concepts: - Ruby on Rails - Deploying to Heroku - Git workflow -
Reuse, Recycle: From the previous post Part 2: The Parallax Universe I used a smaller bit of the parallax and jQuery Easing Plugin scripts.
This is how I feel when the site is finally deployed
The Prelaunch Signup Site: Seems like a prelaunch signup site is a prerequisite for most startups. Get people excited about your product, have them on your mailing list, & boom – you’ve got an audience on launch day. So taking a page from the rulebook, I created my own mock prelaunch site: erinl.ee in beta. I’m the product – currently being worked on while learning at the Flatiron School and ready to launch after I graduate. Get it?
Ruby on Rails: In order to become familiar with the territory I need to venture into the belly of the beast. I found a tutorial to get me off the ground from the RailsApp Project: Rails Tutorial for a Startup Prelaunch Signup Site. This was not a simple tutorial.
I’ve got 99 Problems and a Gem is One:
1. Cucumber, Devise, Hominid, Oh my! The Gemfile was stuffed with exotic gems, more than I could handle; thus, methods throughout the files I’ve never seen. But because the tutorial has you follow an application generator template called the Rails Composer I was saved from creating most initial steps.
2.
Try & Try & Try I tried the tutorial three times. And could never get past a certain point. I git cloned the whole file and changed around the view files, working around form tags and tracing back which view belonged where. Then I broke the signup form. There were about 5 github repos of this tutorial.
3.
In a Cucumber Pickle Behavior Driven Development. I had an awareness that Test Driven Development was important to software development (of which behavior driven development is based on) but had trouble when going through the steps.
4.
Giving the world my password A total novice (& dangerous) mistake: I entered my email username, password and API key directly into the files which is open sourced on Github. Later, I learned to use the Ruby variable ENV["EMAIL_PASSWORD"] to set my sensitive information in a config/application.yml file using the Figaro Gem.
5.
What’s in a name? After deploying to Heroku, I wanted to set the name of the application site to my custom domain. Apparently, you can’t set a naked (ANAME) domain to your heroku app. Only subdomains (as in www.example.com) are allowed. I struggled with this part a bit. Finally, I found a way to work around the naked domain problem through this post: How to Install and Configure Octopress on a Mac.
Simplify:
Instead of going through all parts of the tutorial I took out the parts irrelevant to my learning and extra functionalities I did not need. Major parts I took out: Cucumber test-driven development and admin page with Google Visualr chart.
Pair Programming:
The tutorial wasn’t always explicit in its instructions. I’d hit roadblocks after roadblocks, and after my third attempt I used my ‘phone a friend’ lifeline. My PHP developer friend guided me through the tutorial’s hairy parts, especially when I wanted to skip parts I didn’t care for or when I wanted to implement javascript scripts.
Git Workflow:
A major benefit as a result of the tutorial is understanding the rhythm of the git workflow: create a feature branch, make the changes, git add & commit, switch branch, squash all your commits and merge it back into the master. Then push!