Making Your Own 'Shopify' Shop With JavaScript

First of all, you should only consider this is you're either a developer yourself, or are willing to pay a developer (and have a reasonable sense of the cost).

If you don't, easy choice: go with Shopify.

If you do have coding skills, or have the resources to build your own shop, read on. DIY could be the right choice for you.

How To Make A Shopify-Like E-commerce Shop Using JavaScript

There are multiple ways you can do this, but using one of the combinations below would be the fastest.

1. React + Commerce.js: React is a popular JavaScript library for building user interfaces. Commerce.js is a JavaScript-based e-commerce platform that you can integrate with React to build a custom e-commerce site. It provides a wide range of features like product management, cart functionality, and checkout capabilities.

2. Vue.js + Vue Storefront: Vue.js is another JavaScript framework for building user interfaces. Vue Storefront is a headless, PWA (Progressive Web App) storefront for e-commerce that is built with Vue.js. It offers features like catalog browsing, cart management, and checkout.

3. Nuxt.js + Strapi: Nuxt.js is a framework for building server-rendered Vue.js applications. Strapi is a headless CMS (Content Management System) that can be used for managing product data, content, and user accounts. Together, Nuxt.js and Strapi can be used to create a custom e-commerce site with Vue.js on the front end. Strapi even has an article about how to do this on their website.

4. WooCommerce with React or Vue.js: While WooCommerce is primarily associated with WordPress and PHP, you can use JavaScript frameworks like React or Vue.js to build a custom front end that interacts with WooCommerce via its REST API. This allows you to create a more modern and highly customized user interface while still leveraging the power of WooCommerce for e-commerce functionality.

How To Choose Between Shopify & Your Own Site

First, consider the options above, and see how well they work for you. If you can get a 'test shop' running, that would be ideal.

Second, see if it meets your needs, even in a minimal form. If it does, you can proceed.

Beyond that, the choice between Shopify and a JavaScript shop comes down to the tradeoff between trusting someone to do it well (Shopify) vs. doing it all yourself, having your own code.

If you do it yourself, you'll have more control of the final product, and more ability to effortlessly integrate new components.

To be clear, Shopify's website uses JavaScript too, and in that sense is a 'JavaScript shop' also. But the choice we're considering is between a branded website from Shopify, and making your own e-commerce shop yourself, using JavaScript and various integrations.

Shopify

Advantages

For e-commerce, Shopify's fast to set up and gets the job done.

They've clearly thought a lot about how to make it easy for the small business owner. The process is streamlined, fast, and effective.

You choose a theme to customize your shop, and before you know it, your shop is up.

The upside is convenience and trust: you know it's implemented in such a way that your site could get a huge surge, and withstand it.

It may also be what most of the companies in your niche use.

Disadvantages

The biggest downside is cost. If you can manage it, for the same functionality, building your own shop will be cheaper over the long term.

Another downside of Shopify shops is they often look alike. You can pay for a custom theme to mitigate this.

There are also limits on customizability that Shopify's format imposes on you.

If you want to do some kind of advanced UI or integration that people can use to interact with your Shop, and it can't be done in a standard way, that could be a problem on Shopify.

JavaScript Shop

Advantages

You can always do it yourself.

One upside of that is, if you have multiple ideas and you code it yourself, you can copy your template over for each new project and save big bucks, vs. paying for multiple Shopify shops.

This could be a decisive advantage, if you want to experiment with several types of shops.

Another advantage is that, when you control the code, it's much easier to predict the impact your changes will make.

If you can guess that you'll make change after change and many custom components for your site, coding your own could work out better.

Disadvantages

You've got to anticipate everything yourself and maintain it. If you're the developer, it's not enough to know plain HTML and CSS.

You've got to set up the domain name, code the pages, set up the routing, possibly an API too.

Want someone to be able to fill out a form and send it to you? That will require some coding too.

There are freelancers who will do it for a competitive rate, but it'll cost you.

The other downside is you may not be able to pay enough to get good results, and good results are important.

You'll be responsible for doing the necesssary software updates. This can become a problem over a timeline of several years.

I've experienced this myself: revisiting a site I haven't touched in a few years and finding out that a package in it needs to be updated, or removed.

It's not a deal breaker in my opinion, but it's a hassle.

Finally, if something breaks, you've got to fix it. I think this risk is often overstated, but it is there.

A Cost Comparison

In 2023, a typical implementation for a JavaScript shopping site might be a React app, with Stripe as your payment processor.

Shopify costs $39/$105 per month (basic/small business), which is what you'd consider when just starting out. If you pay per month, you can shut it down if your shop doesn't work out.

DIY costs for the front end will run you somewhere from $2/$10 month, probably closer to the low end, for a website with low traffic using AWS.

The credit card charges - about 2.9% per transaction - can be excluded because they are charged the same whether you use Shopify or the DIY solution, like Stripe.

39 dollars a month for the year is about 460 dollars. 105/month is 1250/year. So you could think of that as your yearly cost.

Some very nice React templates can be bought online for a fraction of the cost of a year of Shopify.

So, think hard about your needs, scope out how much it would cost vs. your budget, and make the choice that makes the most sense for you.

Personally, I would choose a JavaScript site. But your mileage may vary.