{"52b540591c80ab6e439e6107":{"_id":{"$id":"52b540591c80ab6e439e6107"},"blurb":"Did you know that localStorage works as far back as Internet Explorer 8? There's no good reason to not be using it! Let's start out by saving a very simple piece of information to local storage","content":"

Did you know that localStorage works as far back as Internet Explorer 8? There's no good reason to not be using it!<\/strong><\/p>

The Basics<\/h3>

Let's start out by saving a very simple piece of information to local storage, like so:<\/p>

localStorage.setItem('name', 'Jacques');<\/code><\/p>

Then to retrieve it just do this:<\/p>

localStorage.getItem('name');<\/code><\/p>

Beautiful. Simple. Easy.<\/p>

The Next Level<\/h3>

Okay, so you've just saved and retrieved a single piece of information. Let's see what else we can do.<\/p>

You should know that localStorage is only capable of saving strings. Numbers get converted into strings and objects will save as the string, \"[object Object]\".<\/p>

But, we can use the JSON.stringify()<\/code> function to turn an object into a string, which can then be saved to localStorage.<\/p>

localStorage.setItem('user', JSON.stringify({name: 'Jacques', age: 25, occupation: 'Web Developer'}));<\/code><\/p>

If you do localStorage.getItem('user');<\/code> right now, it will return the stringified object:<\/p>

\"{\"name\":\"Jacques\",\"age\":25,\"occupation\":\"Web Developer\"}\"<\/code><\/p>

This isn't quite what we want, so we'll use the JSON.parse()<\/code> function to convert it back into an object:<\/p>

JSON.parse(localStorage.getItem('user'));<\/code><\/p>

Now you've received your object back in a usable form!<\/p>

Clearing the Storage<\/h3>

When the browser's cache is cleared, all localStorage is erased.<\/p>

To manually erase all localStorage do this:<\/p>

localStorage.clear();<\/code><\/p>

To erase a specific localStorage item, do this:<\/p>

localStorage.removeItem('item_key_here');<\/code><\/p>

Max Storage Size<\/h3>

There is a maximum size for the information saved to localStorage. In Google Chrome it's\u00a02.5 MB<\/strong> per origin, in Mozilla Firefox and Opera it's 5 MB<\/b>\u00a0per origin and in Internet Explorer it's\u00a010 MB<\/strong>\u00a0per origin. \u2018Per origin' meaning per domain (www.yoursite.com) on a single visitor's browser.<\/p>

I hope you found this useful. Local storage is a great alternative to cookies and the browser support for it is great, which means you can start using it in real projects right now!<\/p>","date_created":"1387608213","published":true,"slug":"an-introduction-to-html5-localstorage","tags":"html5, localstorage, javascript, tutorial","title":"An Introduction to HTML5's localStorage"},"51b6afa01c80ab77060a594c":{"_id":{"$id":"51b6afa01c80ab77060a594c"},"blurb":"Getting MongoDB working with PHP and MAMP was a bit tricky for me, so hopefully this guide will save you some frustration. At the end of this tutorial I've included a section","content":"

Getting MongoDB working with PHP and MAMP was a bit tricky for me, so hopefully this guide will save you some frustration.<\/p>\r\n\r\n

At the end of this tutorial I've included a section with a few possible issues you might run into and their solutions.<\/p>\r\n\r\n

This tutorial assumes you already have MAMP running on your Mac. Also, you may need to preface some commands with sudo<\/strong> to get them to run.<\/p>\r\n\r\n

1) Install Homebrew<\/h3>\r\n\r\n

You're going to need a package manager. I recommend Homebrew:<\/p>\r\n\r\n

\r\n\truby -e \"$(curl -fsSL https:\/\/raw.github.com\/mxcl\/homebrew\/go)\"<\/code>\r\n<\/p>\r\n\r\n

2) Install MongoDB<\/h3>\r\n\r\n

First you must add \/usr\/local\/bin<\/strong> to the beginning of the $PATH<\/strong> in Terminal (learn more about this here<\/a>):<\/p>\r\n\r\n

\r\n\texport PATH=\/usr\/local\/bin:$PATH<\/code>\r\n<\/p>\r\n\r\n

Then install Mongo:<\/p>\r\n\r\n

\r\n\tbrew install mongodb<\/code>\r\n<\/p>\r\n\r\n

3) Install the PHP MongoDB driver<\/h3>\r\n\r\n

First, add MAMP's \/bin<\/strong> directory to the beginning of the $PATH<\/strong>, obviously replacing php5.x.x<\/em> with your version of PHP:<\/p>\r\n\r\n

\r\n\texport PATH=\/Applications\/MAMP\/bin\/php\/php5.x.x\/bin:$PATH<\/code>\r\n<\/p>\r\n\r\n

Then go into that directory:<\/p>\r\n\r\n

\r\n\tcd \/Applications\/MAMP\/bin\/php\/php5.x.x\/bin<\/code>\r\n<\/p>\r\n\r\n

Now that you're here, you can use Pear to install the PHP MongoDB driver (see the bottom of this post if you get the \u2018make\u2019 failed<\/strong> error):<\/p>\r\n\r\n

\r\n\tsudo pecl install mongo<\/code>\r\n<\/p>\r\n\r\n

4) Edit php.ini<\/h3>\r\n\r\n

Add extension=mongo.so<\/code> to your \/Applications\/MAMP\/bin\/php\/php5.x.x\/conf\/php.ini<\/strong> file.<\/p>\r\n\r\n

