Did you know that for every screen you create in your buzztouch app, for every menu list, location item, button, and just about every other feature, there is a JSON description of that item? Did you know that you can create a JSON file to represent the features you want in your app, host that file anywhere on the Internet, and use that to create the features in your app, instead of creating them in your buzzztouch control panel? Do you know what JSON is? If you answered NO to any of these questions, then this tutorial is for you! In geek speak, JSON stands for JavaScript Object Notation, and it "is a lightweight text-based open standard designed for human-readable data interchange. It is derived from the JavaScript scripting language for representing simple data structures and associative arrays, called objects." Phew! That’s from Wikipedia, if you want to check it out. In more elegant terms, it’s the DNA that guides the creation of the screens and features you define for your app. The details for the features you configure are saved in JSON format in a BT_Config.txt file, then fed into the appropriate Objective-C (iOS) or Java (Android) code that renders the screens for your users. It effectively defines everything that a user of your apps sees. That’s pretty darn powerful! Let's take a look at a small example to show how this works. Here is an example of a PDF screen that is linked to from a Menu List. Don't worry about the syntax, we're just focued on understanding what this means in a basic form. "itemNickname": "List Item 1", "itemId": "1DE648E7DDE8812E458AF13", "itemType": "BT_screen_webView", "navBarTitleText": "List Item 1", "localFileName": "sample.pdf" This only a small subset of the fields for this particular type of entry, but it'll get us started. Notice that is has an itemNickname, which is what shows up in the Control Panel when you see your list of screens. Then comes the itemId, which is in this case a unique identifier for this item. You can use it in other screens to reference this item. Next is an itemType, which tells buzztouch which iOS or Android code to use to create this screen in the app. Then is the navBarTitleText, which is self-explanatory! Finally, the localFileName, which is the name of the file that will be loaded to view with this screen. Make sense? There are loads more attributes you can include in your JSON for the various screens, and they are all very well documented at this link: http://www.buzztouch.com/docs/v1.5 At this point, you should understand that (1) all the information regarding the design of your app, along with content that you'll include like images/documents/etc, are written in your BT_Config.txt configuration data file; (2) your BT_Config.txt file is written in JSON format; and (3) there are lots of ways to configure JSON to represent your apps content. OK, so now we sorta know what JSON is, we understand that our app is defined by JSON "code," but how does it go from configuration file into what the user sees? Magic! Well, not really magic, but pretty darn close! The folks at buzztouch, @David in particular, have devised an ingenious way to take this JSON information and feed it into Objective C and Java files, both of which are the official language of iOS and Android, respectively. Let's examine that very briefly. The code we looked at above creates a webView screen. We can tell that by the itemType. If we look in the download package we get from buzztouch (in this case iOS), two files: * BT_ScreensBT_screen_webView.h * BT_ScreensBT_screen_webView.m Feel free to crack them open with a text editor and take a look. If you do, you'll notice that these two files, the *.m file in particular, along with the other files indicated within these files, are responsible for parsing through this JSON, extracting the various properties, and applying them to the various method needed to draw and render the screen the user will look at. Yeah, I agree...better to just think of it as magic! But it's good to know where this stuff is, because it's these files (among others), that you can edit and extend to do basically whatever you want. David and buzztouch have provided an amazing framework for advanced app development based on JSON constructs, but it can be extended if you have the skill to try and work it out. Many have! One last thing to say, and we'll be at the end of our five minutes. A great thing about JSON and buzztouch is that there are several ways to use it. You can put all the JSON for your app in a single file, or you can put different sections of it in different remote files (accessible via a URL), and modify those as needed. A great example of this, and one that has been popular the past few days, is map points. When you create a Multiple Location Map, you have the choice of referencing an external data file for the locations. So long as that file follows valid JSON format (which you can check at JSONlint.com), then it'll work to populate your app. A huge bonus of doing it this way is that you can host this stuff externally, make changes, and never have to provide an app update through the store! There are others great reasons to do this as well. OK, I think my time is up. Hopefully this has helped demystify JSON for you a bit. If you have any questions, or need any clarification, please let me know! Thanks, Mark

