Week 9 – Crunch Time

It is hard to stop long enough to write this. Sometimes this past week I was too excited to work on my project to sleep. Still I know this is valuable for my sanity to think through what I’ve done so far and appreciate how far I’ve come. Plus, my brain functions better when I take breaks from coding.

Looking at my post from even a week ago surprises me because it feels like longer than 2 weeks since I was figuring out how to use web APIs for example.  At the time it made me feel very lost and the concept seemed extremely foreign. Now whenever I see there’s an API that can be used, it feels like it’s the easiest thing to implement and leverage.

So this week definitely went fast and continued to remind me about “best laid plans”.  I had a couple of key functionality goals like trying to get clickable text on my map. Which I worked off and on all week to get that functionality, and I’m still just cracking the edges of that nut. Still there are cracks so I know it’s a matter of time. Anyway, where I am going with this paragraph is that I had some goals and I chipped at them. When they got too hard or there was a barrier, I shifted focus and tried something else for while before going back. Some things were much easier wins that I went for to feel some level of success, and others I let myself accept were items I can deprioritized for later based on complexity.

Last Sunday, there was a lot of other life stuff going on so there wasn’t a lot of coding. It was a good break. I did take time to define a larger local database of neighborhood data, and I found lots of variations on how San Francisco neighborhoods are defined. There are a lot of opinions in this town.

On Monday, I decided to take a crack at setting up login and create account functionality using Flask Login and WTF (for WTForms integration – not for what some of you are thinking but at times feels applicable). I had heard a number of classmates talking about using these  extensions, and I wanted to practice applying the packages while I had my cohort’s expertise to leverage. At some point, I plan to add functionality where there will be customizable views for logged-in users (e.g. choose the key locations you want to know the weather on like where you live and work). We had a lot of speakers that day so there wasn’t a lot of coding time.

Tuesday, I built out the login and create account pages so they were loading. The code I wrote was pulled from tutorials and code that my classmates had written to implement login into their apps (thanks Marissa & Jennyfer). At Hackbright, we talk a lot about reuse and not reinventing the wheel in programming if you don’t have to (unless you are trying to understand the fundamentals or you want to create your own thing) .

Also, I re-ran the database model setup to seed it with the revised neighborhood dataset from Sunday, and to build out a table to hold user account data. Furthermore, shifted my database management system from SQLite to Postgres. I wanted to practice Postgres (again while I can leverage the collective knowledge of classmates – thanks Lindsay & Dee), and its what you need to use if you deploy to Heroku.

Wednesday, I spent a good chunk of time really trying to understand the login code to see how I could adjust it as well as test it. For example, there are WTF default validators you can use or customize for form submission validation. So you can apply and throw standard errors if a user enters their password incorrectly and customize the errors and say “random error just to annoy you”.

One thing I figured out when reviewing the login and create account code was how to take the repetitive display code, and simplify it to a for-loop. It was satisfying to make it more compact. Lindsay thankfully helped me fix this one issue I was having with the consolidation because there was a second/embedded for-loop to generate the WTF errors. I was having a hard time figuring out the right object reference name to use, but Lindsay was able to identify it with a little testing.

Thursday was a much needed code clean up day. I adjusted file and variable names to take out duplication and make it easier to understand the structure. I shifted code into files that made sense like pulling straight functions out of my views file and into a functions file. I went back and added more comments when I found myself reading code and not remembering what it was for. I also continued to tweak the app design and finally finished small gaps in results like having the neighborhood name populate in the title of the results page.

With the help of my instructors, I also started to restructure the code in preparation for adding an Ajax spinner while the page loads. It involves creating a shell page that shows the spinner until the page with the content has finished loading. This is valuable considering I have several web API calls that can take time to pull the data into the results page. I’ve got a couple more items to look up to finish this functionality.

One of my more satisfying moments was at the end of the day. I tackled including autocomplete (when typing in the search bar it will give suggestions) into my code. I wanted to use my local neighborhood database to fill in autocomplete vs. some of the plug-ins that are out there. After a couple of hours of trial and error, I was able to pull my database results into an object variable with SQLAlchemy and Python and then pass that variable with Flask views to the rendered HTML page where Jinja was able to reference the object variable inside of the script tags.

I ran a Jinja for-loop over the object to generate a list of the neighborhood names and assigned it to a JavaScript variable. That was then referenced in my JS file and utilized by the jQuery code to generate autocomplete in the search bar (also referencing the jQuery code in HTML to activate it). Basically there was a couple different languages I was writing in, lots of data passing between them and referencing of different files. And when it all came down to it, it worked. It was so cool when it worked. It made me feel like I was starting to get the hang of this programming stuff.

As mentioned above, throughout the week I took some time to work on setting up maps with text. I researched examples that were already implemented and tried incorporating the code. On Friday, I went in with the intention of getting text on the page. As usual, I got sidetracked. While trying again to apply the JS Mark With Label library, I found that this error I was having since I setup maps was getting in the way.

Maps loaded when the app initialized, but it was always looking for coordinates which weren’t generated until at least one search ran. So on the first page when no searches had taken place, it would throw an error. I could have just passed it some static coordinates but I wanted to stop it from trying to load. I had put that as a low priority fix since it wasn’t preventing any page loads or the map to load when a search did take place. However, I found that I needed to understand how to fix that error in order to make any additional JavaScript/jQuery progress.

Thankfully Alex, one of the cofounders of Codepen, was on site yesterday and just helping all of us with our projects. He helped continue to further my understanding of JavaScript/jQuery and to resolve the loading error. After that and on my own, I was able to get Mark With Label to work. So there is a label now showing up on the map. Next steps are to revise it and make more than one label for the different neighborhoods and then to make it clickable. The rest of the day I spent time on some easy wins (e.g. adjusting look and feel and applying Bootstap’s JS modal plugin for the login) to offset all the time spent around just getting a label to show.

There is so much still I want to do and I can’t believe its one more week officially left in the program. This next week there won’t be much time for coding because of Career Day, prepping for interviews and general hanging out with the class and soaking in the time we have left together. I still can’t believe its May.

If you read this far, I’m impressed. My last couple posts have really been for me to keep track of progress and status. They have not been as laymen friendly or geared towards mass consumption. Next week, I plan to post more around what Career Day was like and less about project status.

If you are reading this and thinking about getting into programming and have any questions about getting started or wanting more clarity about comments above, feel free to email me. If I don’t know the answer, I know how to find it and/or I know a lot of people who do.




Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s