Chatbot Web Tutorial


In this tutorial you will learn how to build a chatbot using NativeChat. You will follow a series of steps, which will guide you through various aspects of building a fully featured chatbot.

Need support from NativeChat?

Talk to an Expert

Not enough time? Save this for later.

Send to Email


You will build a chatbot for a car rental company. We will make a number of simplifications, for example: we will assume that each city can only have one rental office. However, the general idea should be fairly accurate with what you would expect from a real chatbot.

For the backend, we will use a demo API hosted at https://api.demo.nativechat.com, which will come with some preconfigured data and cloud functions to aid you along the process.


The tutorial will introduce each data collection and cloud function as we go.

If you are curious and would like to preview the data, you need to make a GET request and pass in an authentication key, which means that you can't just paste the URL in your browser to get the data.

In order to get a glimpse of the data or test out the cloud functions, you could use an application like Postman. Here is a getting started guide for Postman.

The Structure of the tutorial

This tutorial is structured in a slightly different way to how you would actually go about building a chatbot. Usually you would add all the required features each time you add a new conversation step.

However, in order to make things simpler and easier to understand, the tutorial is divided in a number of chapters where each introduces a new concept and expands on the existing chatbot project.

Type Type Type

It is important that you type each piece of code yourself and don't copy and paste solutions unless you are really stuck.

Typing will help you get used to the process, syntax and the structure of the project. While copy and paste is good to see how something works, before you forget it all. So, if you want to really learn: type, type, type it all.

Even as you progress through the tutorial and feel like you have already completed a similar task and that you can just copy and paste and tweak what needs changing, even (or especially) then try to go through the process and build each piece of the chatbot.


First, you need to log in with your NativeChat Account to NativeChat Portal.

If you don't have a NativeChat Account yet, you can create one here.

Creating a project

From the Chat portal, create a new project (by pressing the big plus button), select a Blank bot template, call it Car Rental, and press Create.

Understanding a conversation structure

Although the template you used is the Blank bot, you will find that there is already some code in the Cognitive Flow tab.

You will probably notice that the code is in a JSON format. That is correct, NativeChat uses a declarative approach, where you describe what you want the chatbot to handle, and the chatbot engine manages the process for you.

The chatbot contains configurations for the following conversations:

  • welcome - what to do when a user starts a new session. Usually used to greet the user.
  • help - what to do when a user types help or when the bot gets stuck. Usually used to let the user know what the bot’s capabilities are.
  • restart - what to do after the user asks to restart.
  • settings - general project settings. Currently used for default messages.
  • commands - commands that allow the user to restart a conversation or to ask for the next batch of items.

Testing the default conversation

  1. Type: restart and press enter.
  2. See the response.
  3. Click on Debug and see the conversation log, which displays the understanding by the chatbot engine - we will dive deeper into this later.

NativeChat Tutorial Test Conversation

Note that you don't have to close this window and open it again each time you make changes to your chatbot. Usually it is enough to save the chatbot and type restart for the chatbot to use the latest update.

Loading animation
Save this e-book for later

Loading animation
Would you like a free consulting session?

Want to learn more about NativeChat?

Get started today