Fetch and Parse Excel Spreadsheet

Back-End
November 18th, 2018
< blog

Introduction

I found this interesting plugin and want to show you guys that you can automatically convert excel spreadsheet to JSON file. I reckon that this is a good feature. For example, if I want to manage my merchandise (stock, price, product images, etc.), I can easily change it in an Excel file which is more intuitive and readable. For those who are not a developer, they can also deal with it.

Plugin Recource

Check the plugin resource link below:
https://github.com/SheetJS/js-xlsx

Demo Site

I am going to show you where I utilize this plugin. You can check the website link below, which I built for practicing fetching the data and using the plugin.
https://myjaypan.com//Parse-and-Convert-Excel-file-to-Json/
If you want to view my code, you can download from my GitHub
https://github.com/JaynPan/Parse-and-Convert-Excel-file-to-Json-

  • Home Page
  • Product Info Page

Demo Site Explanation

In this demo site, as you can see, there are different health food products display below. While you click the single product, it will jump into specific product info page, which showcases the stock, price, and the description. 

I store all of this specific information by using the excel spreadsheet, shown below. The info will change synchronously while you change in the spreadsheet.

Product Info Database

I download the plugin from the Github and import “xlsx.full.min.js” into the product.html heading like this:
<script type=”text/javascript” src=”./xlsx.full.min.js”></script>

Now, I started to write the code! I found this starting code from the internet. I just copied and pasted it into my script. The source code link is here:
Starting Code Link

Generally speaking, it converts the xlxs file into JSON file. You will find it becomes an array. After that, I loop through the whole array to find out the one that match the product ID.

Conculsion

Here you go, I made it! This is not a good tutorial post. I just want to share my experience. However, if you have any question or want to tell me others cool features in this plugin, don’t hesitate to contact me!