Slides: Features of Kotlin I find exciting

Submitted by Robert MacLean on Wed, 08/22/2018 - 09:00
A few weeks ago I was honoured to speak at the first [Developer User Group](http://developerug.org.za) meetup in Cape Town, and it is no surprise I am sure, that I spoke for about 15min on what my favourite features in Kotlin are. Thank you to all who attended and if you are looking for the slides, they can be found below! They look broken, but this is because SlideShare can't deal with animation so be sure to download them to check them out! If you are interested in more Kotlin talks, I will be speaking next week at the [Facebook Developer Circle](https://www.facebook.com/groups/DevCCapeTown/permalink/271973763352726/?__xts__[0]=68.ARDiVSmSEqPmXEKsckg5iYjDpkjPp2KYY575vbAtrnV4FszfM9aPgX95nytnTNv3pxoGzSKNN8cfr1VRl-BiWI28ubEyRSQ5CIFveR0Uj_SsLY-h0BBhj99tSfwezvvIQY-QMved0W5U&__tn__=-R) for over an hour giving an introduction to Kotlin. It is going to be a great session, I am biased though, so I do hope you join me!

Learning Kotlin: Looking at the In Operator & Contains

Submitted by Robert MacLean on Tue, 08/21/2018 - 09:00
**More Information** * This is the 22nd post in a multipart series. If you want to read more, see our [series index](/learning-kotlin-introduction) * The code for this can be found [here](https://github.com/Kotlin/kotlin-koans/blob/master/src/iii_conventions/n26InRange.kt)
One of my absolute favourite features in Kotlin are [ranges](https://kotlinlang.org/docs/reference/ranges.html). You can easily go `1..10` to get a range of numbers from one to ten. In addition, so much of the way I find I want to work with Kotlin is around working with collections like lists and arrays. With all of those, we often want to know when something exists inside the range or the collection and that is where the `in` operator comes in. In the following example we use the `in` operator to first check for a value in an array, then in a range, then a substring in a string; each example below will return true.
  1. val letters = arrayOf("a", "b", "c", "d", "e")
  2. println("c" in letters)
  3.  
  4. println(5 in 1..10)
  5.  
  6. println("cat" in "the cat in the hat")
Naturally, Kotlin lets us add this to our own classes too. The example from the Koans starts with a class which represents a range of dates.
  1. class DateRange(val start: MyDate, val endInclusive: MyDate)
We then add an operator function named `contains` which checks if the value provided falls in between the two dates of the class:
  1. class DateRange(val start: MyDate, val endInclusive: MyDate) : Iterator<MyDate> {
  2.     operator fun contains(d: MyDate) = start <= d && d <= endInclusive
  3. }
With this new function we can write our own `in` statement, for example:
  1. fun checkInRange(date: MyDate, first: MyDate, last: MyDate): Boolean {
  2.    return date in DateRange(first, last)
  3. }

The security risk that is the humble link in your webpages

Submitted by Robert MacLean on Fri, 08/17/2018 - 09:00
tl;dr: When adding the `target` attribute to an `a` element which takes you to a property you do not own, you _must_ add `rel="noopener noreferrer"`. # Info When you open a link using `target`, for example in a new tab (`target="_blank"`), the browser may, not done universally but Firefox & Chrome both do it, set the `window.opener` of the new tab to be the original window. This means that the new tab can access some of the info from the original window/tab. If it is on the same domain then that is a lot, including cookies and content. If it is on a different domain then [same origin policy](https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy) will protect that information, though some things are still available. # Attack Vectors These attack vectors are very targeted and don’t represent a major risk IMHO but at the same time, the cost of doing this is less than the risk so it is a recommendation from me. ## Same Domain It is not uncommon for a single domain to have pieces built by multiple teams, especially as web components get better adoption so a vulnerability in any team contributing to the content now has the potential to impact all teams. For example: https://badsite.com/login.html is built by teamA and has a simple login to the backend. https://badsite.com/products.html is built by teamB and is a public site listing products. If the login had a link to products which opened in a new tab then all JS in products can manipulate the login page, for example by silently injecting code which sends the login details to the attacker. This example is also a good reason to embrace [sub-resource integrity](https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity), especially if you are using a CDN for JS, CSS etc... It is also possible to use [document.domain](https://developer.mozilla.org/en-US/docs/Web/API/Document/domain) to get increased access to super domains; though things like cookies are still not accessible since the change will have been detected. ## Different Domain In this scenario, the data is really locked down though there are two possible attack vectors here. ### Location Changes The location of the parent window/tab can be changed. This could allow an attacker to redirect the original window/tab to a page which has a vulnerability in it or in a targeted attack, it could open to a page that looks the same. For example: You open a link from your bank's website to a 3rd party. That 3rd party has a piece of JS (either intentional or unintentional, for example, a compromised CDN resource) which checks the location and sees it is your bank and changes it to a phishing site. You go back to the tab, expecting it to be your bank and log in and have compromised your credentials. ### Postmessage [postmessage](window.postMessage) is an API which allows pages to communicate with each other, even across different domains. If `postmessage` has been used on the parent and contains a vulnerability that could allow a new page to gain additional privileges. # Solution Add `rel="noopener noreferrer"` to your links to prevent `window.opener` from being set unless you *trust* the property you are linking to.

Learning Kotlin: Invoke

Submitted by Robert MacLean on Thu, 08/16/2018 - 09:00
**More Information** * This is the 21st post in a multipart series. If you want to read more, see our [series index](/learning-kotlin-introduction)
Today we tackle a weird operator, `invoke` which lets an instance of a class have a default function - which I am not sure I've ever seen any language do. So let us frame this with a simple example, we have a config class which returns the configuarion for something:
  1. class Config {
  2.     fun get():String {
  3.         // do stuff
  4.         return "stuff"
  5.     }
  6. }
  7.  
  8. fun main(args: Array<String>) {
  9.     val config = Config()
  10.     println(config.get())
  11. }
Now, in our world maybe `get` is the primary use, so we can actually make it that the _instance_ config (line 9) can be called to get it:
  1. class Config {
  2.     operator fun invoke(): String {
  3.         return this.get();
  4.     }
  5.  
  6.     private fun get():String {
  7.         // do stuff
  8.         return "stuff"
  9.     }
  10. }
  11.  
  12. fun main(args: Array<String>) {
  13.     val config = Config()
  14.     println(config())
  15. }
Note that we add a new operator (line 2), and that calls the private get; it didn't need to be private but I thought let us have this be cleaner, and now on line 14 we can just call the instance itself. Now, you may be thinking... nice but so what saving a few keystrokes isn't too awesome. Well, invoke can return anything, including itself which opens up something crazy.
  1. class Config {
  2.     var count = 0;
  3.     operator fun invoke(): Config {
  4.         count++
  5.         return this
  6.     }
  7. }
  8.  
  9. fun main(args: Array<String>) {
  10.     val config = Config()
  11.     config()()()()()()()()()()
  12.     println("config was called ${config.count} times")
  13. }
This will print out `config was called 10 times`. That is getting more interesting, so let us ramp up another level and pass parameters to `invoke`:
  1. class Config {
  2.     var word = ""
  3.     operator fun invoke(s: String): Config {
  4.         word += s
  5.         return this
  6.     }
  7. }
  8.  
  9. fun main(args: Array<String>) {
  10.     val config = Config()
  11.     config("R")("o")("b")("e")("r")("t")
  12.     println(config.word)
  13. }
While I do not know yet where I would use this myself, I do use invoke all the time... since it is what makes lambdas possible in Kotlin as when we create a lambda we get an object which is invoked with well... invoke.

Learning Kotlin: The For Loop

Submitted by Robert MacLean on Wed, 08/15/2018 - 09:00
**More Information** * This is the 20th post in a multipart series. If you want to read more, see our [series index](/learning-kotlin-introduction)
Kotlin has two loops, `while` and `for`. When I started I was like, "yup, I know those..." - except I didn't. `while` works the way I expected it would but `for` it is something else. First Kotlin does not have a traditional `for` loop, eg `for (var i =0;i< max; i++)`... the `for` loop in Kotlin is closer to the iterator `foreach` loop in C#. ## Basic Let's start with the basics, how do I run a loop, say 10 times where we print out `0, 1, 2, 3, 4, 5, 6, 7, 8, 9`:
  1. fun main(args:Array<String>) {
  2.     for(i in 0..9) {
  3.         println(i)
  4.     }
  5. }
In this, we use a [ClosedRange](https://kotlinlang.org/api/latest/jvm/stdlib/kotlin.ranges/-closed-range/index.html) (0..9) to state the start and end of the loop. This would be the same as `for (var i=0; i< 10; i++)`. Now, normally we want to loop over an array of items, so we can do this in two ways. First the equivalent of the C# for iterator/JS `for of`:
  1. fun main(args:Array<String>) {
  2.     val a = arrayOf("The","Quick","Brown","Fox")
  3.     for(i in a) {
  4.         println(i)
  5.     }
  6. }
and if we do the older style of using a normal `for` loop and using the index we have:
  1. fun main(args:Array<String>) {
  2.     val a = arrayOf("The","Quick","Brown","Fox")
  3.     for(i in 0 until a.size) {
  4.         val value = a[i]
  5.         println(value)
  6.     }
  7. }
What is awesome in the above is the Range, rather than having the _inclusive_ lower and _inclusive_ upper bounds of the `..` range we using the keyword `until` which gives us an _exclusive_ upper bound. Kotlin is all about helpers, and last time we looked at [destructuring](/learning-kotlin-destructuring) so it shouldn't be a surprise we can use that to have BOTH the index and the value in the `for` loop.
  1. fun main(args:Array<String>) {
  2.     val a = arrayOf("The","Quick","Brown","Fox")
  3.     for((i, value) in a.withIndex()) {
  4.         println("$i is $value")
  5.     }
  6. }
## Extras The `for` loop has two additional options worth knowing; the first is `downTo` which loops from largest to smallest. This example which print `4321`):
  1. for (i in 4 downTo 1) print(i)
The second is `step` which allows you to control how many steps to take when moving to the next item, for this example we will get `42`:
  1. for (i in 4 downTo 1 step 2) print(i)
## Operator Adding support for this to our own classes is trivial, we merely need to add the interface `Iterator` to our class. This adds two methods, ` fun next():T` which should return the next value in the collection and `fun hasNext():Boolean` which should return true if there is another value available. Let us look at doing this with a class of prime numbers but for our example, we will add one condition since there are infinite primes we will have a top bound so it eventually ends - this is stored in the `maxToHunt` variable. In the code our `next` function not only returns the next value, it calculates the NEXT NEXT value too which lets us set if there are more primes left if `next` is called again.
  1. class PrimeNumbers : Iterator<Int> {
  2.     var currentPrime = 1;
  3.     val maxToHunt = 100;
  4.     var morePrimesToFind = true;
  5.  
  6.     override fun next():Int {
  7.         val result = this.currentPrime;
  8.  
  9.         this.currentPrime += 1;
  10.         while(this.currentPrime < this.maxToHunt) {
  11.             var primeFound = true
  12.             for(divisor in this.currentPrime-1 downTo 2) {  
  13.                 if (this.currentPrime % divisor == 0) {
  14.                     this.currentPrime += 1
  15.                     primeFound = false
  16.                     break
  17.                 }
  18.             }
  19.  
  20.             if (primeFound) {
  21.                 break
  22.             }
  23.         }
  24.  
  25.         this.morePrimesToFind = this.currentPrime < this.maxToHunt
  26.         return result
  27.     }
  28.  
  29.     override fun hasNext() = this.morePrimesToFind
  30. }
  31.  
  32. fun main(args:Array<String>) {
  33.     for (i in PrimeNumbers()) {
  34.         println("$i is prime")
  35.     }
  36. }

Learning Kotlin: Destructuring

Submitted by Robert MacLean on Tue, 08/14/2018 - 09:00
**More Information** * This is the 19th post in a multipart series. If you want to read more, see our [series index](/learning-kotlin-introduction)
Learning a new language seems is an experience you do to 1. change jobs 1. cause your boss made you do it 1. cause you are a nerd The thing I forget each time I learn a new language is that the act of learning a new language helps me be a better software developer in my own primary language (the secret fourth option). Going through Kotlin has been a similar experience, and nothing jumped out more than object destructuring. The simple use for object destructuring is to be able, in a single line and assign multiple variables from an object. Let's look at this example:
  1. data class Person(val firstName: String, val surname: String, val age: Int)
  2.  
  3. fun name(person: Person) {
  4.     println("Hi ${person.firstName}")
  5. }
  6.  
  7. fun name2(person: Person) {
  8.     println("Hi ${person.firstName} ${person.surname}")
  9. }
  10.  
  11. fun main(args:Array<String>) {
  12.     val frank = Person("Frank", "Miller", 61)
  13.     val alan = Person("Alan", "Moore", 64)
  14.  
  15.     name(frank)
  16.     name2(frank)
  17.     name(alan)
  18.     name2(alan)
  19. }
In each of the `name` and `name2` I am working with the `Person` object but all I want are the names. I never care about the age of the people. We could add a function now, which pulls out just the strings we want and modify everything else to work with JUST the data it needs,
  1. data class Person(val firstName: String, val surname: String, val age: Int)
  2.  
  3. fun name(firstName: String) {
  4.     println("Hi $firstName")
  5. }
  6.  
  7. fun name2(firstName: String, surname: String) {
  8.     println("Hi $firstName $surname")
  9. }
  10.  
  11. fun print(person: Person) {
  12.     val (firstName, surname) = person
  13.     name(firstName)
  14.     name2(firstName, surname)
  15. }
  16.  
  17. fun main(args:Array<String>) {
  18.     val frank = Person("Frank", "Miller", 61)
  19.     val alan = Person("Alan", "Moore", 64)
  20.  
  21.     print(frank)
  22.     print(alan)
  23. }
Line 12 is the magic, that is the *Object Destructuring*. Rather than having two lines where we assign a variable to `firstName` and `surname` we can assign them both in one line so long as they are wrapped in parenthesis and match the names of the properties of the object. So, why is this useful for other languages? Cause in JavaScript you have the same thing! The only difference is `{` and `}` rather than parenthesis and since learning it in Kotlin I've found that I use it in my main more too.

VS Code Extension of the Day: Paste JSON as code

Submitted by Robert MacLean on Fri, 08/10/2018 - 09:00
**More Information** * This is the 8th post in a multipart series. If you want to read more, see our [series index](/vs-code-extension-day)
You have some data in JSON. You want a class to work with it in your TypeScript, Python, Go, Ruby, C#, Java, Swift, Rust, Kotlin, C++, Flow, Objective-C, JavaScript, Elm code or you want JSON Schema. What do you do? You could do it by hand, or you get this extension which does it for you. And if you don’t use VSCode (why are you here), they also have [a website](https://app.quicktype.io) which can do this for you too. [Learn more and download it](https://marketplace.visualstudio.com/items?itemName=quicktype.quicktype)

VS Code Extension of the Day: Settings Sync

Submitted by Robert MacLean on Wed, 08/08/2018 - 09:00
**More Information** * This is the 7th post in a multipart series. If you want to read more, see our [series index](/vs-code-extension-day)
Settings sync is _the first_ extension I always install as it allows me to restore my settings AND extensions. It uses GitHub gists to store the config, so you have a slightly annoying setup process initially but once done, each time you change a setting or extension it updates it to the gist. Then when you get a new install, it pulls down the settings and installs all the extensions you had and you can get everything setup really easily and quickly. [Learn more and download it](https://marketplace.visualstudio.com/items?itemName=Shan.code-settings-sync)

VS Code Extension of the Day: Editor Config

Submitted by Robert MacLean on Tue, 08/07/2018 - 09:00
**More Information** * This is the 6th post in a multipart series. If you want to read more, see our [series index](/vs-code-extension-day)
If you work in a team where choice is important, you may find everyone has a different editor. Today our team uses VSCode, Atom & IntelliJ. Editor Config is a set of extensions for many editors which tries to unify things like tab vs. spaces, trailing spaces, empty lines at the end etc… Think of this as your editor linting as you go. Unfortunately, support is limited for what can be done, but a lot of editors and IDEs are supported. [Learn more and download it](https://marketplace.visualstudio.com/items?itemName=EditorConfig.EditorConfig)

VS Code Extension of the Day: Dracula Official

Submitted by Robert MacLean on Mon, 08/06/2018 - 09:00
**More Information** * This is the 5th post in a multipart series. If you want to read more, see our [series index](/vs-code-extension-day)
So not an extension so much as a theme, Dracula is a great dark theme for Code. It is a little more playful in its colours too which is a plus but what makes it stand out is the [Dracula community](https://draculatheme.com/) There are tons of extensions to add Dracula to everything. I have my slack, terminal.app and IntelliJ all configured as well. It is really great to have the consistency everywhere. [Learn more and download it](https://marketplace.visualstudio.com/items?itemName=dracula-theme.theme-dracula)