Typeform I/O

The API Redemption

Full Stack Hack

#HackAwesomely

What we will

talk about

Introduction

  • What is Typeform?

 

  • What is Typeform I/O?

 

  • How is I/O different from Typeform.com?

 

Usage

  • Authentication

 

  • Creating simple forms

 

  • Creating and using designs

 

  • Creating and using images

 

  • Creating a not so simple form

 

  • Quick NodeJS example

Some Use Cases

Who Am I?

Victor Bjelkholm

@VictorBjelkholm

Swed(ish)

Swedish elk

Loves programming

and a aspiring game developer

Developer Evangelist

@Typeform

What is Typeform?

Awesome form builder

Worried that no one cares about your form?

Worried that no one fills out your forms?

Worried that people laugh about your forms design?

Worry no more!

Typeform to the rescue!

What is Typeform I/O?

Awesome form

builder API

Need to create thousands of forms in a couple of seconds?

Or forms that looks different for almost every single user you have?

Or you want to use typeforms but don't want to use our builder? (whitelabel)

Yep. We can do that

Typical Flow #1

Typical Flow #2

Typical Flow #3

How to use Typeform I/O

Authentication

API-key header


curl -X GET -H "X-API-TOKEN: api_key" "https://api.typeform.io/v0.4/"

Creating a simple form

JSON Body

{
    "title": "My first form!",
    "fields": [
        {
            "type": "yes_no",
            "question": "Are you enjoying this presentation?"
        }
    ]
}
curl -X POST "https://api.typeform.io/v0.4/forms" --data @body.json

Creating a design

JSON Body

{
    "font": "Source Code Pro",
    "colors": {
        "question": "#474747",
        "button": "#000000",
        "answer": "#3BA89F",
        "background": "#FFFFFF"
    }
}
curl -X POST "https://api.typeform.io/v0.4/designs" --data @body.json

Creating an image

JSON Body

{
    "url": "http://i.imgur.com/iyciF2t.jpg"
}
curl -X POST "https://api.typeform.io/v0.4/images" --data @body.json

Use Cases

Typeform.com

Alternative 

Use Case #1

Create the next awesome form builder

Custom feedback

Use Case #2

Create the right form for the right user

HelloWorld

Use Case #3

Dynamically learn programming with forms that adjust the difficulty

Typeformizer

Use Case #4

Automatically optimize forms after answering

Let's look at

some code!

The fun part

Categories

Best by judges

Best I/O Hack

Best by popularity

Prizes

Prizes

CASH!1!!!

First prize: €1200

Second & Third prize: €600

Need help?

Got stuck?

Ask us anything, anywhere!

 

#SlackChannel

 

In person, look for us!

Crafted by

@VictorBjelkholm

Typeform I/O - Full Stack Hack

By Victor Bjelkholm

Typeform I/O - Full Stack Hack

Introduction Workshop to Typeform I/O. Going through authentication and hackathon use cases.

  • 1,257