Good stuff buddy. Need to change an app that has 400 locations at the moment into something more portable. Great post!

Mark Thank you so much for these cute little itty bitty tutorials. They are so enlightening and informative. The scary part is, all this is making sense...... and to think making a box of Kraft Macaroni and Cheese overwhelms me and this stuff doesn't :)

Great write-up, Mark! The more I learn about how BT uses JSON, the more ideas I come up with to add to my "tool".

@MacApple...thanks! JSON can certainly help you do that! @Known...glad they are helpful. It is kinda scary when all this stuff comes together! @Stobe...there are SO many things that can be done with BT and JSON! The sky's the limit, and I think your tool is going to be a huge advancement! Mark

@Mark, excellent article. Here's a link to my article regarding JSON. http://db.tt/CrqJYADG Fred

it's nice and usefully 5 min .... thank you

Good stuff, @Fred! There were some good points in there that I neglected to mention, but that are important as well. People should read both documents! Mark

Another useful tutorial! Thanks

My pleasure, @guisante, @leon7000! Any other tutorials you guys/gals are interested in?

@GNW nice work. In-App purchase would be nice. General overview using BT and how to connect screen to the store purchase. See ya Tony

Thanks, this and @MySkylla's has furthered my understanding! To break it down to my 'Lost but Trying' level, could you perhaps give pointers to how i may for instance include adding a new "Activity" into my app through 'coding' changes in my "BT_Config.txt configuration data" file? I dont need the whole stuff, but a few titbits here n there will work wonders please. PS I have already done some changes at BT_Config.txt configuration data level, and it makes me feel a lickl giddy in the head just been able to accomplish that! I am not a programmer, but have done a bit of swotting up on PyDev, only to find BT - a leap into the java unknown...

Thanks again Mark!

Thanks Mark, Well put, these pack a lot of info into a short post. I am sure these overviews will help a lot of people better understand how their app works. Appreciate the time you put into it. Jim

Great article. Enjoying learning more about Buzztouch and its 'infrastructure'. Great job!

I was at a gathering last night that was largely web development people and thanks to Buzztouch and tutorials like Mark's, I didn't feel completely out of place chatting with these people. I even asked a recent graduate from a web development course about JSON to try and get some more info on it and she didn't know much about it (they didn't use it in the course) so now that I've read this tutorial, I probably know as much as she does about it. Great posts and as others have already stated, things are slowly coming together for me on the back end of things. It really is like learning a new language.

Maybe a tutorial to improve interactions in our BT apps. We know that most part of rejection are related with lack of interactions.

That was really something to read. I learnt quite a bit! Thanks.

Thanks everybody for the tutorial suggestions. I'll see what I can do! @Annandale...glad you learned some stuff! Mark

Sorry to unearth this post 3 months after (i love zombies) but just wanted to thank you Mark for this tutorial: - it does take 5 minutes to read - it is totally understandable by a non programmer who has basic knowledge of code (me) - it should be a must read to whoever wants to go the extra mile in terms of customization! Thanks for taking the time to share this knowledge!

Thanks, great article, but I am new to this technology and some parts were a little too technical, can anyone point me to a high-level overview of the subject?

Hi @HaroldDev, Welcome to Buzztouch! Here's one tutorial that's kinda interesting: http://code.tutsplus.com/tutorials/understanding-json--active-8817 And another: http://www.copterlabs.com/json-what-it-is-how-it-works-how-to-use-it/ But, to be honest, unless you're going to create a custom plugin, or try to populate some of the app data using a server side PHP script or something, you really don't "need" to understand it in order to work with Buzztouch. BT does all the work for you using the control panel for your app! Please don't hesitate to let us know if you have any other questions. Again, welcome! Mark

Hi Mark, thank you, I really appreciate it. Those two links help me a lot! I have been looking to this article as well: http://webcreek.com/2016/03/29/sql-server-2016-adds-json-support/ I think I have a better understanding now; I will let you know if I have other questions, though. Thank you again! Harold