How to display a PDF in React Native

As I move up the learning curve on React Native, I thought it would helpful to share a few tips and tricks I’ve learned.  One of the more challenging things I’ve come across was how to show a PDF file in your app. I couldn’t find any tutorial to demonstrate how to do this across both iOS and Android, so I thought I would write my own:


This one is fairly easy. The WebView in iOS has native support for PDF rendering. It’s just a matter of tell it where to find your PDF:

render: function() {
  return <WebView source={{uri: 'Your.pdf'}}/>

The one trick part is that you need to include Your.pdf into your project in Xcode and make sure it’s added to your build target.

Just copying it into your React Native project folder isn’t enough. It has to be part of the Xcode project itself.


This one took a bit more work to figure out.

It appears that Android did not provide a native PDF viewer until version 5.0 (Lollipop). To provide a solution with broader support for older Android devices, you will need to make use of three key techniques:

  1. Pull the PDF out of my APK bundle and store it in the files folder for your app. This Stack Overflow answer was very helpful in accomplishing this:

Android: How to copy files from ‘assets’ folder to sdcard?

I tweaked the code a bit so that the file wasn’t going to an sdcard but to your app’s files folder. Here’s what to add to your file:

protected void onCreate(Bundle savedInstanceState) {

  AssetManager assetManager = getAssets();
  String[] files = null;

  try {
      files = assetManager.list("pdf");
  } catch (IOException e) {
      Log.e("tag", "Failed to get asset file list.", e);

  if (files != null) for (String filename : files) {
      InputStream in = null;
      OutputStream out = null;

      try {
        in ="pdf/" + filename);

        File outFile = new File(getFilesDir(), filename);
        out = new FileOutputStream(outFile);
        copyFile(in, out);
        Log.e("tag", "Copy was a success: " + outFile.getPath());
      } catch(IOException e) {
        Log.e("tag", "Failed to copy asset file: " + "pdf/" + filename, e);
      finally {
          if (in != null) {
              try {
              } catch (IOException e) {
                  // NOOP
          if (out != null) {
              try {
              } catch (IOException e) {
                  // NOOP

private void copyFile(InputStream in, OutputStream out) throws IOException {
    byte[] buffer = new byte[1024];
    int read;
    while((read = != -1){
      out.write(buffer, 0, read);

Make sure to place your PDF file in the assets/pdf folder under android/app/src/main

  1. Next you’ll be using the react-native-fs package to get the absolute URL to your PDF, which is now in the files folder:
    var RNFS = require('react-native-fs');
    var absolutePath = RNFS.DocumentDirectoryPath + '/Your.pdf';
  2. With all of this in place, use react-native-pdf-view to actually load and display the PDF:
    import PDFView from 'react-native-pdf-view';
    render: function() {
      var absolutePath = RNFS.DocumentDirectoryPath + '/Your.pdf';
      return <PDFView
        ref={(pdf)=>{this.pdfView = pdf;}}
        style={ActharStyles.fullCover} />

Not exactly dirt simple, but it works well enough.

So there you go!  You can now display a PDF file in your React Native project on either iOS or Android. FYI, I also wrote this up as an answer to my own Stack Overflow question. If you have suggestions for how to improve the technique, you may want to post them there.

How To Name Your Git Remotes

Here’s a quick tip for how to give your Git remotes a more meaningful name.

Personally, I don’t like how every remote defaults to origin.  What does that mean?  Did this code from from Beanstalk?  GitHub?  GitStack?  Who knows?

We can do better.

To assign a meaningful name to the remote when you clone a repository, simply use the -o parameter, followed by the name you wish to use.  For example:

git clone -o beanstalk


git clone -o github

To use these fancy new remotes, you can say…

git push beanstalk master


git push github mybranch

Easy as pie.  Mmmmm… pie…

Search Engine Optimization Made Easy

Search engine optimization can be the difference between ecommerce businesses that thrive, and those that don’t.  Optimizing product pages for search engines is especially important.

Every web site owner wants to know the secret to reaching the top of the search rankings.  Sadly, there is no magic elixir that can guarantee you a first page result on Google or Bing.  As with all good things in life, you have to earn it.

The eight recommendations Pablo outlines are the tried and true techniques that search professionals have been preaching for years.

  • Create great content
  • Build your site properly
  • Get your customers involved

Do these eight things, and you will certainly help improve your search rankings.

Selecting outbound links with jQuery

Maps on Kindle has a great article about using jQuery to select all outbound links on your web site.  In a nutshell, it creates a new selector by comparing the url of the link to the domain of the current web page.  That allows you to do things like this:

$('a:external').css('color', '#F00');

Pretty cool, right?

Unfortunately, there was a small oversight in their code, which I hope to rectify here.

In the original source, the code didn’t account for the www problem.  If the visitor is looking [with the www.], and a link on the page points to [without the www.], the script will consider it an outbound link.

To fix this, I’ve added a small tweak:

 $.expr[':'].external = function(obj){    return !obj.href.match(/^mailto:/) &&       (obj.hostname.replace(/^www./i, '') != document.location.hostname.replace(/^www./i, '')); };

Just add this to your JavaScript inside the $(document).ready(...) and you’re all set.


3 Things To Check Before You Release Your App To The iTunes App Store

Months of planning, coding, dreaming, testing, screaming, and you’re finally ready to release your iPhone app to the world.

Or are you?

Before you hit that final send button, there are a few things you need to check:

  1. Test on actual hardare.  Cardinal Rule #1.  The Simulator is fantastic, but it’s not the real thing, and it never will be.  Unless you test on actual hardware (and as many Model and iOS combinations as possible), you can’t assume it will work for actual customers.
  2. Set your iOS Deployment Target as low as possible.  The fact is that not everyone upgrades as quickly as they should.  You’d be amazed at how many people are still running older versions of the iPhone OS.  If you don’t target the oldest iOS version possible, you limit your potential customer base dramatically.
  3. Keep the app size under 20MB.  This may not apply to all apps, but unless you’ve got a big marketing budget or a “must have” app, it should apply to you.  Any app over 20MB cannot be downloaded via 3G.  It’s WiFi only, which — again — limits your potential customer base dramatically.

I’d venture to guess that most iPhone developers have been bitten by one of these 3 gotchas when they were first starting out.  Learn from our mistakes, and good luck!

Google Apps

This weekend, I converted all of Axeva’s email over to Google Apps.  After years of running our own Exchange Server, the time had come to throw in the towel and move to the cloud.

So what is Google Apps?

In a nutshell, Google Apps is Gmail for your business.  It’s a way to host your corporate email in the cloud without all the mess of running your own servers.  Google provides everything a small business needs: giant 7 Gb email accounts, shared calendars and even basic document collaboration.   The best part?  It’s free.

Google does offer a Premier Edition, which offers a few more services.  For $50 per year, they’ll increase your email storage up to 25 Gb, let you hold video chats and provide 24/7 support.  In reality, however, the Standard Edition is more than enough for most small companies.

As with Gmail, one of the big advantages of Google Apps is that you’ll have full access to your email from the web, your desktop email client of choice (Outlook,, Thunderbird, etc.) and your smart phone.  In other words, your email goes where you go — home, the office, the airport — everywhere.

A Few Tips to Ease the Transition

To their credit, Google makes it very simple to get started with Google Apps.  I had our account setup in a matter of minutes.  Creating your email accounts is dead simple, and you can even create alias accounts that redirect to your main email address.  For example, you could create as your mail email, then create an alias for that dumps the email it receives into your bill@ account.

The difficult part is migrating your existing email over to the new system.  As you might expect, Google makes this fairly simple for their paying customers (those with Premier Edition accounts).  For those of us with Standard Edition accounts, you have to jump through a few hoops.

Google Email Uploader

If your employees are using desktop email programs today, the first thing you should try is the Google Email Uploader utility.  This tool, created by Google, will look at the email on your computer and assist you in sending it to your new Google Apps account.

In my experience, the tool works pretty well if you’re using Outlook on Windows.  On the Mac side, we saw mixed results.  For normal POP or IMAP accounts under, the Google Email Uploader worked like a charm.  When we tried to upload email that was stored on the Exchange server, however, the utility didn’t even recognize the account.  On both Mac and Windows, you’re limited in the size of the upload however.  No individual email can be larger than 16 Mb.  If you’ve got a few messages with large attachments, for example, they won’t be uploaded.

These hiccups aside, I would strongly recommend you use the Google Email Uploader if possible.  When it worked, the tool was fantastic.  It wasn’t lightning fast, but it produced great results.  Your mileage may vary, however.

The Google Email Uploader is available for Mac or PC, and it works with most major email clients.

The Hard Way

If you can’t get the Google Email Uploader to work, there is another trick you can try to migrate that old email.  Nearly all major desktop email clients allow you to configure more than one email address.  They also allow you to drag and drop an email from one account to another.  Simply open your inbox in the old email account, select all the messages, and drag them over to the inbox in your new Google Apps email address.

It’s not pretty, but it works.  No one ever said that it has to be elegant to be effective.

And Away We Go…

We’re about 24 hours in to the brave new world of Google Apps.  I’m sure there will be a few more ups and downs along the way, but right now I’m happy with the results.

If you have questions about Google Apps, or have a few tips of your own about how to get the most out of system, please leave your comments below.  I’d love to hear your thoughts.

UPDATED:  3/2/2010

Joe Kissell has written a fantastic article explaining how to get the best results when using Apple Mail with Google Apps.  I highly recommend that all Mac users read this:

Achieving Email Bliss with IMAP, Gmail, and Apple Mail, by Joe Kissell

How to create unique passwords that you’ll never forget

It’s the dirty little secret that we all share.  We all know that we should have unique passwords for each web site we use.  Your bank.  Your Facebook account.  Your PayPal account.  Each should have a different password, but who can remember them all?

What do we end up doing?  Using the same password everywhere.

Sound familiar?

Here’s a trick to give you have a strong, unique passwords on every web site you visit — and you’ll never forget it.


Step 1:  Start with a word that you can remember.  It could be a band name, a place, an object — anything.  Ideally, it should not be something obvious, like your own name, the name of your wife, etc.  Also, make sure at least one of the letters in the word is Upper Case.

For the purposes of our example, we’ll use a band name — Beatles. This is all we need to remember.


Step 2:  Replace the vowels in your word with numbers or symbols.  A password that includes Numbers and Symbols along with Letters is much more secure, and much harder for someone else to guess.

To make sure it’s still easy to remember our password, we’re going to replace the vowels with numbers and symbols that look similar to the letter they’re replacing:

  • The letter a becomes the symbol @ because it looks like an a.
  • The letter A becomes the number 4 because a four looks like a capital A.
  • The letter i becomes the number 1, because a one looks like an i.
  • The letter e becomes the number 3 because a three looks like a backwards capital E.
  • The letter o becomes 0 (zero)
  • I also tend to replace the letter s with the number 5.  It may not be a vowel, but since the two look so similar, it just seemed to make sense.

Using this method, our original word — Beatles — now becomes B3@tl3s.  Now we have a nice, strong Base Password.


Step 3:  Having a strong password is a great start, but it’s not enough.  What we really need is a strong, unique password for each site.  If someone manages to get a hold of our Facebook password, we don’t want them to be able to get in to our PayPal account, right?

So how do we get a unique password for each site?  We incorporate part of the web site name into the password.

Let’s say, for example, that we need a password for a Yahoo account.  Take the first two letters – y and a, and tack them on to your Base Password.  That gives us yaB3@tl3s.  Bingo!  We have a unique password for Yahoo.

Our password for Google would be goB3@tl3s.

Our Amazon password would be amB3@tl3s.


It’s that easy!

You never need to memorize dozens of passwords, just one small word and a simple method for recreating the password.



Updated: [6-7-2011]

CNet brings us this sobering news:  Cheap GPUs are rendering strong passwords useless

Looks like we need even longer and more complex passwords than most experts believed.  My advice?  Shoot for 15 characters.  Instead of using a short word like “Beatles” as your base word use something longer, such as “Ringo Starr” or “Eric Clapton”.  Be creative — it’s dangerous out there!

Updated: [1-20-2014]

SplashData has issued their annual list of the 25 most common passwords found on the Internet. “Password” unseated by “123456” on SplashData’s annual “Worst Passwords” list

If your go-to password is on this list, you’re in trouble…