There were a few hic-cups. Many of my older pages were not originally written in markdown, but rather using whatever CMS editor I had at the time. Pelican has an import feature, but some things got lost in translation. Any preformated code blocks had to be re-created manually (amusingly enough, copying and pasting from the old web page into vim, then indenting them properly).
The biggest loss is a search engine. A CMS like Wordpress or a hosted solution like Blogger stores your content in a database and provides a search interface to that content. With static pages, not so much. Most of the web gets around this using Google's CSE, which I am trying as well. As of yet, almost nothing appears to be indexing on this page. If this continues, I will setup a stanadlone search engine that simply indexes the pages on this site. (UPDATE: Google has a nice fresh index of the website, covering everything except this page I wrote yesterday.) I'm still researching possibilities on that. Ten years ago, ht://dig was the premier application to use, but development on that seems to have stopped in 2004. Sphider looks like a good product, but again, development stopped in 2007. Small search engine development seems to have dropped off significantly with the rise of Google's popularity.
A copy of the website content and theme can be tracked on github.
This weekend I decided to takle both learning Ruby and working with AWS via the Ruby API. Having only played with both of these in the past, this presents two learning challenges at once. However, from past projects, this is how I learn best. I am somewhat familiar with AWS terms and once made a script in Python to fire up an instance. This was before Amazon came out with their management console, so I imagine things have come a long way since then (hopefully easier). I also played with Ruby for a while, but didn't have a decent project for it. Having a project with goals will hopefully keep me on track and give me a way to measure my progress.
My goals for this project are as follows:
First off, I need to setup a ruby development environment. Since I have used PyCharm in the past, I will try JetBrain's RubyMine for my editor environment. After installing this, the first thing I learned is that rails is not installed. I could install using apt-get, but Jetbrains recommends using RVM. It looks like a nice way to manage different versions of Ruby, rails, and gems. I know when I have installed Ruby applications requiring gems, gem versions was always a source of concern. It is very easy to get mismatched gem versions in the wild.
RVM install locally to \~/.rvm on linux, which is nice - you don't mess up any system wide ruby installations and keep everything local to your development environment. After installation, I had to figure out a couple bits with rvm.
rvm install 1.9.2# installs ruby 1.9.2
rvm list# lists versions of ruby installed
rvm use 1.8.7# use ruby 1.8.7
First, your terminal has to be setup as a login shell. This tripped me up for a while until I changed the settings in my terminal emulator. terminator has this as checkmark option.
ytjohn@freshdesk:~$ rvm list rvm rubies ruby-1.8.7-p371 [ x86_64 ] ruby-1.9.2-p320 [ x86_64 ] # => - current # =* - current && default # * - default ytjohn@freshdesk:~$ rvm use 1.8.7 RVM is not a function, selecting rubies with 'rvm use ...' will not work. You need to change your terminal emulator preferences to allow login shell. Sometimes it is required to use `/bin/bash --login` as the command. Please visit https://rvm.io/integration/gnome-terminal/ for a example.
After switching to login
ytjohn@freshdesk:~$ rvm use 1.8.7 Using /home/ytjohn/.rvm/gems/ruby-1.8.7-p371
Finally, once you get ruby and rails working, you can create your rails project. I'm starting with a rails project because it's "all the rage" and gives you a decent running start. Later, I'll work on switching the supplied templates with boilerplate + bootstrap based ones.
This gets me started. Next up, I'll actually create the project from within RubyMine and just work on basic web functionality.
Yesterday, I ran into a small, but confusing issue converting from markdown to html for a post. A markdown process will convert html in a code block to html escaped entities. That way, when you use the resulting html, your html example code doesn't get interpreted as html.
<p>This is a <strong>strong</strong> example.</p>
Gets converted to:
<pre><code><p>This is a <strong>strong</strong> example.</p> </code></pre>
In the "dingus" I made, this didn't appear to be happening. The above example rendered as:
<pre><code>This is a <strong>strong</strong> example.</p></code></pre>
Furthermore, it worked perfectly fine using the "official" php-markdown dingus. I was using their library, and it's incredibly simple to implement. After some digging, I discovered that in my dingus, the code was being converted properly in my preview section, but not in my HTML Source textarea. I was printing the same
$render variable in both sections, but getting different results in my browser.
As it turns out, most html elements are "CDATA" and a textarea is "PCDATA". When all is said and done, this means that instead of needing to send <, I need to send < to the browser. Fortunately, php has a function called htmlspecialchars() that does this for me. For my HTML Output, I just needed to change
print $render to
Normally, one would take these downloaded files and put them into their own web application directory tree. However, there is a better way. Unless you are planning to use this on an Intranet with limited Internet access, you can use a copy of these files hosted on a "content delivery network (CDN)". A good example of this is the jQuery library hosted on Google's CDN. Google has a number of hosted libraries on their network. This has several advantages, one of which being caching. If everyone is pointing at a common hosted library, that library gets cached on the end-user's machine instead of being reloaded on every site that uses that library.
While bootstrap is not hosted on google, there is another CDN running on CloudFlare called cdnjs that provides a lot of the "less popular" frameworks, including bootstrap. Here are the URLs to the most current version of bootstrap files (they have version 2.0.0 through 2.1.1 currently).
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/css/bootstrap.min.css"> <script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/bootstrap.min.js"> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
Here's an example you can use on your own.
<!DOCTYPE html> <html lang="en"> <body> <div class="container-fluid"> <div class="row-fluid"> <div class="span12 label label-info"> <h1>Header</h1> </div> </div> <div class="row-fluid"> <div class="span2"> left column <i class="icon-arrow-left"></i> </div> <div class="span6"> <p>center column <i class="icon-tasks"></i></p> <div class="hero-unit"> <h1>This is hero unit</h1> <p>It is pretty emphasized</p> </div> <p>still in the center, but not so heroic</p> </div> <div class="span4"> right column <i class="icon-arrow-right"></i> </div> </div> </div><!-- end container --> <!-- load everything at end for fast content loading --> <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/css/bootstrap.min.css"> <script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/bootstrap.min.js"> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> </body> </html>
Finally, I found that NetDNA also hosts bootstrap on their CDN at [www.bootstrapcdn.com]. I would say that either CDN would be fairly reliable, as they are both sponsored by their CDN they are running on. One advantage of this site is that they provide a lot more than just the basic bootstrap hosting such as custom themes and fonts.
To use them, you can simply swap out your css and js scripts.
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/css/bootstrap-combined.min.css" rel="stylesheet"> <script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/js/bootstrap.min.js"></script> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
UPDATE: I added jquery into the above examples because several parts of bootstrap rely on it (such as the Modal dialogs).