tvOS Tutorial

October 18, 2023

(Part 1 of 5)

This tutorial is for iOS developers, who are willing to develop apps for the tvOS platform.

Apple has provided developers two ways to develop tvOS apps:

TVML Apps: Apple TV makes it easier to create client-server apps, whose primary purpose is to stream media, using web technologies such as HTTPS, XML, HTTP Request, DOM, and JavaScript. You use Apple’s custom markup language, TVML, to create interfaces, and you specify app behaviors using JavaScript. The TVML Kit framework provides the bridge between your native code and the JavaScript code in your user interface.
Native Apps: These types of applications are made using native technologies like Objective-C, Swift or even Swift UI. These applications use many commonly used iOS frameworks.

Both ways are a completely valid way to make apps, it depends what you’re trying to do. In this tutorial, we are going to create a simple tvOS app that streams videos using TVML Kit.

What is a TVML app?

An application developed with the help of TVML, TVJS, and TVML Kit is known as an TVML app. If these abbreviations sound foreign to you, don’t fret because they should. Here’s what they are:

TVML is Apple’s XML and stands for “Television Markup Language”.
TVJS is set of JavaScript APIs which provide you with the means to display apps created with TVML.
TVML Kit is the framework that connects TVML, JavaScript, and your native tvOS application.

What is a TVML template ?

Apple’s Television Markup Language (TVML) is an XML based language that is used to display information on the screen. TVML templates define what elements can be used and in what order and are designed to display information in a specific way.

Examples :

Alert Template
Catalog Template
Form Template
List Template

Click here to view all the Apple’s pre-made templates.

For this tutorial, we would be building a native video streaming app using TVML Kit, TVML and TVJS.

Before we start, let’s have a look at the resulting app.

Architecture:

To make this tutorial easier to follow, this tutorial is designed to be Architecture-agnostic i.e. it will only focus on the core concepts rather than following any specific architecture like MVP, MVVM etc.

Source Code:

Entire source code of this tutorial is hosted on the following Git repository:

https://github.com/ragul-m46/TVML-Sample.git

NOTE : When you download and run this project you will get the above error screen, that is because your local server is not active/running when you build this project, to clear this error you have to create a local server from your system, which can be done with the help of python3. Open a terminal at the “Sample TVML” folder and run the following command(this command differs as per your python versions, for python3 use the following command).