Skip to content
olaph wagner edited this page Jul 3, 2018 · 4 revisions

Short Name

Building a simple web gallery application

Short Description

This code pattern serves as a basic example of how you might use IBM Cloud to build a simple web application that interacts with IBM Cloud Object Storage.

Offering Type

Cloud

Introduction

The COS Web Gallery is a simple Node.js app running on IBM Cloud that uses the Express framework to create a basic two tier web app that can pull data from and push data to IBM Cloud Object Storage (COS) using a simple web form.

Author

By Steve Bollers and olaph wagoner

Code

Video

  • link to youtube video

Overview

The COS Web Gallery is a simple Node.js app running on IBM Cloud that uses the Express framework to create a basic two tier web app that can pull data from and push data to IBM Cloud Object Storage (COS) using a simple web form. At the heart of the server side app is the Node.js IBM COS SDK package which handles the authentication and connectivity to IBM COS. Express handles the routing allowing the business logic to be handled by the controller. The upload form uploads an image to an express route which calls functions from the IBM COS SDK, multer, and multer-s3 functions to upload it to the designated IBM COS bucket. A request for the image gallery view invokes IBM COS SDK functions to get the URL for each image in the bucket. The URL data is sent back in the response and merged with the EJS view template and during the view rendering.

When the reader has completed this code pattern, they will understand how to:

  • Deploy a Node.js app (optionally using Cloud Foundry)
  • Provision a service instance of Cloud Object Storage
  • Use the Node.js IBM COS SDK to interact with Cloud Object Storage

Flow

  1. From the Image Upload form the user selects an image by using the photo gallery upload form and clicks Upload.
  2. The form performs a POST to the app, and the app uses the S3 SDK to generate a PUT to the IBM COS server.
  3. The user clicks the Gallery tab, which makes a GET request to the app for the gallery view.
  4. The app performs a GET request through the S3 SDK to retrieve the image URLs of the images that are stored in the IBM COS bucket. The image URLs passed back in the response are merged with the view template which is rendered for the user and the images are displayed.

Included components

  • Cloud Foundry: Build, deploy, and run applications on an open source cloud platform.
  • Cloud Object Storage: Build and deliver cost effective apps and services with high reliability and fast speed to market in an unstructured cloud data store.

Featured technologies

  • Cloud: Accessing computer and information technology resources through the Internet.
  • Node.js: An open-source JavaScript run-time environment for executing server-side JavaScript code.

Blog

Blog Title

Blog Author

Blog Content

Links