4MK Apps Blog

One of the absolute best parts of working in todays web development world is the choices you’re now afforded. Long gone are the days where your choice of technology in one aspect of a project would dictate the entire stack. Want to use your Mac Book Pro? Go for it. Want to use javascript on the server, as well as the client? node.js has your back. Looking for a cloud provider to host your project while your business grows? You can be up and running on Azure in less time than it takes to brew a good cup of coffee.

For a recent project I was working on these are the tools that worked best for what we were looking to accomplish. In the next few blog posts, I’ll detail how I set up my dev environment to accomplish these tasks. The first post takes us from scratch to a default express.js installation running on an Azure Web site.

Prerequisites

Before going through this, I’m going to assume a few things.

You’ve already installed Node and NPM on your Mac

You’ve already installed Express.js via NPM

You’ve already signed up for a free trial Azure account

Once you’ve got these ready, your good to go.

Connecting to Azure from the command line

There are two ways to set things up in Azure, the web, and the command line. Since I try and spend more time in Terminal than a web browser (less distractions :) ) I tend towards using the command line. Microsoft has made this relatively painless with the Azure CLI NPM package. To install it, just run the command:

npm install azure-cli -g

Once that installs, you have a very nice and useful set of commands to interact with your azure account. To start, you’ll need to get your publish profile by issuing the following command:

azure account download

Which will open your browser and have you log into your account to download the profile. Once you log in, it will download and then you can start using it by running:

azure account import [path to where you downloaded the file]

Now your ready to go :)

Creating your new Azure web site

Now that you can interact with Azure, let’s actually do something. To create your a new azure web site run the command:

azure site create [new site name] —git

This will create you a new azure web site, and also set it up for git development while also setting up the current directory to be a git repo with the azure remote entry already added.

Creating the default express.js web site

Creating a new express site is down the same way as it always is, running the command:

express

After it runs, you can make sure it runs locally by running:

npm install

And launching node:

node app.js

After ensuring that it is running locally, by pointing your browser at http://localhost:3000 you are ready to push your creation to the cloud. To do this, all you have to do is commit it to your local git repo

git add . git commit -m “initial checkin”

And then push it to the azure remote repo:

git push azure master

And that’s it, you’re live in the cloud! To show your new site in the browser, you can use the CLI shortcut

azure site browse

Conclusion

With Shipping Calculator Adder (SCA) out the door, and performing much better than expected, and with our next App about to go into beta, I figured it's a good time to talk about how we see ourselves in terms of members of the Shopify App Store...

Do unto others...

One of the biggest things we push internally at 4MK Apps is to do business in the way that we want others to do business with us.  

How this relates to SCA for example, is we refuse to take potential customers money, if we're don't provide them any value.  Approximately 12% of store owners who click the install button on our App, prepared to drop some of their hard earned money, already have the calculator installed.  I unfortunately know of a couple companies (don't worry none who have Shopify Apps :) ) who would gladly see this as free money and send the "customer" on their way.  Personally I think that attitude is crap, and would never want to do business with anyone who thought differently.

Proactive Support

Another thing that we've been doing is actively reaching out to customers to make sure they are happy with SCA and fixing any problems they might have with it.  

Normally within 24 hours, our customers receive an email from me asking how things wen't and if they had any problems or suggestions.  If you have an app in the store and think you shouldn't be doing this, I'd love to hear why.

No such thing as "Not my problem"

Do to the nature of this app (it really just installs the calculator created by Shopify), this can lead to some interesting problems where the issue lies outside of our realm.  

Once such issue came up where there was a small bug in the code the calculator uses. Rather than state that it wasn't our problem, we fixed the bug and sent a message to those who are maintaining it on how to fix the problem.

We're extremely happy to announce that Shipping Calculator Adder is now live in the market place here

We'd like to take a moment to thank all of our Beta Testers as well as the Shopify Staff for helping us make SCA the product it is today.  If you'd like to sign up to be a Beta tester for some of our upcoming products, simply sign up for our newsletter at the bottom of our home page

As some of our beta testers know, the banner image that we are using has been updated to the following:

Our first Shopify Application is just about live in the App Store.  

Shipping Calculator Adder (SCA) is a tiny utility application that is intended to save new shops an hour or two, by automating the addition of the shipping calculator to your stores shopping cart page.

Rather than having to manually go through this process, you can simply click a button and have us do it for you.  At the end of the process, you simply add the snippet to your cart page where you want the calculator to show up, and your all set.

The reason that we wrote this application was to get our feet wet with Shopify development as well as building Shopify Apps using Node.js.