Add old blog post images/embeds

_posts/2012-12-03-hello-world.md

@@ -0,0 +1,107 @@
+---
+title: Hello, World!
+layout: post
+---
+
+This past summer, I decided that the basic HTML site that I had at hallada.net
+wasn't going to cut it anymore. I needed a blog.
+
+At that point, I had already come a long way with [Python](http://python.org/)
+and was pretty familiar with it and I was beginning to get familiar with
+[Django](https://www.djangoproject.com/), a web framework for Python. Django
+was what I was working with at [Valti](https://www.valti.com), and I was really
+liking making websites with it. It took what made Python awesome and applied
+that to web development.
+
+I started from a blank Django project and built it up from there. Django's
+Object-Relational Mapper (ORM) can be boiled down to this: python classes
+(called models) in a Django-specific module named `models.py` represent a table
+in a database, where the attributes of the classes are columns in the table and
+instances of the classes are rows. This was something that was very intuitive
+for me, since I came from a Python and object-oriented programming background.
+
+The first step was to create Entry models which would hold text, title, and
+other related data pertaining to a blog post. I then created a view that would
+display these Entry objects in some order. A "view" in Django is just a Python
+function that accepts an HTTP request as a parameter and returns an HTTP
+response that the server will then hand off to the clients browser.
+
+From there, the project took off. It became the project where I would take all
+of the refined knowledge I was gaining at Valti about Django, and apply it in a
+very controlled and perfected environment. 
+
+I built other features such as Project models that hold data about a specific
+project I have done, Tag models to hold a word that would categorize Entries
+and Projects, an archive view that would chronologically list all of the
+entries I've ever posted, and many other small things I could never list out in
+one blog post.
+
+Django itself provided many useful features for my blog. After all, it was
+built for this type of use.
+[Comments](https://docs.djangoproject.com/en/dev/ref/contrib/comments) were a
+big feature out of the Django contrib package that I used. However, I heavily
+modified the way comments work on my blog to make it more streamlined. For
+example, I used [jQuery](http://jquery.com/) and
+[Ajax](http://en.wikipedia.org/wiki/Ajax_(programming)) to grab another
+commenter's post in pre-rendered markdown syntax and inserted it into the
+comment text box when you click reply on someone's comment.
+
+I pulled in a few third-party packages, like
+[South](http://south.aeracode.org/) and
+[django-markdown-deux](https://github.com/trentm/django-markdown-deux) as well
+to make my life easier, but I tried to constrain them to things that would more
+aid me than do all the work on the blog for me. Because the fun in creating a
+blog in Django instead of using some pre-manufactured
+[Wordpress](http://wordpress.org/) template is that I get to design, implement,
+and maintain the site all on my own. This allows me to really truly understand
+what is going on under the hood.
+
+Surprisingly, the most difficult part of the whole project was the design of
+the site. It was actually what stalled me from completing the blog until months
+after I had started creating it. I absolutely despise CSS.
+
+Luckily, I found [Bootstrap](http://twitter.github.com/bootstrap/). It's
+sensible grid-system actually made sense to me. And I was able to make a decent
+looking layout very quickly using it. But of course, I still stalled forever in
+trying to perfect the design to get it *just* right. A couple weeks ago I
+finally decided enough was enough and I was going with the current layout so I
+could start blogging.
+
+My old site was hosted on a friend's server, but this time I decided that I
+would host it on my own server so I could get a better understanding of the
+inner workings of web servers. I ended up hosting it on my [personal virtual
+machine](http://alpaca.mit.edu) provided by [MIT's SIPB](http://sipb.mit.edu/)
+[XVM project](http://xvm.mit.edu/). I had previously hosted many Django
+websites through the cloud server provider [Heroku](http://www.heroku.com/),
+which worked fantastically. But, I had never tried to host on my own server.
+
+I decided on using [Apache](http://www.apache.org/) to host my website since it
+was the most common throughout the web and I would be bound to encounter it
+again in web development anyways. I tested the whole configuration on the
+desktop computer in my dorm room before I deployed it to Alpaca (my MIT virtual
+machine). There was much frustration before I got the VirtualHost configuration
+in Apache set up correctly to allow access to the static files for my blog, but
+it all could be chalked up to me just being generally unfamiliar with Apache.
+
+So that is the majority of the work that went into making this blog a reality.
+Again, this is something I've created that I haven't had the chance to test
+extensively on a large scale, so there may be bugs here and there that you
+might notice. Do me a big favor and report them to me so I can make sure my
+blog is running as smoothly as possible.
+
+Also, I welcome constructive criticism, so comment if you have any thoughts or
+suggestions about my writing or the site in general. Also, I just want people
+using the commenting feature so I can make sure it's really working :P
+
+I hope you all enjoyed the first post ever on my blog.
+
+EDIT: View the code for this project at
+[GitHub](https://github.com/thallada/personalsite).
+
+EDIT: I have since moved the site from SIPB's XVM service to SIPB's (hopefully
+more reliable) [scripts service](http://scripts.mit.edu). <a
+href="http://scripts.mit.edu/"><img alt="powered by scripts.mit.edu"
+src="http://scripts.mit.edu/media/powered_by.gif" /></a>
+
+EDIT: This post is now referring to an old version of my website. I have since
+re-wrote my website and moved away from Django.

_posts/2013-04-02-blog-or-not-blog.md

@@ -7,7 +7,7 @@ layout: post
 The original intention of this blog was to serve as a place where I could
 showcase the programming work I have done and detail my process. However, as
 you can tell, there hasn't been any posts since my first ["Hello,
-World!"](/blog/hello-world/) post. Sure, I've been working on projects, but I
+World!"](/2012/12/03/hello-world) post. Sure, I've been working on projects, but I
 just haven't gotten to the point in any of those projects where I felt like I
 could blog in detail about it.
 

_posts/2013-04-09-visualizing-laundry-usage.md

@@ -34,7 +34,7 @@ George Mason's campus. All of the data is scraped from the eSuds site using
 every time you refresh the page.
 
 <div style="text-align: center"><a href="/laundry" alt="See it in action"><img
-src="/static/img/laundry_preview.png" /></a></div>
+src="/img/blog/laundry_preview.png" /></a></div>
 
 The site will save which laundry room you select so when you come back you will
 immediately see the chart for your laundry room.
@@ -55,7 +55,7 @@ recorded the laundry usage with a [cronjob](http://en.wikipedia.org/wiki/Cron)
 every 15 minutes for an entire week: to get an idea of when there is a high
 probability of open machines.
 
-<embed type="image/svg+xml" src="/static/record.svg">
+<embed type="image/svg+xml" src="/img/blog/record.svg">
 
 This one is a little interactive.
 

_posts/2013-05-19-gmu-bookstore-homepage-concept.md

@@ -15,7 +15,7 @@ quite a bit of effort into it.
 See it here: [swe205.hallada.net](http://swe205.hallada.net)
 <div style="text-align: center">
     <a href="http://swe205.hallada.net" alt="See it in action">
-        <img src="/static/img/gmu_bookstore_preview.jpg">
+        <img src="/img/blog/gmu_bookstore_preview.jpg">
     </a>
 </div>
 <br>

_posts/2013-06-04-w3m-reddit.md

@@ -20,7 +20,7 @@ website: [http://m.reddit.com](http://m.reddit.com), and it looks absolutely
 beautiful in w3m. In fact, I think I prefer it to the normal website in any
 modern browser; there are no distractions, just pure content.
 
-<a href="/static/img/w3m_mobile_reddit.png"><img src="/static/img/w3m_mobile_reddit.png" alt="m.reddit.com rendered in w3m"></a>
+<a href="/img/blog/w3m_mobile_reddit.png"><img src="/img/blog/w3m_mobile_reddit.png" alt="m.reddit.com rendered in w3m"></a>
 
 In order to get cortex to open the mobile version of reddit, I made a bash
 script wrapper around w3m that takes urls and replaces `"http://reddit.com"` and

_posts/2013-08-24-on-chromebooks.md

@@ -27,8 +27,8 @@ Google’s ARM processor Chromebook, I discovered what makes Chromebooks, and
 even ChromeOS, so amazing. **I realized there is no need for anything more than
 Chrome**. Even for a power user like me.
 
-<a href="/static/img/full_chromebook.jpg"><img
-src="/static/img/full_chromebook_thumb.jpg" alt="Samsung Chromebook open on a
+<a href="/img/blog/full_chromebook.jpg"><img
+src="/img/blog/full_chromebook_thumb.jpg" alt="Samsung Chromebook open on a
 porch"></a>
 
 Before long, I had completely abandoned my old heavy [2011 Dell
@@ -65,12 +65,12 @@ need to on a laptop that’s under $300.
 for 2 years and 12 free Gogo passes with the Chromebook, which definitely comes
 in handy.
 
-<div> <a href="/static/img/chromebook_keyboard.jpg"><img
-src="/static/img/chromebook_keyboard_thumb.jpg" alt="Samsung Chromebook
-keyboard up close" style="float: left;"></a> <a
-href="/static/img/chromebook_trackpad.jpg"><img
-src="/static/img/chromebook_trackpad_thumb.jpg" alt="Samsung Chromebook
-trackpad up close" style="float: right;"></a> </div> <br>
+<div> <a href="/img/blog/chromebook_keyboard.jpg"><img
+src="/img/blog/chromebook_keyboard_thumb.jpg" alt="Samsung Chromebook
+keyboard up close" style="float: left; width: 50%"></a> <a
+href="/img/blog/chromebook_trackpad.jpg"><img
+src="/img/blog/chromebook_trackpad_thumb.jpg" alt="Samsung Chromebook
+trackpad up close" style="float: right; width: 50%"></a> </div> <br>
 
 While that all of that is nice, the Chromebook still only has 16GB internal
 storage, no DVD drive, no ethernet port, and hardly any processing power. And I
@@ -98,8 +98,8 @@ that channel and enable “Immersive Mode” in `chrome://flags` to get it looki
 like I have in the screenshot ([more
 info](http://gigaom.com/2013/08/22/chrome-os-users-gain-immersive-mode-and-more-in-stable-channel-update/))
 
-<a href="/static/img/fullscreen_gdocs.png"><img
-src="/static/img/fullscreen_gdocs_thumb.png" alt="Demonstrating Google Docs in
+<a href="/img/blog/fullscreen_gdocs.png"><img
+src="/img/blog/fullscreen_gdocs_thumb.png" alt="Demonstrating Google Docs in
 fullscreen immersive mode"></a>
 
 Another little-known feature of Google Docs is creating a new document based
@@ -163,8 +163,8 @@ fullscreen in some other chrome window, I can quickly click the panel’s icon
 and the window will pop open above all of the other windows. I can then
 interact with it and minimize it back into the dock out of my way.
 
-<a href="/static/img/chrome_panel.png"><img
-src="/static/img/chrome_panel_thumb.png" alt="Demonstrating chrome panels with
+<a href="/img/blog/chrome_panel.png"><img
+src="/img/blog/chrome_panel_thumb.png" alt="Demonstrating chrome panels with
 Panel View for Play Music open"></a>
 
 In order to enable them I had to be on the Beta channel of the ChromeOS and
@@ -177,8 +177,7 @@ me:
 
 * [Panel View for Play
 Music](https://chrome.google.com/webstore/detail/panel-view-for-play-music/dimpomefjdddhjmkjgjdokhidjkcmhhn)
-*
-[Hangouts](https://chrome.google.com/webstore/detail/hangouts/nckgahadagoaajjgafhacjanaoiihapd)
+* [Hangouts](https://chrome.google.com/webstore/detail/hangouts/nckgahadagoaajjgafhacjanaoiihapd)
 * [Panel View for Google
 Keep](https://chrome.google.com/webstore/detail/panel-view-for-keep/jccocffecajimkdjgfpjhlpiimcnadhb)
 * [Google Tasks

css/main.css

@@ -24,11 +24,6 @@ body {
   color: #444;
 }
 
-strong {
-  font-weight: 400;
-  color: FireBrick;
-}
-
 h2 {
   font-weight: 300;
 }