Creating Base64 Encoded String from an Image in Node.js

Standard

I’ve been writing a lot of MEAN (MongoDb, Express, AngularJS and Express) code lately and the latest in the series of hurdles I’ve been able to cross of recent has been generating the Base64 encoded version of an image file.

I had just added a new endpoint to an API I was working on and it included photos of users. For the web app, I was happy to just get the url of the photo and have the browser request it when needed but the API consumers (Android and iOS mobile devs) thought differently. The wanted to have the image as a base64 encoded string and so I reached out to Google.

Using this StackOverflow question and answer as my base, this is the function I eventually arrived at:

It should be noted that there are a few differences between my solution and that on StackOverflow.

  • First, I’ve created a function which expects a callback.
  • Secondly, line 6 makes use of  http.request  instead of  http.createClient  and  client.request . This is because  http.createClient  has been deprecated in my version of Express (4.0.0)

Disabling Automatic App Updates in OSX Yosemite

Standard

It’s been a while since I blogged and I’m happy to be back here. I’ve been composing the start of my “next post” for a couple of weeks now but I never thought it would be something as trivial as this. Ever since I got my Macbook, I’ve not been able to get my internet modem to work (I need to go to the nearest support centre for my Service provider, soon) and so I’ve been using the data on my LG smartphone.

I’m a pretty heavy data user (about 25gb a month in bandwidth consumption) and so I wasn’t surprised that I had to resubscribe my 2GB mobile data plan a few times over during the month of June.

Yesterday, however, something surprising (at the time) happened. I got a text from my network carrier that I had 200MB of data left. My macbook was connected to my phone’s hotspot but I was doing nothing on the internet, I was just going through some code trying to catch a bug. Less than 5 minutes after the first SMS, I got three more telling me I had 100MB then 10MB left and the last one told me I’d exhausted the data available on my plan.

At first, I thought the carrier must be nuts, but lo and behold, I noticed that my Launchpad icon had a bar underneath it that was about half full and then it hit me! The OS was installing updates behind my back (or in this case, right under my nose).

I opened up app store and went to the updates page and sure enough, I saw there there were updates available for the OS, XCode, iMovie and Parallels. XCode and iMovie had downloaded almost a third of the available size (about 600MB each). That’s when I realised that I had to turn off automatic updates.

Long story short, I followed advice provided here and in case it’s no longer available, I’ve taken the liberty of posting it here too.

It’s for OS X Mavericks but it worked for me too.

To change the App Store’s settings, head to System Preferences > App Store. Here, you’ll see a number of app-related options.

20131023_disableautoappupdates

While many users will still want the App Store to automatically check for new updates, and perhaps even download them in the background, users who want to determine when these updates are installed will want to uncheck the box next to “Install app updates.”

For users who want to keep automatic updates enabled, the Mac App Store features a new list that shows all updates installed in the last 30 days. Along with its iOS 7 companion, this list is the easiest way to keep track of which apps are getting updated on your Mac. Even if you disable automatic app updates, this list will remain in place, providing a handy history of your recent updates.

Configuring Apache Virtual Hosts on OSX Yosemite

Standard

Having recently made the switch to OSX, I had some difficulties accessing my projects (which I created using my Windows PC). My dev workspace is on my Dropbox, so having them on the Mac was no problem. I’d tried to setup Apache (which came installed with OSX Yosemite) but came unstuck so I ditched the process.

Then I stumbled on this post that showed me how to configure Virtual Hosts using XAMPP on OSX. Long story short, it saved my life! Literally. And so I don’t forget how to do this, and also for others out there, making the transition (however temporal) from Windows to OSX, I’ve reblogged about 95% of the post

Enable VirtualHosts

The first thing you’ll need to do is open the file /Applications/XAMPP/xamppfiles/etc/httpd.conf  in your favourite text editor. Look for the following lines:

