@kui-shell/plugin-tutorials/samples/@tutorials/translation-demo/tutorial.json

IBM Cloud shell plugin for tutorials

{
  "profile": "This composition translates English to Shakespeare-style English, and translates any other utterance to plain English. It uses **[Fun Translations](http://funtranslations.com/)** for the former, and **Watson Language Translation** for the latter; **Watson Language Identification** determines the uttered language. This tutorial combines and applies the introductory skills of serverless computing into the creation of an application, giving a general example of the try combinator, which is analogous to try-catch.",
  "time": "15 minutes",
  "skills": ["Programming Model"],
  "steps": [
    {
      "heading": "Introduction",
      "content": "In this tutorial, we will create a serverless chatbot using Composer. This chatbot reads in a message and translates it based on the language it detects.",
      "transition": "next"
    },
    {
      "heading": "Composing the App",
      "content": "The translation chatbot uses simple logic to accomplish the desired task.\n\n- `languageId`: Identify the lanuage of the user's message\n- `translator`: If the lanuage is not English, translate it to English\n- `en2shakespeare`: If the language is English, translate it to \"Shakespeare English.\"\n- `catch`: If the language cannot be translated (ex. a number), return an error message\n\nTo review the chatbot composition, press enter, then 'DEPLOY' to deploy it.",
      "transition": "next",
      "autocomplete": {
        "value": "edit myTranslateApp"
      },
      "preview": {
        "composition": "translation-demo"
      }
    },
    {
      "heading": "IBM Translation Service",
      "content": "In OpenWhisk, users can create groups of related actions referred to as packages. In order to use the built in package for IBM Watson Language Translation Service, you need a instance of the service under the namespace of a valid IBM Cloud account. To learn more about OpenWhisk packages, click <a style='text-decoration: underline; cursor:pointer' href='https://github.com/apache/incubator-openwhisk/blob/master/docs/packages.md' _target='_blank'>HERE</a>. To create an account and set up credentials, click NEXT. ",
      "transition": "next"
    },
    {
      "heading": "Setting Up Credentials",
      "content": "Complete the following steps in your browser.\n\n- Login to your <a style='text-decoration: underline; cursor:pointer' href='https://console.bluemix.net/dashboard/apps' _target='blank'>IBM Cloud Dashboard</a>.\n- If there is a \"Language Translator\" service on the list, continue to Step 5. Otherwise, click 'Create Resource' on the upper righthand side.\n- Search for \"Language Translation\" and click on it.\n- Select the free lite plan, and then click 'Create'.\n- You will be brought to the Language Translation Service homepage. Click on 'Service Credentials' on the left pane.\n- Choose a service credential that you would like to use. If you do not see any, click \"New Credential\" then \"Add\".",
      "transition": "next"
    },
    {
      "heading": "Setting Up Credentials (cont.)",
      "content": "Click 'View Credentials' to expand the option. A username and password are listed; replace 'MYUSERNAME' and 'MYPASSWORD' in the imported command to the username and password respectively.",
      "transition": "enter",
      "autocomplete": {
        "value": "wsk package bind /whisk.system/watson-translator myWatsonTranslator -p username MYUSERNAME -p password MYPASSWORD"
      }
    },
    {
      "heading": "Creating a Translation Action",
      "content": "The 'en2shakespeare' function is a typical example of turning a web API service into an action. Review the imported command to create the action. Press enter and then click 'Deploy'.",
      "transition": "next",
      "autocomplete": {
        "value": "create en2shakespeare path/to/file.js"
      },
      "extras": {
        "tips": [
          "Tip: OpenWhisk Node.js runtime includes several built-in npm modules. Zip actions can also be created that use custom modules. To read more about packaging actions as Node.js modules, click <a style='text-decoration: underline; cursor:pointer' href='https://github.com/apache/incubator-openwhisk/blob/master/docs/actions.md#packaging-an-action-as-a-nodejs-module' _target='_blank'>HERE</a>."
        ]
      }
    },
    {
      "heading": "Running the App",
      "content": "The composition is now ready to run. Use the invoke command, replacing 'test' with an input value. Here are three suggested values for the parameter `payload`.\n\n1. \"Mieux vaut prévenir que guérir\"\n2. \"hello world\"\n3. \"3.14159\"",
      "transition": "next",
      "autocomplete": {
        "value": "app invoke myTranslateApp -p payload test"
      }
    },
    {
      "heading": "Connecting to Slack",
      "content": "Complete the following steps in your browser.\n\n1. In order to connect to Slack, login and select 'Create New App' on the <a style='text-decoration: underline; cursor: pointer; href='https://api.slack.com/apps' _target='blank'>Slack API App page</a>.\n2. Name the App (ex. Translation Bot), select a development workspace, then click 'Create App'.\n3. Under 'Features > Bot Users' select 'Add a Bot User'. Choose a display and default username (ex. translation_bot), turn on 'Always Show My Bot as Online', and press 'Add Bot User' at the bottom.\n4. Go to 'Settings > Install App' and select 'Install App to Workspace'. Authorize Slack to add the bot user.\n5. Go to 'Features > Event Subscriptions' and turn it on.\n6. Under 'Subscribe to Bot Events', add the 'message.im' bot user event.\n7. Review the imported code and press enter.",
      "transition": "enter",
      "autocomplete": {
        "value": "create slackTranslationBot path/to/file.js"
      }
    },
    {
      "heading": "Creating the Bot",
      "content": "Use the imported `webbify` command to create a URL for invoking the composition. Copy the 'https://openwisk.ngblue.next' URL and paste it into the 'Request URL' text book of the Slack app's 'Event Subscriptions' then click 'Save Changes'.",
      "transition": "next",
      "autocomplete": {
        "value": "webbify slackTranslationBot"
      }
    },
    {
      "heading": "Finish Up the Bot",
      "content": "On the Slack page, go to 'Features > Incoming Webhooks'. Turn it on and add a new webhook that enables the app to post to the bot, ex. @composition_bot. Lastly, review the imported command and press enter to create an action that sends a message back to our bot.",
      "transition": "next",
      "autocomplete": {
        "value": "create sendSlackMsg path/to/file.js"
      }
    },
    {
      "heading": "Testing the Bot",
      "content": "Review the imported command and press enter to edit your new action. Replace the value of `url` with the webhook URL and then click DEPLOY. In Slack, send a test message to your bot (ex. A cada cerdo le llega su San Martín). Congratulations, you now have a serverless Slack bot!",
      "transition": "next",
      "autocomplete": {
        "value": "edit sendSlackMsg"
      }
    },
    {
      "heading": "Conclusion",
      "content": "You have completed the \"Translation Demo\" Tutorial. Click CLOSE to exit hte tutorial or back to return to the previous page. Enjoy your experience with IBM Cloud Shell!"
    }
  ]
}