Need suggestions for a static e-commerce solution using Hugo

I’m on the lookout for suggestions / ideas for a potential client project…

The business model for my client is computer leasing. No monies exchange hands between a customer and the client, instead a customer will make an application for the leasing of a computer (and accessories) and this application will be forwarded by my client to a financing company. So basically the client is a broker of sorts.

Based on the model I need to build a website with the appearance an e-commerce store (think WooCommerce or Shopify), but with the benefits or a static site.

The user journey would be:

  1. Customer views available products (which detail lease cost)
  2. Customer adds products to a persistent cart
  3. Customer can view cart (add remove products) and then proceed to checkout, which is an application form to apply for a lease
  4. Email of said application is then sent to client for processing

WooCommerce / WordPress has been mentioned as a platform, but I’m confident this could be built on Hugo, with a headless CMS like Forrestry.io for the client content authoring. As we need no merchant facilities I’d like to stay clear of SAAS solutions like SnipCart, Shopify buy buttons or even using WordPress as a headless CMS for the sake of simplicity and speed.

My plan would be:

  1. Deploy to an apache server (for php form processing using AJAX) whilst serving up the rest of the site as static HTML
  2. Build the cart system and enable persistence using cookies
  3. Logic for adding items to the cart would be completed via JS, pulling said product data from data attributes.

I work independently so would appreciate others thoughts / feedback on this plan as I can only bounce ideas of my cat, and he’s not helping much!

Many thanks

Hugo (as things are now) is not meant as a full solution for e-commerce sites.

That is why the SAAS service you mentioned above, markets itself as ideal for Static Sites. Also Netlify is developing an e-commerce solution but last time I checked it was far from ready.

If/when Hugo gets a plug-in API it may be possible to publish e-commerce sites easily, but right now it looks like that the plan you outlined above is your only option.

However make sure to have a look at Hugo’s Custom Output Formats. It might be useful to output product data as JSON for your purposes.

1 Like

To add to @alexandros sage advice here’s an MIT licensed e-commerce template with Snipcart integration you may wish to reference, crafted with 143 by the team at CloudCannon.

1 Like

Thanks for the feedback.

The suggestion of outputting the products collection as JSON is exactly how I envisioned this working. I’d actually create a small API to look this data up. As the customer adds a product to their cart, I save the product ID, quantity and any key value pairs for a variable product to a cookie array. As the cart would be static, I would then populate the chosen products at load time via an AJAX call to my JSON data using the client side cookie.

Basically I’m just capturing customer product selections and submitting this data via a normal PHP mail script. So fortunately as I don’t need full blown e-commerce functionality (merchant payments), the benefits of going static are really appealing to the client.

Thanks again for your thoughts

Also, perhaps, this topic will be useful in some cases:

2 Likes

You may want to look at using session/local storage or the inbuilt browser SQL db as well as cookies are fairly limited when it comes to storing structured data.