5) Restart MAMP<\/h3>\r\n\r\n

This is a simple one. Just stop and then restart MAMP from via the MAMP interface.<\/p>\r\n\r\n

6) Start MongoDB<\/h3>\r\n\r\n

In Terminal enter mongod<\/code> to start Mongo. You can access the Mongo shell by entering mongo<\/code> into a new Terminal window.<\/p>\r\n\r\n

7) Test PHP script<\/h3>\r\n\r\n

Now that everything is installed, create a PHP script with the following code in it and test it in the browser:<\/p>\r\n\r\n

\r\n\t

\r\n<?php\r\n\r\n\t\/\/ Show PHP errors (during development only)\r\n\terror_reporting(E_ALL | E_STRICT);\r\n\tini_set(\"display_errors\", 2);\r\n\r\n\t\/\/ Create a Mongo conenction\r\n\t$mongo = new Mongo(\"mongodb:\/\/localhost\");\r\n\r\n\t\/\/ Choose the database and collection\r\n\t$db = $mongo->my_db_name;\r\n\t$coll = $db->my_collection_name;\r\n\r\n\t\/\/ Same a document to the collection\r\n\t$coll->save(array(\r\n\t\t\"name\" => \"Jack Sparrow\",\r\n\t\t\"age\" => 34,\r\n\t\t\"occupation\" => \"Pirate\"\r\n\t));\r\n\r\n\t\/\/ Retrieve the document and display it\r\n\t$item = $coll->findOne();\r\n\r\n\techo \"My name is \" . $item['name'] . \"<\/strong>. I am \" . $item['age'] . \"<\/strong> years old and work full-time as a \" . $item['occupation'] . \"<\/strong>.\";\r\n\t<\/code><\/pre>\r\n<\/p>\r\n\r\n

If you see the database record outputted and there aren't any errors then you've successfully set up MongoDB with PHP and MAMP!<\/strong><\/p>\r\n\r\n


\r\n\r\n

Fixing the 'make' failed<\/em> error<\/h3>\r\n\r\n

You may have gotten this error when trying to install the PHP MongoDB driver. Here are a few possible causes and their solutions:<\/p>\r\n\r\n\r\n

1) Xcode is missing Command Line Tools<\/h4>\r\n\r\n

If you don't have Xcode installed then go ahead and install it. Open it and go to Preferences > Downloads<\/strong>. Install the Command Line Tools<\/strong> and then try the install again:<\/p>\r\n\r\n

\r\n\tsudo pecl install mongo<\/code>\r\n<\/p>\r\n\r\n

If the install now works then go to Step 4 to proceed.<\/p>

2) MAMP is missing certain PHP files<\/h4>\r\n\r\n

MAMP doesn't come installed with all of PHP's extra extensions and modules, some of which we may need. To get these files, go to http:\/\/www.php.net\/downloads.php<\/a> and download PHP.<\/p>\r\n\r\n

Once you've decompressed the archive, copy all of the files into \/Applications\/MAMP\/bin\/php\/php5.x.x\/include\/php<\/strong> (create the \/include<\/strong> and \/php<\/strong> directories if they don't exist).<\/p>\r\n\r\n

Now navigate to that directory in Terminal and run the configuration:<\/p>\r\n\r\n

\r\n\tcd \/Applications\/MAMP\/bin\/php\/php5.x.x\/include\/php<\/code>\r\n\t

\r\n\t.\/configure<\/code>\r\n<\/p>\r\n\r\n

Once that finishes, try the install again:<\/p>\r\n\r\n

\r\n\tsudo pecl install mongo<\/code>\r\n<\/p>\r\n\r\n

If the install now works then go to Step 4 to proceed.<\/p>\r\n\r\n\r\n","date_created":"1371122833","published":true,"slug":"setting-up-mongodb-with-php-and-mamp","tags":"mongo, mongodb, php, mamp, mac, osx, tutorial, web development","title":"Setting Up MongoDB with PHP and MAMP"},"51aff55b1c80abcb6105f137":{"_id":{"$id":"51aff55b1c80abcb6105f137"},"blurb":"Though I could have chosen to use any number of great open source blog platforms out there, I decided to build my own minimilistic one. I wanted an excuse to get myself familiar","content":"

Though I could have chosen to use any number of great open source blog platforms out there, I decided to build my own minimilistic one. I wanted an excuse to get myself familiar with MongoDB, so I made this my first Mongo project.<\/p>

For me, the trickiest part was getting the Mongo PHP driver to work on my local machine. I feel this would have been much easier if I was better with the command line - something I've been working on a lot lately. I finally understand $PATH<\/code> and how to utilize it. Hell yeah.<\/p>

Getting Mongo and the Mongo PHP driver running on an Amazon EC2 instance and getting my whole site moved over to that instance was surprisingly the easiest part. This is when I fell in love with Amazon. No more crappy, restrictive shared hosting and cPanel for this guy!<\/p>

Overall I learned a lot from this whole experience. I learned about Mongo, I became better with the command line and I learned how to create\/configure Amazon EC2 instances. I'll probably write a post as a guide through this whole process sometime soon.<\/p>

Lastly, to whoever is reading this: What type of posts would you like to see from me? Tutorials on certain topics? Something else? Let me know.<\/p>","date_created":1370486093,"published":true,"slug":"custom-php-and-mongodb-blog","tags":"custom blog, php, mongo, mongodb, blog, web development","title":"Custom PHP and MongoDB Blog"}}