Uncomment the second line by removing the hash (#), so that Apache loads your custom VirtualHosts configuration file:

Create your VirtualHosts

Open the file /Applications/XAMPP/xamppfiles/etc/extra/httpd-vhosts.conf . Towards the bottom of the file you will see some example VirtualHosts, which you should comment out or delete.

At the bottom of the file, add ‘localhost’ as the default named VirtualHost:

This step is necessary to ensure that http://localhost still points at XAMPP’s htdocs  directory once we’ve created our custom VirtualHosts. Personally I don’t use the htdocs directory a lot, but occasionally it’s useful to have somewhere to perform quick tests.

Now you are ready to create your own VirtualHosts. After the default localhost that you just created, add:

In the above example you should replace “mysite.local” with your own hostname. This can be anything you wish, but make sure you choose a hostname that won’t conflict with a real domain name. Using a .local extension makes it obvious that the site is hosted locally rather than on a public web server.

The path to your website can point at any folder in your OS X user directory. I store most of my sites inside of Dropbox so that I can access them on both my home and work machines. If your path includes spaces, make sure you enclose it in quotes, like in my example.

Edit your hosts file

Once you’ve saved your httpd.conf  and httpd-vhosts.conf  files, the next step is to edit your OS X hosts file so it knows how to handle your new ServerName. The hosts file is used by OS X to map hostnames to IP addresses. In this case we want to map your new ServerName to the IP address 127.0.0.1, which is your localhost.

Fire up a Terminal instance, and at the prompt type the following command:

Enter your OS X password when prompted, and the hosts file will be opened in the nano text editor. You’ll see that the hosts file already contains some default hostname mappings (e.g. “127.0.0.1 localhost”). Use your keyboard’s arrow keys to navigate to the bottom of the file and add your own mapping:

Save the host file using the key combo control+o, and pressing return when prompted to choose the filename. Close the file using control+x.

Restart Apache

So that your changes take effect, restart Apache. This can be done using XAMPP Control, which is found at /Applications/XAMPP/XAMPP Control.app .

Point your browser at http://mysite.local (or whatever ServerName you chose) and you should see your website. However, there’s a chance that instead you’ll be faced with a…

403 error

Because Apache runs as the ‘nobody’ user by default, it may not have adequate permission to browse your OS X user directory or some of its subdirectories, in which case you’ll see a 403 ‘access forbidden’ error when you try and view your development site. Similarly, you may find that although you can view your dev site, PHP throws errors when you attempt to write files or make directories on the filesystem.

To fix this you can configure Apache to run as your OS X user. Open /Applications/XAMPP/xamppfiles/etc/httpd.conf  and look for the following lines:

Change User to your OS X username, and save the file:

Restart Apache and you should now be able to navigate your site without any issues, including manipulating files and folders using PHP.

If you have problems viewing the XAMPP splash pages at http://localhost  now that Apache is running as your user (e.g. nothing happens when you try to set the language), then you’ll need to give your user read/write privileges on the file /Applications/XAMPP/xamppfiles/htdocs/xampp/lang.tmp .

Making the change I’ve described above carries certain security risks, and if you choose to run Apache as your OS X user then you’ll need to be quite certain that XAMPP is not accessible from outside your local network. From what I understand, XAMPP’s built in security features ensure that this is the case out-of-the-box, and it is straightforward to beef up security for additional piece of mind.

If you’re not convinced that it’s safe to let Apache run as your OS X user, another option is to change the permissions of your dev directories so that the ‘nobody’ or ‘_www’ user can read/write to them.I suspect that I would quickly tire of setting folder permissions, which is why I have opted to take the path of least resistance!

Installing SASS and Using SCSS Watcher for PHPStorm on OSX Yosemite

Standard

My OSX adventure continued today. I’d had no problems installing PHPStorm on my MacBook Air and after I installed Dropbox, all of my applications (hosted on Dropbox and created on a Windows machine) became available on my Mac.

I cloned a working project (Node.js and AngularJS) and wanted to modify it for a proof of concept application. The problem came when I had to modify the .scss  files in the project and have them watched so that they are recompiled whenever a change is made to any of them. PHPStorm’s SASS file watcher had worked brilliantly in my Windows environment but because I cloned an existing project, the settings for that project were also transferred to the new project (including the windows based file watchers).

Frustrated, I shutdown the laptop until I disembarked from the plane and fired it up again after two hours of waiting for my connecting flight. I scoured the web for a solution and while this question pointed me in the right way, my problem wasn’t solved.

I installed sass as the instructions on the website indicated but when I tried to test my installation using sass -v  , I got this error:

 Here’s how I solved the problem. Just two quick steps:

  • Install Rails. I did this using:  sudo gem install rails
  • Re-install Sass, using  sudo gem install sass

When I re-ran  sass -v , the output was correct.

I then restarted PHPStorm and tried to configure the SCSS File watcher and it worked like a breeze.

How to install MySQL and add it as a service on OSX Yosemite

Standard

As I mentioned in a previous post, I’ve just received a new Macbook Air and I continued setting up my development environment. After setting up Apache, I moved on to MySQL and I was a little bit disoriented.

This guide is a note to my future self on how I did it and also to others out there who may be on the verge of getting lost (or worse, frustrated).

I downloaded MySQL Server 5.6 (Community Version) from the MySQL website ( I needed to sign in with my Oracle ID ). After downloading, I ran the installer and MySQL was installed. The README suggests creating aliases for mysql  and mysqladmin . However there are other commands that are helpful such as mysqldump . Instead, I updated my path to include  /usr/local/mysql/bin

You will need to open a new Terminal  window or run the command above for your path to update.

You can start the server and confirm that your MySQL installation is working fine by running this:

But that’s not how you want to setup your database server, is it? Having to start and restart manually anytime you need the database server. You’d want to install it as a service that starts and stops when you startup and shutdown your Macbook.

To install as a service, you can follow this link. In case the information is no longer available, I’ve copied the information below:

OS X uses launch daemons to automatically start, stop, and manage processes and applications such as MySQL. Using launch daemons is recommended over startup items on OS X.

Note

OS X 10.4 deprecated startup items in favour of launchd daemons, and as of OS X 10.10 (Yosemite), startup items do not function. For these reasons, using launchd daemons is preferred over startup items.

Here is an example launchd file that starts MySQL:

Adjust the ProgramArguments array according to your system, as for example your path to mysqld  might be different. After making the proper adjustments, do the following:

  • Save the XML as a file named  /Library/LaunchDaemons/com.mysql.mysql.plist
  • Adjust the file permissions using the Apple recommended owner “root”, owning group “wheel”, and file permissions “644”
  • Enable this new MySQL service

The MySQL daemon is now running, and automatically starts when your system is rebooted.

This is the post that led me on the path to this solution.

How to open hidden folders on OSX finder

Standard

I got a new Macbook Air today and I’ve been setting it up as a development workstation. It’s pretty interesting stuff but also a bit frustrating. I was trying to setup Apache, MySql and PHP but I had issues opening files and folders that are hidden by default on OSX finder.

Luckily for me, I asked Google and I got help.

To open hidden folders such as /etc/apache2 in the Mac OS X Finder, do one of the following:

  • Press Shift + Cmd + G  and type  /etc/apache2
  • Open a Terminal window and type  open /etc/apache2

If you use your Mac as a development machine or just like tinkering around under the hood, you have no doubt been exposed to the folders that are normally hidden from view in the Finder. There are hacks that make the Finder show hidden files and folders, but if you want to keep your Finder windows clutter-free this is a nice way of accessing hidden folders when you need them.

Backup Stored Procedures only on MySQL

Standard

I’ve needed to do this a few times in the past and I still needed to do it again yesterday. Hence, I decided to put it here for reference processes.

 This would export just the stored procedures to the specified file ( sp.sql )