Learn Ember, Ios and Rust

In this course, Chris takes a README-driven approach to build out a Rust CLI that supports content authoring for a digital garden.

Specifically, you'll work through the first command for the CLI, writing files. You start by initializing a new Cargo binary crate through creating the `write` command that allows you to create files (and their contents) to the folder that you set. 

Step by step you'll learn about:
- Handling user input
- Error handling
- Rust Move semantics
- Rust Copy semantics
- Integration testing

...and more!

Rust is a systems programming language that runs blazingly fast, prevents segfaults, and guarantees thread safety.

rust

Creating a Digital Garden CLI with Rust

Rust is a modern language that is close to the metal. It's got the performance of C, but with a more friendly syntax and community.

It's also memory safe, and ensures your applications are bug free by catching errors at compile time instead of runtime.

These features make Rust a great choice for developing code for embedded systems, web servers, and CLI apps. You can even compile Rust into WebAssembly in order to run it in-browser!

But as the saying goes, "before you learn to run, you must learn to walk".

In this course, you will write your first Rust application.

Starting from “Hello World” you’ll quickly move on to learning about Rust’s types, configuration files, and the `cargo` package manager along with classics like functions, loops, and handling user input.

More Rust-specific concepts like macros and pattern matching will also be introduced.

Check out these [**community notes for this course on Github**](https://github.com/eggheadio-projects/write-your-first-program-with-the-rust-language).

Next Steps: [Basic Types in Rust](https://egghead.io/playlists/data-types-in-rust-ab72)

Write Your First Program with the Rust Language

[Rustlings](https://github.com/rust-lang/rustlings) is a set of exercises that serves as a great introduction to the Rust language. It covers many concepts from the [Rust book](https://doc.rust-lang.org/book/) by asking you to work through sets of exercises.

This collection walks you through Rustlings in a way that explains what's going on in each exercise. We cover everything from basic types to generics and threading.

Learning Rust by Working Through the Rustlings Exercises

This collection contains videos that explore the basic types in Rust, including **Fixed size Integer**, **Pointer sized Integer**, **Boolean**, **Strings**, **Characters**, **Arrays**, **Tuples** and more.

If you're just starting out learning Rust and [wrote your first program](https://egghead.io/courses/write-your-first-program-with-the-rust-language), this collection is the right place to get more familiar with the language!

Basic Types in Rust

Many languages work on a compilation story to WebAssembly, but Rust is already ready for primetime. Why?


- Rust is a stable language and great replacement for C and C++. 
- Due to the reference and borrowing concept, Rust doesn’t need a Garbage Collector and can be used for a production-ready WebAssembly project. 
- The Rust/Wasm team has built some sophisticated tooling for straightforward interoperability between Rust and JavaScript.

This course gives you the tools to compile to WebAssembly with Rust. Over 11 lessons, we’ll set up a project and explore various paths of communication and interoperability between Rust and JavaScript.

Using WebAssembly with Rust

Open source framework for building truly native mobile apps with Angular, TypeScript or JavaScript.

nativescript

Objective C is a very interesting programming language which offers a lot of power as well as interesting paradigms. Let’s look at some Objective C api’s and how they translate to NativeScript. In particular, let’s learn how to wire up iOS delegates using [Filestack's FSPickerDelegate](https://github.com/filestack/FSPicker#fspickerdelegate) as an example. We will also look at handling WeakRef’s and iterating an NSArray.

Use Objective C Delegates in NativeScript for Angular iOS apps

One of the exciting benefits you have with NativeScript is the ability to write native code (Java and Objective C) directly in JavaScript/TypeScript allowing you to create a consistent high level api over top of both underlying iOS Objective C/Swift and Android Java apis. In this lesson, we will look at how to design a consistent api that taps into the appropriate native api’s on the target platforms using underlying native libraries.

Develop a consistent plugin api across your Android and iOS NativeScript app

To prepare your development environment to code against native apis such as Objective C, Swift and Java, let's learn how to [install tns-platform-declarations](https://www.npmjs.com/package/tns-platform-declarations) to provide rich intellisense support for all the native iOS and Android api’s. This lesson will cover how to modify your tsconfig.json and references.d.ts properly to ensure working with native api’s is smooth and as helpful as possible.

Prepare for native iOS and Android api intellisense with NativeScript

React is one of the web’s most popular frameworks for building JavaScript applications. 

If you know what you’re doing, React can drastically simplify how you build, use, and maintain code.

Whether you’re a React newbie or you’re ready for advanced techniques, you can level-up with egghead. Explore our in-depth courses, lessons, and community resources to build more powerful applications and crack open your career.

react

In this lesson we'll explore debugging our React Native application in an actual iOS device.

React Native: Debugging on an iOS Device

We will learn how to install an Objective C library distributed via a [CocoaPod](https://cocoapods.org) into our project and expose its native api to our app. Specifically, we will cover how to immediately start working with the library even when a [NativeScript](/q/nativescript) plugin does not exist for it. Take for example [Filestack](https://filestack.com), a really powerful file uploading api that provides an SDK written in [JavaScript](/q/javascript) for the web, but also offers native SDK's for iOS and Android. Let's take a look at how to code right against this [native iOS SDK](https://filestack.com/docs/sdks/ios).

Use an Objective C library in NativeScript for Angular iOS app

In this lesson we'll look at some simple ways to customize TabBarIOS, creating a scrollable tab area, and implementing custom icons in TabBarIOS.Item.

React Native: TabBarIOS Customization

Learn how to generate TypeScript declaration files for all native api’s for iOS, including any 3rd party Objective C/Swift libraries included in your project via Cocoapods or other means. This will allow you to view all the metadata for included iOS libraries to see what classes and apis are exposed to NativeScript.

Generate metadata TypeScript declarations for Objective C/Swift libraries on iOS

Building a custom NativeScript XML view component for iOS entails several interesting notes, like overriding the onLoaded method of the base NativeScript View class. Let’s look at how to properly build a custom component based on an underlying native view widget with NativeScript XML which may come from a CocoaPod. We will learn several important aspects regarding Objective C properties and methods you will need to consider. In particular, we will implement this [Objective C view component](https://github.com/Boris-Em/BEMAnalogClock)

Build a custom NativeScript view component for iOS

A JavaScript framework for creating ambitious web applications.

ember

In this lesson we will create an `updateContent` method that sets the value of our `content` property to the current epoch timestamp. We need to call `toString()` on the `Date.now()` method in order to make TypeScript happy.

```
updateContent() {
  this.content = Date.now().toString()
}
```

We create a constructor that takes the options parameter, call `super(options)` and call into our `this.updateContent()` method.

```
constructor(options) {
  super(options)
  this.updateContent()
}
```

When we refresh our page we can see that the value of `content` is set to the epoch timestamp. 

To make the content really dynamic we use `setInterval()` to call into `updateContent` each second: `setInterval(() => this.updateContent(), 1000)`.

When we save our file we see that our content does not get updated anymore and when we check the console we see that we get an error telling us that: The 'content' property on the my-component component was changed after it had been rendered. The error also informs us that we should Use the @tracked decorator to mark this as a tracked property.

We add the @tracked decorator to our property, we import tracked from @glimmer/component and we refresh the page. We verify that `content` gets updated each second.

We change our `updateContent` to add our the timestamp to the array. When we use `this.items.push(this.content)` to achieve this we see that the list does not get updated. This is because the `@tracked` decorator only tracks the re-assignment of properties.

The way to get this working is by re-assigning our `items` array inside `updateContent`. We assign a new array, de-structure the current items array and add the new content.

```
this.items = [...this.items, this.content]
```



Use dynamic data in a GlimmerJS component

In this lesson we will use the ember cli to generate a new component. Running `ember g glimmer-component my-component` generates the template and component class. We change the content of our component and add it to the main template in order to show it on the page.

Create a new GlimmerJS component

In this lesson we will add a variable called `content` to our component class, initialize it as a string and display the variable in our class using the double curly braces syntax, which is the handlebars expression for expressions, `{ {content }}`. 

After this we create a new class variable called `items`, initialize it as an array with strings. To display this list in our template we add a `<ul></ul>` and inside this unordered list we use the handlebars `each` helper to display the list items.

And inside our each statement we will print a `<li>` tag and render `{{ item}}` inside it.

```
<ul>
  {{#each items key="@index" as |item| }}
    <li>{{item}}</li> 
  {{/each}}
</ul>
```



Use template variables in a GlimmerJS component

Swift is an exciting and intuitive programming language developed by Apple to be easier to learn than Objective C. It's syntax also more closely resembles JavaScript. Some native libraries you could work with may have been developed with Swift. Let’s look at a couple cases you could run into when trying to work with a Swift based iOS library. In particular, we will be implementing this [Swift 3.0 CocoaPod](https://cocoapods.org/pods/SimplePDF). Also learn how to write files to your app’s document folder using NativeScript’s ‘file-system’ module. 

Convert a Swift library to NativeScript for Angular iOS apps

React Native lets you build mobile apps using only JavaScript. It uses the same design as React, letting you compose a rich mobile UI from declarative components.

react-native

Learn to write components that render differently on iOS and Android, but present the same API. First, we'll use the Platform module to change behavior based on the platform. Then, we'll use the platform-specific file extensions, .ios.js and .android.js, to render platform-specific components.


Writing Platform-Specific Components for iOS and Android in React Native

[GlimmerJS](https://glimmerjs.com/) is a UI component library built by the Ember.js team. It is fast and lightweight and uses a combination of TypeScript and Handlebars to build the components.   

In this lesson we will use the Ember CLI to initialize a new GlimmerJS project.

We will start by installing Ember CLI globally by running `npm install -g ember-cli/ember-cli`.

Next we will use the `ember` command to create our new project by running `ember new egghead-glimmer -b @glimmer/blueprint` . 

When our project is created we `cd` into the project directory and start the development server. We will view the page in the browser and change the base template.

Initialize a project using Glimmer.js

In this lesson, we will start with a list of content from a React Native FlatList that we will then transform into a three-per-row grid.

Display Contents of a React Native FlatList as a Grid

In this lesson, you will learn how to use the `SafeAreaView` component to avoid the sensor cluster (the notch) and home activity indicator on the iPhone X.