Quickstart Blog Forum Slack

JSON browser that builds native components.


Just like how web browsers turn HTML into a web page,
Jasonette turns JSON into iOS and Android native components.
This lets you build native apps by writing a simple JSON.

browsers

Server sends HTML.
Browser turns it into a web page.

jasonette

Server sends JSON.
Jasonette turns it into native components.
<html>
  <head>...</head>
  <body>
    ...
    <div>...</div>
    ..
  </body>
</html>
{
  "$jason": {
    "head": {...},
    "body": {
      "sections": [{
        "items": [
          { "type": "image", "url": "..." },
          { "type": "label", "text": "..." },
          ...
        ]
      }]
    }
  }
}

ALL YOU NEED IS JSON


Jasonette abstracts away all low level programming with a JSON based markup.
All you need to write is a single JSON.

LAYOUT

Construct complex layouts with JSON

Build a card UI with an image, labels, and nested layouts
{
  "type": "horizontal",
  "components": [
    { "type": "image", "url": "https://pbs.twimg.com/profile_images/557061751150112768/eMwi4Xz2.jpeg" },
    { "type": "vertical",
      "components": [
        { "type": "label", "text": "Ethan" },
        { "type": "label", "text" "www.textethan.com" }
      ]
    }
  ]
}

ACTION

Describe actions with JSON

Make a network request and draw the result
{
  "type": "$network.request",
  "options": {
    "url": "http://api.giphy.com/v1/gifs/search",
    "data": { "q": "kitten", "api_key": "dc6zaTOxFJmzC" }
  },
  "success": {
    "type": "$render"
  }
}

STYLE

Style components with JSON

Style a label
{
  "type": "label",
  "text": "Hello World",
  "style": {
    "padding": "10",
    "corner_radius": "5",
    "background": "rgba(0,0,0,0.4)",
    "color": "#ffffff",
    "font": "HelveticaNeue"
  }
}

GET AN APP ON YOUR PHONE IN 20 SECONDS


Jasonette is an already "pre-cooked" app, which means "getting started" means simply downloading and running the app. All you need to do:

1. Download
2. Connect your phone
3. Press play

Going from download to an actual app on your phone is so simple that it fits into a single animated gif. Watch below.

Once you have it running,
simply switch out the url to play your own JSON.


BUILD AN APP IN MINUTES

It has never been trivial to have an idea and turn it into an app quickly. Even for genius programmers.

With Jasonette, you don't even have to be a programmer. Anyone can make an app. And do it in minutes, not days or weeks.

Make an app as fast as it takes to write a blog post.

100% NATIVE


Directly manipulate native APIs simply using JSON.
For Android, this means direct access to LinearLayout, RecyclerView, etc.
For iOS, this means direct access to UITableView, UIStackView, etc.

background image
message input
camera access
video playback
textfield / textarea
header menu
tabs
slider
alert
banner
picker
date picker
share widget
vertical scroll
horizontal scrol
floating layers
sliding menu
And much more! Including...
1. Direct access to the device such as camera, audio, geolocation, video, network request, etc.
2. Powerful layout engine that directly manipulates native components such as UITableView, UIStackView, UIView, etc.
3. Describe styling and event handling all with JSON

CROSS PLATFORM

100% native binary for both Android AND iOS.

iOS

Android

NATIVE APP OVER HTTP


Want to make changes to your LIVE app?

Simply change your JSON content on the server,

and watch the app change in front of your eyes, instantly!


BATTLE TESTED


Jasonette was extracted from several production apps on the App Store, so you know it works.
Below are some actual production apps built with Jasonette:

Ethan
CatchAll!
Kitty

100% OPEN, FOREVER


100% FREE

Everything is free for you to use. There is no small print that says "pay $$$ if you want to publish your app". It's all yours.


100% OPEN SOURCE

Jasonette is licensed under MIT license. Take the code, build and publish your own apps, and do whatever you want with it!


100% PORTABLE

There is no magical backend server you need to learn to use, pay for, or install to use Jasonette. ALL YOU NEED IS JSON. If you have a web server, you ALREADY have a Jasonette server.


100% EXTENSIBLE

Jasonette is essentially just an engine that maps JSON expression to native components and actions. It doesn't force you to drop everything and adopt the technology exclusively. You can extend it or even integrate it with your existing native code seamlessly.