Repository files navigation

This example will guide you through the code to build a simple Node.js Shopping App with the Minio Server.
We will useMinio Javascript Client SDK to fetch the application's image assets from the Minio Server.

The full code is available athttps://github.com/minio/minio-js-store-app, and is released under Apache 2.0 License.

• Install mc fromhere.
• Install Minio Server fromhere.

• Express web framework.
• Handlebars.

We will use Express for our application framework and Handlebars as the view engine.

Get the code for this example as shown below and then do npm install to get the express, handlebars and minio node-modules installed.

minio-store.js will serve as our app's entry point.

git clone https://github.com/minio/minio-js-store-appcd minio-js-store-appnpm install

1. We've created a public minio serverhttps://play.minio.io:9000 for developers to use as a sandbox. Minio Clientmc is preconfigured to use the play server. Downloadmc to do the next set of steps.Make a bucket calledminio-store on play.minio.io. Usemc mb command to accomplish this. More details on themc mb command can be foundhere.

    mc mb play/minio-store

2. Store product image assets can be set to public readwrite. Usemc policy command to set the access policy on this bucket to "both". More details on themc policy command can be foundhere.

    mc policy public play/minio-store

3. Upload store product pictures into this bucket. Usemc cp command to do this. More details on themc cp command can be foundhere.

   mc cp~/Downloads/Product-1.jpg play/minio-store/mc cp~/Downloads/Product-2.jpg play/minio-store/mc cp~/Downloads/Product-3.jpg play/minio-store/mc cp~/Downloads/Product-4.jpg play/minio-store/

   NOTE : We have already created a minio-store bucket on play.minio.io and copied the assets used in this example, into this bucket.

Inminio-store.js file, require minio and instantiate aminioClient object with play server's endpoint, port and access keys. Access keys shown in this example are open to public

varMinio=require('minio');varminioClient=newMinio.Client({endPoint:'play.minio.io',port:9000,accessKey:'Q3AM3UQ867SPQQA43P2F',secretKey:'zuf+tfteSlswRu7BJ86wekitnifILbZam1KYY3TG'});

NOTE : for using minio server locally also addsecure: false, in above code.

Set up a route for '/' in the minio-store.js file. Using thelistObjects method, get a list of all the files from the minio-store bucket. listObjects returns product urls which are pushed into an array variable called assets. Pass the assets array tohome.handlebars view.

varminioBucket='minio-store'app.get('/',function(req,res){varassets=[];varobjectsStream=minioClient.listObjects(minioBucket,'',true)objectsStream.on('data',function(obj){console.log(obj);// Lets construct the URL with our object name.varpublicUrl=minioClient.protocol+'//'+minioClient.host+':'+minioClient.port+'/'+minioBucket+'/'+obj.nameassets.push(publicUrl);});objectsStream.on('error',function(e){console.log(e);});objectsStream.on('end',function(e){console.log(assets);// Pass our assets array to our home.handlebars template.res.render('home',{url:assets});});});

Loop throughassets_url inhome.handlebars to render the thumbnails of product images. For simplicity in this example we do not use a database to store rows of product information. But you may store the image url from this array into your products schema if needed.

<!-- Page Features --><divclass="row text-center">{{#each url}}<divclass="col-md-3 col-sm-6 hero-feature"><divclass="thumbnail"><imgsrc="{{this}}"max-height=200max-width=200alt=""><divclass="caption"><h3>Product Name</h3><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p><p><ahref="#"class="btn btn-primary">Buy Now!</a><ahref="#"class="btn btn-default">More Info</a></p></div></div></div>{{/each}}</div>

The full code is available here :https://github.com/minio/minio-js-store-app. Do the following steps to start the app server.

git clone https://github.com/minio/minio-js-store-appcd minio-js-store-appnpm installnode minio-store.js

To see the app, open a browser window and visithttp://localhost:3000

• Usingminio-js client sdk with Minio Server.
• Minio JavaScript Client SDK API Reference.