All’s Fair In Love And Code

loveandcode.png

When I moved into my dorm room freshman year, our hall quickly became known for its brand new cafeteria The Gallery, boasting everything from pasta stands to sub stations, and a pub menu in case you needed a greasy philly cheese steak sandwich in between lunch and dinner… Gaining the freshman fifteen takes relentless commitment and with unlimited meal passes, I was ready to put in the time.

I recall the day when Lindsay came and sat down beside me at my lunch table a few weeks into the semester. We instantly bonded over our obsession with all things food, and how much we loathed walking to classes. Although these traits may sound somewhat generic and silly, food creates an unbreakable bond. We lived together every year after that. Now my very best friend is engaged, and I was designing her collateral. I was more than confident to take on the print work, but I also recognized the opportunity to try my hand at coding. It was one thing to update some CSS, but creating a site from scratch was a whole different challenge. Below, I leave you with a log dictating the process and journey to jakeandlindsay.us. The dates may not be spot on, but the struggles and joy are all real, yet occasionally excessively dramatic for entertainment purposes. 

save-dates.png

August 2: Save the dates are done. I am hopped up on adrenaline, as Lindsay has just given me the green light to make her website. 

August 23: Get all of the content for the site. This is crucial. Bacon Ipsum is great, but I need to know what I’m dealing with before I start hacking away at this thing. 

September 2: Work on website mockups in Illustrator. I knew I wanted to do a simple, one page site. Lindsay didn’t have a lot of high resolution photography to work with, so I needed to figure out how to work in some royalty free stock photos in a way that still felt original and specific to her.

lindsay-wedding-site.png

September 2: Text Lindsay a screenshot of the website, and then pray I can make it look remotely close when I actually code it. 

November 24: Heh, did I wait a little while? Huh. While I was excited, I recognized my amateur status. I needed to take a class…something that would keep me on track. While doing my daily perusing of Brit + Co, I notice new hire Allison House has posted an HTML + CSS coding class.

November 25: I’m kind of pissed at Allison House for taking my dream UX job, but I guess she’s qualified. 

December 3: Buy the class. Celebrate with wine.

December 3: Download Sublime text editor and drool over the color palette. Focus. 

December 3: Mess around with my Olloclip iPhone lense to attempt a cool Instagram shot of me coding, obviously. None live up to my standards. Oh right, focus.

December 3: Begin the class. It becomes immediately apparent that I am mostly interested in the CSS, as I begin grabbing Google font links and adjusting the letter tracking before we’ve finished discussing paragraph tags. 

December 3: Divs, classes, wine, tags, got it. 

December 3: Preview in browser, preview in browser, preview in browser. I need to LOOK at the thing.

December 3: Progress. This looks like a website. Must be a website.

December 3: Allison didn’t really cover making the site responsive. I investigate. I recognize that I've pretty much skipped over the trend of adaptive design. I don’t want three separate layouts, I want something fluid. Screw pixels, I need rems and percentages. 

December 3: Speaking of percentages, I feel 98% amazing at this point. The satisfaction of coding something and then seeing the result is addictive.

wine.png

December 4: Spelling is hard. Drink wine.

December 4: Given that I’m doing a one page layout, I need to get the backgrounds working so that every other section displays a dark photo background. I’m way past what was covered in the class at this point, but I’m down for doing some research. Hello sections. 

December 5: It’s in a good state. I want it better on mobile. Should I even think about attempting a menu? Must talk to my friend Dario about his awesome front end skills. He agrees to help.

December 25: Merry Christmas. 

January 1: Happy New Year! Travel to Texas for the Cotton Bowl and cheer for MSU. Assess emotional status after humiliating and devastating loss. Need a few days to recover, and to stop crying. Drink Bloody Mary. 

January 5: Wedding invitations. RSVP cards. Accomodation cards. Learn how to spell accommodations correctly.

January 15: Shit. We just sent the invitations to print that include a website domain I have yet to purchase. Panic. Utter panic.

January 15: Domain is available. Buy domain. Tequila. 

January 15: Lindsay and I set the date for the site to go live. February 1st. This means I have to finish it. 

January 21: Switch to Brackets. Very nice Adobe.

January 29: Dario convinces me to move to CodePen. He helps me update the template, and teaches me about sass. Nesting is badass. Naming classes in a way that makes sense and gives context is extremely helpful. Make sure I know how to spell accommodations. Drink a beer. 

January 29: I love CodePen. This layout is ideal. I can see what I’m doing in real time. This is heaven. 

January 29: Get geeked that I've learned when to properly add line breaks. 

default.png

January 29: Hmmm.. Javascript? Yikes. We decide to use a mobile menu across the board, as the website layout is simple enough. Dario makes me a sample menu. I research how he made it, and tweak a few subtle style things. All in all, it was lovely. Don't fix what ain't broke. Seriously. 

February 1: Site is almost done. I’m ecstatic. Buy hosting, download FTP client. Wonder why these companies are all obsessed with cheesy animal cartoons. Lock myself out of FTP client. Chat with friendly HostGator tech support. Make sure I know how to type my password correctly…

February 2: Damn you Safari, why do you have to hate on poor, innocent Flexbox? When a bridal party is more of a parade of people, you simply need columns. 

February 2: Explain to Lindsay that we’re working on a Safari bug. Try and explain what a bug is. Giggle.

February 2: Success. Upload everything to FTP. Thank Dario. Panic. Wine.

February 2: Damn. I made a thing. 

 

Samantha NovakComment