21 Svelte Native

 

This chapter covers

  • Svelte Native and NativeScript components
  • Developing Svelte Native apps locally
  • NativeScript styling
  • Predefined NativeScript CSS classes
  • The NativeScript UI component library

Svelte Native (https://svelte-native.technology/) enables implementing Android and iOS applications using Svelte by building on top of NativeScript (https:// nativescript.org/). It’s a big topic. The learning path includes how to structure a Svelte Native app, use provided components, use provided layout mechanisms, implement page navigation, use NativeScript-specific styling and themes, use third-party libraries, and integrate with device capabilities. We will only scratch the surface here, but we will cover enough to enable you to start building mobile apps.

NativeScript uses XML syntax (with custom elements), CSS, and JavaScript/ TypeScript to create apps that run on Android and iOS devices. It renders native components rather than web views. NativeScript was created and is maintained by Telerik Corp., which was acquired by Progress Software in 2014.

NativeScript can be used without any web framework. In addition, there are integrations of several popular web frameworks with NativeScript. The NativeScript team supports Angular and Vue integrations, and the community at large supports React and Svelte implementations.

21.1 Provided components

21.1.1 Display components

21.1.2 Form components

21.1.3 Action components

21.1.4 Dialog components

21.1.5 Layout components

21.1.6 Navigation components

21.2 Getting started with Svelte Native

21.3 Developing Svelte Native apps locally

21.4 NativeScript styling

21.5 Predefined NativeScript CSS classes

21.6 NativeScript themes

21.7 Comprehensive example