NativeScript - First Steps

Install node and npm on Linux or Mac, set up the node version manager n, and verify node and npm versions to begin native script development.

Learn how NativeScript exposes a unified JavaScript API across iOS and Android, using CLIA to call the native APIs, with core modules and plugins for UI, widgets, and fetch.

Learn how to run a NativeScript app on iOS using a Mac, install Xcode from the App Store, and build for an iPhone to view on iOS.

This lecture introduces JavaScript in native script layouts, explains frame as a container for pages, sets the main page with a hello world label, and teases code behind files.

explore how the code behind file powers the user interface by handling the business logic with javascript, fetching data, and updating UI elements.

Learn NativeScript action bar and basic widgets, including setting the action bar data and title, plus basic left or right icon customization.

Learn how a label widget in NativeScript displays text using the text attribute, and how to enable text wrap, set text alignment, and customize background and text colors.

Explore how to create a text field in NativeScript with customizable properties, secure input, keyboard types, return key actions, and max length constraints to build interactive forms.

Load images in a native script app from internet or local resources, using Resources folder or directory, and apply stretch modes such as none, fill, aspect fit, and aspect fill.

Discover what data binding is in NativeScript, connect your code-behind logic with the UI, and reflect changes across code and UI using binding and observables.

Learn two-way data binding in NativeScript by connecting view and logic so binding context updates reflect in the view and user input updates propagate back to the logic.

Learn to enable two-way data updates between ui and logic in NativeScript by wrapping an object with fromObject and observable to keep the binding context in sync in real time.

Learn absolute layout in NativeScript by positioning components with explicit left and top coordinates from the top-left origin; it's rarely used but useful for games.

Explore NativeScript's flex box layout: define flex direction, justify content, align items, and wrap to build UI layouts with stacked or wrapped items.

Explore grid layout in NativeScript, learning to define rows and columns, place elements by row and column, and use star and auto sizing to create adaptive galleries or layouts.

Create a simple native script game that shows a ball and requires you to stop it before it touches the floor, while tracking score with basic math and physics concepts.

Set up a NativeScript layout and CSS for a game: create a full-screen container, an FBI performance label, and basic styling to initialize the game world.

Set up the native script physics js renderer and create a world with configurable bodies and forces. Install via dns, wire to the page, and render world at 60 fps.

add a wall and a yellow floor to the physics world in NativeScript, using a rectangular floor, center positioning, and color to ensure the ball rests on the floor.

Explore styling NativeScript applications using css, and become familiar with the options available for css in NativeScript. Learn how css works with NativeScript to create awesome layouts.

Learn to implement page-specific CSS in NativeScript by using a page.css file named after the page, apply a black background, and understand style specificity from global to page to inline.

Master inline CSS in NativeScript first steps by applying inline styles via style directives to a button, adjusting color, opacity, background, and class-based tweaks for real-world UI.