From 3948a9186043695501f76684d9fc05a8de47b618 Mon Sep 17 00:00:00 2001 From: Cameron Ball Date: Thu, 26 Mar 2020 01:45:38 +0800 Subject: [PATCH] Adding commentary to share with Moodle --- css/style.css | 204 ++++++++++++++ img/commentary.png | Bin 0 -> 221 bytes index.html | 767 ++++++++++++++++++++++------------------------------- notes.html | 64 ++++- 4 files changed, 580 insertions(+), 455 deletions(-) create mode 100644 css/style.css create mode 100644 img/commentary.png diff --git a/css/style.css b/css/style.css new file mode 100644 index 0000000..2cb4103 --- /dev/null +++ b/css/style.css @@ -0,0 +1,204 @@ +body { + margin: 0px; + font-family: 'Press Start 2P', cursive; + color: white; + text-shadow: + 1px 1px 0 #000; + background-color: #f98012; + background-image: url("../img/tile.png"); + background-repeat: repeat; + background-size: 10%; + image-rendering: crisp-edges; + background-blend-mode: multiply; + font-size: 22px; +} + +.angereyWrap { + position: absolute; + color: #cc0000; +} + +.angerey { + letter-spacing: -20px; + transform: rotate(90deg) scale(1, 1.5); +} + +.thonkingWrap { + position: absolute; +} + +.hljs { + font-family: 'Press Start 2P', cursive; + text-shadow: 2px 2px 0 #000; + font-size: 30px; + overflow: hidden; +} + +h1, h2 { + text-shadow: 2px 2px 0 #000; +} + +.slide-title { + font-size: 40px; + margin: 20px; + text-shadow: 10px 10px 0 #00000069; + text-align: center; +} + +.slide { + margin: 40px; + box-shadow: 10px 10px 0 #00000069; + padding: 20px; + height: 80%; + background: #6187a8e3; +} + +.flexotron { + display: flex; + justify-content: center; + align-items: center; + flex-wrap: wrap; +} + +#cloudguy, #cloudguy2 { + height: 100%; + display: flex; + justify-content: center; + align-items: center; + flex-wrap: wrap; +} + +.cloudguypower { + height: 24%; +} + +#cloudguys { + height: 30%; + width: 100%; + display: flex; + justify-content: space-around; + text-align:center + +} + +#cloudguys img { + height: 100%; +} + +#cloudguys div { + width: 20%; + max-width: 20%; +} + +#cloudguys span { + display: block; + opacity: 0; +} + +#cgquotes, #cloudguy2 > div > div { + font-size: 30px; + text-shadow: 2px 2px 0 #000; +} + +.idk div { + display: flex; + width: 40%; +} + +li { + list-style: square; +} + +img { + image-rendering: optimizeSpeed; /* STOP SMOOTHING, GIVE ME SPEED */ + image-rendering: -moz-crisp-edges; /* Firefox */ + image-rendering: -o-crisp-edges; /* Opera */ + image-rendering: -webkit-optimize-contrast; /* Chrome (and eventually Safari) */ + image-rendering: pixelated; /* Chrome */ + image-rendering: optimize-contrast; /* CSS3 Proposed */ + -ms-interpolation-mode: nearest-neighbor; /* IE8+ */ +} + +.fig { + text-align: center; +} + +#rant .shake-constant, .crazy, .span { + display: inline-block; +} + +#rant .shake-opacity { + color: #f98012; +} + +#rant { + padding: 20px; + height: 80%; + font-size: 14px; +} + +.textbox { + text-align: center; + box-shadow: 10px 10px 0 #00000069; + border: 2px solid black; + background-color: #3f6382; + padding: 5px; +} + +.hljs { + box-shadow: 10px 10px 0 #00000069; + border: 2px solid black; +} + +div[id^="slide-"] { + display: none; +} + +span[class^="code-friends"].on, span[class^="code-friends"].on > span, span[class^="code-friends"].on > span > span { + color: #f98012 !important; +} + +span[class^="promise"].on, span[class^="promise"].on > span, span[class^="promise"].on > span > span, span[class^="promise"].on > span > span > span { + color: #f98012 !important; +} + +.highlight { + color: #f98012; +} + +li { + margin-top: 10px; +} + +.notes { + display: none; +} + +@keyframes swing { + 0%, 100% { transform: rotate(-20deg); } + 20% {transform:scale(.95);} + 50% { transform: rotate(20deg); } + 80% {transform:scale(.95);} +} + +#commentary { + position: fixed; + bottom: 50; + right: 50; + text-align: center; +} + +#commentary img { + height: 100px; + animation: swing 2s infinite ease-in-out; +} + +#commentary img:hover { + height: 120px; + animation: swing 2s infinite ease-in-out; +} + +#commentary a { + color: white; + text-decoration: none; +} diff --git a/img/commentary.png b/img/commentary.png new file mode 100644 index 0000000000000000000000000000000000000000..92d9e4bb50b9bafe4790640af5548305e14199fb GIT binary patch literal 221 zcmeAS@N?(olHy`uVBq!ia0vp@K+MI#1|;*}T{!}zI14-?iy0XBfNZ`aj8nDwq=AC{ zo-U3d8WUS581fx5;Bk!)ICA2E;e<8wmL5<1+-qf6`iwzQDCvn>Vn?n>hsf(p|G4SyYrUC&UnWuI_Th|iM(DZy_OCT!aI#Bfrc z$NG|=*PqXIb-S1RQ%=_HU{%(Ud23>;*7gZo{%BcHl{r7{NJV!*vdxvN57{TpP|Hkv S!XOWH8iS{+pUXO@geCxZFH`ye literal 0 HcmV?d00001 diff --git a/index.html b/index.html index 364e0f6..48c2400 100644 --- a/index.html +++ b/index.html @@ -2,6 +2,7 @@ + @@ -9,184 +10,6 @@ Wide-Eyed Crazy Functional Programming -
@@ -196,11 +19,7 @@
Welcome to the talk!
-
-
    -
  • Thanks for the opporunity to talk about programming with you all
    • -
-
+
=<< Welcome to the Talk Called >>=
@@ -209,15 +28,16 @@
Wide-Eyed Crazy Functional Programming
+
+ Woo! Look at them go! If you throw on this then it's like a 2 hour dance party! +
-
=<< What's up with that Title? >>=
-
-
-
-
    -
  • A few people asked me about the title, so I thought I'd clear up what it means
    • -
+
=<< Just Wait a Sec... >>=
+
+
+ This slide needs to be here to let the confetti settle otherwise the next slide lags even more lol... Just wait til the confetti goes away and continue. +
@@ -236,67 +56,34 @@
Fig 1.1 What most people thing a typical functional programming advocate looks like
+

Wide-eyed Crazy Functional Programmers

    -
  • Regarded as eccentric crazies with wild ideas
    • -
  • Spout nonsense like "monads" every 2 seconds
    • -
  • Often bald
    • +
  • Some people were curious about the title, so I figured I'd clarify what it means - functional programmers have a reputation of...
    • +
      +
    • Being eccentric wide-eyed crazies with wild ideas
      • +
    • Spouting nonsense like "monads" and "functors" every 2 seconds
      • +
    • Being bald
      • +
=<< Obligatory Quote >>=
-
-
-
-
    -
  • Before I get to far in to it, I want to add some framing to the talk
    • -
  • My goal is not to teach you functional programming, my goal is to spark some curiosityt
    • -
-
-
-
-
=<< Obligatory Quote >>=
-
-
If you wish to build a ship, do not divide the men into teams and send them to the forest to cut wood. Instead, teach them to long for the vast and endless sea.
-
-
-
    -
  • Before I get to far in to it, I want to add some framing to the talk
    • -
  • My goal is not to teach you functional programming, my goal is to spark some curiosityt
    • -
  • And I think this obligatory quote (every good talk has a quote) conveys the framework I used when writing these slides
    • -
  • Also we like boats and ships and stuff like that here, so make sense I guess.
    • -
-
-
-
-
=<< Obligatory Quote >>=
If you wish to build a ship, do not divide the men into teams and send them to the forest to cut wood. Instead, teach them to long for the vast and endless sea.

- Some French Guy. Idk. I'm not cultured. I'm Australian.
+

Some Framing

    -
  • Before I get to far in to it, I want to add some framing to the talk
    • -
  • My goal is not to teach you functional programming, my goal is to spark some curiosityt
    • +
  • My goal is not to teach you functional programming, my goal is to spark curiosity
  • And I think this obligatory quote (every good talk has a quote) conveys the framework I used when writing these slides
    • -
  • Also we like boats and ships and stuff like that here, so make sense I guess.
    • -
  • And of course, don't forget attribution. So that everyone knows you're cultured and read important things
    • -
  • With that in mind, don't take any code examples too seriously, they are to demonstrate the big picture idea.
    • -
-
-
-
-
=<< What is this Talk About? >>=
-
-
-
-
    -
  • So what is this talk about?
    • -
  • Let me start by telling you some things it is not about
    • -
  • Which is something you're not supposed to do as an educator but whatever
    • +
  • Also we like boats and ships and stuff like that here, so make sense I guess
    • +
  • I'm not gonna make you build the ship, I'm gonna try make you curious about the sea that is functional programming
    • +
  • With that in mind, don't take any code examples too seriously, they are to demonstrate the big picture idea
-
+
=<< What is this Talk About? >>=

This talk is not about:

@@ -309,64 +96,69 @@
+

Teaching Violation!

    -
  • So what is it about?
    • -
  • When trying to explain to someone why they should learn functional programming, there are many perspectives to try explain it from.
    • -
  • For this discussion, I've settled on a very meta one. Perspective itself.
    • +
  • They say you should never say what something is not when teaching
    • +
  • But screw that, anarchy! Yeah!
-
+
=<< What is this Talk About? >>=
Perspective
+

What It Do, Then?

    -
  • As said, this is not a talk about haskell, it's about viewing programming through different perspectives"
    • -
  • Please ask questions as we go!
    • -
  • Let's start the talk!
    • +
  • So what is it about?
    • +
  • When trying to explain to someone why they should learn functional programming, there are many perspectives to try explain it from.
    • +
  • For this discussion, I've settled on a very meta one. Perspective itself.
-
-
=<< What is Functional Programming? >>=
-
-
-
-
+
=<< What is Functional Programming? >>=
Programming with functions.
+
+

Who could have guessed!

+
-
+
=<< What is Functional Programming? >>=
Programming with functions.

No, really. Everything is a function.
-
-
=<< What is a Function? >>=
-
-
-
+
=<< What is a Function? >>=
A mapping between sets that associates every element of the first set to exactly one element of the second set.
+

Regarding Functions

    -
  • It's important to understand that that's it.
    • -
  • This is different to functions in procedural languages - actually the name "function" is a misnomer in that context. Really they should be called prodedures or subroutines (hence the name procedural)
    • +
  • These aren't like procedural functions - "function" is a misnomer in that context. They are really procedures or subroutines (hence the name procedural)
  • A function is a mapping. It's equivalent to something like an array in PHP. It associates one value to another one
  • In the same way that a PHP array cannot mutate state, a function cannot
    • -
  • What I'm describing are actually pure functions, but for the rest of the talk I'll just be saying "functions"
    • -
  • This has some interesting consequences...
    • +
  • These are called "pure functions", but I'll just say "functions"
    • +
  • Mat asked a question about "impure functions"
    • +
      +
    • An impure function involves side effects. For example: + 
      
+function readFileAndAdd2(string $filePath) : int {
+    $number = file_get_contents($filePath);
+    return $number+2;
+}
      + is impure because it could be called with the same input and give different outputs (if the contents of the file at $filePath change).
      • +
    • I/O can be pure, but that's beyond the scope of this talk (maybe another dev training?)
      • +
-
+
=<< What is a Function? >>=

No equivalent constructs for:

@@ -381,30 +173,29 @@
*In pure functional programming, there are true variables. That is, once you declare the value of a variable, you cannot change it. Contrast this with procedural languages where you can reassign a variable whenever you like.
-
-
-
=<< Huh? >>=
-
+

Consequences

    -
  • And of course this all begs the question....
    • +
  • As a consequence, of having only pure functions, we have no more control structures D:
    • +
  • That raises the question... (go to the next slide xD)
-
-
+
=<< Huh? >>=
Who in their right mind would wanna do that?!
+

Yeah, Who? Crazies, No Doubt

    -
  • You're trying to tell me FP is awesome be because it has ... less features?
    • -
  • This is true, but it makes no difference. You can accomplish anything in FP that you can accomplish in a procedural language
    • +
  • It seems paradoxical, features have been removed, but somehow functional programming is just as good? Maybe better?
    • +
  • How can taking away all the tools we use to write programs be a good thing?
    • +
  • It actually makes no difference. You can accomplish anything in FP that you can accomplish in a procedural language, and gain some cool new superpowers
-
+
=<< Huh? >>=

Why tho?

@@ -417,30 +208,23 @@
+

Learn for Big Brain

    -
  • The best answer I can give is, "learning is good". I think that's something everyone at moodle can agree on
    • -
  • Learning FP is gonna require you to wrestle your brain in to shapes it's never taken before. Which will leave it with the plasticity to learn a greater variety of things you encounter.
    • +
  • Learning functional programming is gonna require you to wrestle your brain in to shapes it's never taken before. Which will leave it with the plasticity to learn a greater variety of things you encounter.
  • It will also make the math/logic part of your brain very buff
    • -
  • As we know, the brain has 3 main cortexes. The passion cortex, the power cortext, and the logic cortex
    • -
  • As programmers we need to engorge mostly the logic cortext, but also the passion cortex - as this is a profession that involves other people.
    • -
  • Communicating about programs written in the functional style is actually easier than the programs written in the procedural style. More on that later
    • -
  • And lets not forget that our very own MoodleNet is written in Elixir. A functional language.
    • +
  • As mentioned, there is no maths in this talk, but if you learn functional programming you will get buff maths brain
    • +
  • And as we know, the brain has 3 main cortexes: The passion cortex, the power cortext, and the maths/logic cortex
    • +
  • For the purposes of programming, we need a buff maths/logic cortext, learning functional programming will make us better programmers in general
-
+
=<< Paradigms >>=
Paradigms
-
-
    -
  • Let's talk about paradigms for a bit
    • -
  • In particular, let's talk about the two most widely used paradigms. Which also happen to be the most at odds
    • -
-
-
+
=<< Paradigms >>=
@@ -463,22 +247,27 @@
  • PHP
  • C
  • Java
    • -
  • DamoScript
    • +
  • BASIC
    • +

    The Big Two

      -
    • So here they are. Declaritive and imperative, and inside those we see sub-paradigms (there are more, for example SQL is declaritive but not functional, and Assembly is imperative but not procedural - although the vast majority of imperative languages are indeed procedural):
      • -
    • And then inside the boxes we see some examples of language that embody that paradigm
      • -
    • For the purposes of this talk it's probably OK to just think of declaritive and functional as interchangeable, and some for imperative and procedural. I'll probably mix them up
      • -
    • So why am I showing this? Well, let's look at this through a different perspective... Some of you might have realised that imperative and declaritive are both words used to describe human language, and that's relevant
      • -
    • Learning a new paradigm is beneficial the same way learning a new human language is
      • +
    • Here are the big two paradigms, and inside those we see sub-paradigms.
      • +
    • And then in those there are some languages that embody that paradigm (there are more places languages can exist, for example SQL is declaritive but not functional, and Assembly is imperative but not procedural)
      • +
    • Marina made a comment that thinking about SQL while reading these slides is helpful - and I think that's true
      • +
        +
      • In SQL you express things in terms of relations, and there are no for loops, while loops, gotos, etc
        • +
      +
    • For this talk it's OK to just think of declaritive and functional as interchangeable, same with imperative and procedural
      • +
    • Foreshaddowing: Imperative and declaritive are both words used to describe human language
      • +
    • Learning a new paradigm is beneficial the same way learning a new human language is. It makes you better at programming and communicating.
    -
    +
    =<< Gramatical Mood >>=
    @@ -509,7 +298,7 @@
    -
    +
    =<< Gramatical Mood >>=
    @@ -522,69 +311,53 @@
    -
      -
    • To make it more concise... here's the smallest definition I can think of
      • -
    • And this applies to programs too. In the functional paradigm we no longer have the "instruction words" - things like, for, while, goto, variable reassignment
      • -
    -
    -
    -
    -
    =<< Big Brain Moment >>=
    -
    -
    -
      -
    • And that brings us to the first of hopefully many "Big Brain Moments"
      • -
    + This is the simplest way I can think to express difference
    -
    +
    =<< Big Brain Moment >>=
    Programming languages ARE human languages.
    -
      -
    • We don't write programs for computers - we write programs for other humans.
      • -
    +

    We don't write programs for computers
    We write programs for other humans

    +
    +
    +
  • Unless your writing machine code or something like that...
    • -
    +
    =<< Why is declaritive mood good? >>=
    -
    +
    +
    Atemporality
    Independant of or unaffected by time.
    +

    I Can See Through Time!

      -
    • But in both cases, it seems like we lose something useful in the declaritive mode. What do we get by giving up these things?
      • +
    • In both the human language case, and the programming case, we give up our "instruction words" (in the case of programming, this is for, while, goto, etc)
    • Surely giving instructions is useful, otherwise how do you do anything?!
      • +
    • Do we get something good in return? Yes! We get atemporality
      • +
        +
      • This is super powerful and quite different from how we normally write programs
        • +
      • When we write in a procedural language we have to think about how things change over time
        • +
    -
    -
    =<< Why is declaritive mood good? >>=
    -
    -
    Atemporality
    -
    -
    -
    -
    =<< Why is declaritive mood good? >>=
    -
    -
    Independant of or unaffected by time.
    -
    -
    -
    +
    =<< Why is declaritive mood good? >>=
    Declarative programs express what they actually do leaving more "brain space" to focus on solving the problem.
    +

    Expressivity

      -
    • A declaritive program expresses its operation in terms of relationships.
      • -
    • In an imperative paradigm, thinking about the program means thinking about changes over time => keeping track of changes
      • -
    • In a declaritive one, thinking about the program means thinking about relationships => look at what the thing is, how it relates to the other thing, and move on
      • +
    • In an imperative paradigm, thinking about the program means thinking about changes over time - which means we have to keep track of state in our head
      • +
    • In a declaritive paradigm, thinking about the program means thinking about relationships - which means we look at what the thing is, how it relates to the other thing, and move on
    -
    +
    =<< To Recap >>=

    Why tho?

    @@ -598,30 +371,16 @@
      -
    • Some problems are simply very difficult to solve in an imperative way.
      • -
    • Especially when we are talking about events that are happening in parallel and may run at different speed/times
      • +
    • Some problems are very difficult to solve in an imperative way.
      • +
    • Especially when talking about events that are happening in parallel and may run at different speed/times
    • In the imperative paradigm, you quite easily come up against data races by virtue of the way the program is expressed
      • +
    • Functional programming takes away entire classes of problems by removing the "instruction words" - no more data races
      • +
    • If you ever used JavaScript before promises were a thing, I'm sure you've felt the pain
    -
    -
    =<< Some Code (Finally) >>=
    -
    -
    -
    -
      -
    • At this point I imagine a lot of you are thinking....
      • -
    -
    -
    -
    -
    =<< Some Code (Finally) >>=
    -
    -
    Enough of this philosophy and linguistics mumbo jumbo, already!
    -
    -
    -
    +
    =<< Some Code (Finally) >>=

    My favourite example

    @@ -642,8 +401,16 @@
    In the declaritive paradigm, this code hangs while this code runs. In the imperative paradigm this code hangs, while this code runs.
    +
    +

    Hot tip!

    +
      +
    • Hover over the "this" words in the text box! Notice that the code which hangs is flipped in each paradigm!
      • +
    • This code is not any specific language. It's one I made up although it looks similar to other languages
      • +
    • The idea is to parse it in the declaritive and the imperative style to see the difference
      • +
    +
    -
    +
    =<< Some Code (Finally) >>=
    @@ -662,8 +429,15 @@
    +
    +

    Reminder!

    +
      +
    • In the declaritive paradigm, = means that two things are one in the same - which leads to a contradiction in our example
      • +
    • In the imperative paradigm (assuming x is defined) there's no problem - we just add 1 to x, then save it back in x
      • +
    +
    -
    +
    =<< Some Code (Finally) >>=
    @@ -672,7 +446,7 @@ }
    -
    +
    Declarative "The repeat of `x` is `x` appended to the repeat of `x`"


    An infinite list of `x`! @@ -684,21 +458,28 @@
    +
    +

    Atemporality

    +
      +
    • Here we are starting to touch on atemporality
      • +
    • The declaritive style does not read the definition as instructions. It's not things happening over time. It just is what it is. It's a list of whatever you pass in repeated forever
      • +
    +
    -
    +
    =<< Big Brain Moment >>=
    Programming languages ARE human languages.
    +

    Recap/Reinforcement

      -
    • Let's take this time to reflect...
    • Imperative tells you what to do
    • Declaritive tells you what things are
    -
    +
    =<< Some Code (Finally) >>=

    Real Haskell code that runs

    @@ -710,13 +491,16 @@ threeFs = take 3 (repeat "f")
      -
    • Let's think about the way this is understood
      • -
    • threeFs is the first three elements in an infinite list of fs - totally fine, makes complete sense
      • -
    • Shame that the function name is "take" but whatever
      • +
    • The first line is the Haskell way of defining the repeat function from before
      • +
    • And we read this as: "threeFs is the first three elements in an infinite list of fs"
      • +
        +
      • And that's totally fine! If you have an infinitely long list of fs then of course you can just take the first 3
        • +
      • It's a but unfortunate that the function to get n elements is called "take" because that's kinda imperative, but whatever
        • +
    -
    +
    =<< Some Code (Finally) >>=

    Real JavaScript code that hangs

    @@ -731,11 +515,12 @@ threeFs = repeat("f").substr(0,3);
      -
    • By contrast, this reads as "First compute an infinite list of fs" - which as we saw before was a problem. And even that human sentence clearly has a problem.
      • +
    • By contrast, this reads as "First compute an infinite list of fs" - which is clearly problematic
      • +
    • It's left as an exercise to the reader to try work out why the x = x + 1 example would hang in Haskell
    -
    +
    =<< Big Brain Moment >>=

    What did declaritive mode give us?

    @@ -747,27 +532,27 @@ threeFs = repeat("f").substr(0,3);
    +

    Big Brain Moment Two!

      -
    • Big brain moment two!
    • How cool is that? Because we can express what things are, we can express an infininte list!
      • +
    • Often when we write programs, we have to worry about things cascading out infinitely, but not in the declaritive paradigm!
    • None of the declaritive version of the program relies on us traking changes anywhere. We just need to know what a thing is and how it relates to another thing
      • +
        +
      • And if that thing happens to be infinite, who cares! That's just what it is
        • +
    -
    +
    =<< Promises >>=
    Promises
    -
      -
    • Let's think about promises...
      • -
    • Seems like an odd tangent but let's go with it
      • -
    • And just as before, I'm gonna break one of the carinal rules of teaching by telling you what promises are not...
      • -
    + Seems like an odd tangent but let's go with it. And just as before, I'm gonna break one of the carinal rules of teaching by telling you what promises are not...
    -
    +
    =<< Promises >>=
    @@ -785,13 +570,13 @@ threeFs = repeat("f").substr(0,3);
      -
    • So there's a lot of misleading information out there about promises
      • -
    • Some people believe that promises "make" things asynchronous, but this isn't true
      • -
    • You can have perfectly synchronous promises, the thing you pass as a callbackto a promise does not get "run in the background" or anything like that
      • +
    • There's a lot of misleading information out there about promises
      • +
    • Some people believe that promises "make things asynchronous", but this isn't true
      • +
    • You can have perfectly synchronous promises, the thing you pass as a callback to a promise does not get "run in the background" or anything like that
    -
    +
    =<< Promises >>=

    The real promises

    @@ -812,8 +597,14 @@ threeFs = repeat("f").substr(0,3);
    +
    +
      +
    • The "value" is where the asynchronous part comes in
      • +
    • That value may become available later, but it may just be there the entire time as well
      • +
    +
    -
    +
    =<< Promises >>=

    Terminology/syntax recap

    @@ -835,13 +626,14 @@ threeFs = repeat("f").substr(0,3);
    +

    Regarding Composition

      -
    • Shoutout Mat about arrow functions
      • -
    • A quick note on composition: So far you may have come across function composition. There's lots of different kinds of composition, but function composition is incredibly common, especially in programming. However in the example we are talking the composition of promises. In the sense that we combine to promises, and get another promise.
      • +
    • You may have come across function composition. There's lots of different kinds of composition, but function composition is incredibly common, especially in programming. But we'll talk about the composition of promises.
      • +
    • In both cases the idea is the same. Function composition lets you combine two functions in to another function. Promise composition lets you combine two promises in to another promise
    -
    +
    =<< Promises >>=

    Promise composition

    @@ -862,12 +654,25 @@ threeFs = repeat("f").substr(0,3);
    +

    Hot Tip!

      -
    • Depending on how we go for time, I hope to discuss composition after this section.
      • +
    • Hover over "one", "two", and "three" to see the promises highlighed
      • +
        +
      • The first one is all by itself
        • +
      • The second one is the composition of the first one using the composition rule (the function passed to `then`)
        • +
      • The third one is the composition of the second one using the composition rule (the function given to `then`)
        • +
      +
    • The `then` method accepts a function which:
      • +
        +
      • Will be passed the previous promise's wrapped value
        • +
      • Causing it return the next promise
        • +
      • Which will give its wrapped value to the function passed to the next `then` method
        • +
      +
    • It's very important to realise that we are passing a function to then, not a value, it's not actually doing anything when we set up the promise chain
    -
    +
    =<< Promises >>=

    OK great but who cares?

    @@ -882,8 +687,15 @@ threeFs = repeat("f").substr(0,3);
    +
    +

    Pls Note

    +
      +
    • Since this is JavaScript, you can mutate state in the functions that are passed to "then"
      • +
    • But that's beside the point I'm trying to demonstrate, and you shouldn't really do that anyway
      • +
    +
    -
    +
    =<< Promises >>=
    @@ -895,12 +707,10 @@ threeFs = repeat("f").substr(0,3);
    -
      -
    • This sure is starting to sound familiar.
      • -
    + This sure is starting to sound familiar.
    -
    +
    =<< Big Brain Moment >>=

    Woah!

    @@ -914,14 +724,30 @@ threeFs = repeat("f").substr(0,3); >>= (\x -> Right (x ++ " and finally here!"))
    +

    Hot Tip!

      -
    • Big brain time again
      • -
    • It does not matter what order the promises resolve in, the final promise will always be resolved with "We start here..."
      • -
    • In this specific example, there is nothing asynchronous happening, but it's not much work to adapt it so there is. I just wanted to really highlight the similarities with haskell
      • +
    • Hover over the language elements to see how they pair up in each language!
      • +
    • Promises are very similar to a type in Haskell called "Either". "Either" can be instantiated with `Right` or `Left` which correspond to `resolve` and `reject`, respectively
      • +
    • It does not matter what order the promises resolve in, the final promise will always be resolved with "We start here then get here and finally here"
      • +
    • Bas made a good point that when looking at the calls to "then" you think about the things happening one after another.
      • +
        +
      • While that's true, what `then` does is describe the way to combine the results once they arrive
        • +
      • The "We start here" result could come from a web request that takes 10 seconds, whereas the other strings could resolve instantly, but the final promise would still be "We start here then get here and finally here" - even though that was not the order we got the results
        • +
      • Be careful, the `x` in each "then" call is not the same `x`. It's part of the function which is being passed to then, which means it is in a completely different scope. The purpose of the function is to describe what you want to happen
        • +
      • It's hard to untwist your brain from thinking about promises in the procedural way - this is what I meant by "wrestling your brain in to new shapes" :)
        • +
      +
    • In this example, there is nothing asynchronous happening, but it's not much work to adapt it so there is. I mainly wanted to really the similarities with haskell
      • +
    • How cool is it that these look so similar?
      • +
    • As mentioned, in the JavaScript version, you could mutate something inside the `then` functions - but this would absolutely lead to data races
      • +
    • In Haskell, you cannot do that, which is one of the ways it stops you shooting yourself in the foot
      • +
    • Noel made an interesting comment that JavaScript added async/await as "syntactic sugar" to make this kind of code look more imperative.
      • +
        +
      • And I was pleased to say that the exact same thing exists in Haskell :)
        • +
    -
    +
    =<< Big Brain Moment >>=

    Woah!

    @@ -937,6 +763,7 @@ threeFs = repeat("f").substr(0,3); >>= (\x -> Right (x ++ " and finally here!"))
    +

    You Were Doing FP all Along!

    • Likewise, we can put a failure anywhere in the chain. It doesn't matter if the failure happens first, last, or anywhere in between. The result is always a failed promise of "Oh noes!"
    • So, if you've ever used promises, you've been doing declaritive style programming without even realising it!
      • @@ -946,26 +773,25 @@ threeFs = repeat("f").substr(0,3);
    -
    +
    =<< Composition >>=
    Composition
    +

    The section on composition!

      -
    • Let's think about composition...
      • -
    • Mat touched on function composition briefly in his talk
      • -
    • I wantto talk about it in a more abstract sence. I think the idea of composition is so important that it deserves its own little bit
      • +
    • This gets its own section because it is not just important to programming, it's important to life in general
    -
    +
    =<< Composition >>=
    -
    +
    =<< Composition >>=
    @@ -974,7 +800,7 @@ threeFs = repeat("f").substr(0,3);
    -
    +
    =<< Composition >>=
    @@ -984,7 +810,7 @@ threeFs = repeat("f").substr(0,3);
    -
    +
    =<< Composition >>=
    @@ -995,29 +821,31 @@ threeFs = repeat("f").substr(0,3);
    +

    Coins and pipes!

      -
    • RETURN LATER: Come back to this slide after looking at the next one
      • -
    • We want to go from A to C - but maybe that's really hard
      • -
    • Perhaps someone worked out how to go from A to B, and someone else worked out how to go from B to C
      • -
    • Well, if we're in a system where composition is possible, then we just solved the problem!
      • -
    • This is the natural way people solve problems
      • -
    • RETURN EVEN LATER: After returning from the end slide: explain how side effects break composition
      • +
    • Keep in mind the the composition of A->B and B->C is not gauranteed to exist!
      • +
    • I'm using coins and pipes to demonstrate, but the coins and pipes could be anything... Functions, promises, etc.
      • +
    • Stop reading here!! After reading the next slide come back to this one pls :)
      • +
        +
      • We want to go from A to C - but maybe that's really hard (I accidentally illustrated that in the diagram! The pipe from A to C is really long! But the A->B->C route is short!)
        • +
      • Perhaps someone worked out how to go from A to B, and someone else worked out how to go from B to C
        • +
      • If we're in a system where composition is possible, then we just solved the problem!
        • +
      • This is the natural way people solve problems
        • +
          +
        • We like to break things up in to small chunks and solve the small bits and then put them back together
          • +
        • You probably do it when you're writing software at Moodle!
          • +
        +
      +
    • Stop reading here!! After getting to the "What's this got to do with FP" slide, come back pls :)
        • -
      • Maybe A->B has a side effect, this means when we call B->C with the result from A->B, it may not be the same as calling A->C. The point of composition is that the outcome should be the same.
        • -
      • Don't talk about it unless needed: Referential transparency. f(a, b) => return print(a + b) + print(a + b); is not the same program as f(a,b) => c = print(a + b); return c + c;
        • +
      • Maybe A->B has a side effect, this means when we call B->C with the result from A->B, it may not be the same as calling A->C. The point of composition is that the outcome of calling both should be indistinguishable.
        • +
      • Procedures in imperative languages (what most programmers call functions) are a short sighted attempt at composition, we wanted a way to break things up, and sure... You can put functions together in imperative languages and it kinda works, but it's not the same as true composition
        • +
      • In the functional paradigm, composition is gauranteed because functions cannot have side effects
      -
    • Procedures in imperative languages are a short sighted attempt at composition
      • -
    • In the functional paradigm, composition is gauranteed because functions cannot have side effects
    -
    -
    =<< Composition >>=
    -
    -

    OK great but who cares?

    -
    -
    -
    +
    =<< Composition >>=

    OK great but who cares?

    @@ -1025,11 +853,11 @@ threeFs = repeat("f").substr(0,3);
      -
    • Go back to the full composition diagram
      • +
    • Remember to go back to the previous slide!
    -
    +
    =<< Composition >>=

    Examples

    @@ -1045,22 +873,20 @@ threeFs = repeat("f").substr(0,3);
    • The pyramids were build by having loads of peope work in parallel
      • -
    • Same with the LHC. I don't believe there is a single person in the world who fully understands it
      • -
    • Instead of having one chef "make a burger" - staff make individual parts of the burger and compose it together - I think McDonald's was the first place to do this
      • +
    • Same with the LHC - I don't believe there is a single person in the world who fully understands it
      • +
        +
      • But with lots of people working together we can create this amazing thing which recreated conditions similar to that at the near-instant our universe began!
        • +
      • That's pretty amazing
        • +
      +
    • And with McDonald's - Instead of having one chef "make a burger" staff make individual parts of the burger and compose it together (I think McDonald's was the first place to do this)
      • +
        +
      • You can make a lot more burgers that way!
        • +
    • And Moodle does it too! Let's think about how we tackle projects...
    -
    -
    =<< Composition >>=
    -
    -
    -
      -
    • So... do we get one mega awesome dev to bash out features?
      • -
    -
    -
    -
    +
    =<< Composition >>=
    @@ -1070,13 +896,13 @@ threeFs = repeat("f").substr(0,3);
      +
    • Do we get one ultimate developer to smash out the whole thing?
    • idk about you, but I wouldn't be keen to work with this person
      • -
    • There's a thing in dev called the 10x developer, and it is something that simply does not exist
      • -
    • The correct way to work on software is of course...
      • +
    • Check out this story
    -
    +
    =<< Composition >>=

    No, you get friends to take a piece and help!

    @@ -1108,27 +934,34 @@ threeFs = repeat("f").substr(0,3);
      -
    • As a team!
      • +
    • Of course not, we do it as a team!
    • This is why it's worth spending the time to plan things and figure out how to "chop up" the work
      • -
    • We need to make sure we are chopping the problem up in to pieces that can be composed together later
      • +
    • It's very important to make sure the way we "chop" the problem allows the solutions to be composed together later
    -
    +
    =<< Composition >>=
    Composition is nature's greatest hack
    +

    Why was all that relevant?

    • My goal here was to try and convince you that composition really is important and is fundamental to the way we think
      • -
    • Humans are amazing for our ability to break down problems in to manageable chunks and then compose them together.
      • +
    • Humans are amazing for our ability to break down problems in to manageable chunks and then compose them together - I don't think other animals do that
      • +
        +
      • Which is probably a big part of how we dominated this planet so fast
        • +
    • At its core, composition is about relationships, and building complexity by combining them. Hey, wasn't the whole declaritive thing about relationships?
      • -
    • And that brings me to my final point
      • +
        +
      • At the beginning I said in the declaritive paradigm we express things in terms of relationships...
        • +
      +
    • And that brings me to the final point
    -
    +
    =<< Composition >>=

    What's this got to do with FP?

    @@ -1138,20 +971,42 @@ threeFs = repeat("f").substr(0,3);
      -
    • Go back to the composition slide and explain that in FP the composition is gauranteed to exist, while in other paradigms it is not
      • -
    +
  • Functional programming is great because it gaurantees composition
    • +
  • In a procedural language, things don't necessarily compose
    • +
  • The building blocks we use for our compositions matter (whether it be programs, teamwork, whatever)
    • +
      +
    • The restrictions that the funcational paradigm places on you means you cannot work with blocks that do not compose
      • +
    • So by taking away our "instruction words" we have gained another powerful tool: composition
      • +
    • Remember that slide I said to go back to? Do that now pls! Then comeback here cos there's a few more slides after this one.
      • +
    -
    +
    =<< Closing Notes >>=
    -
    +
    +

    Very big brain thoughts:

    +
    +

    Functional programming is awesome because:

    +
    +
      +
    • By taking away convenient, but dangerous tools we are left with tools that are incredibly powerful, but more difficult to wield
      • +
    • In particular
      • +
        +
      • Atemporality: The ability to express things independant of time
        • +
      • Infinity: Infinite recursion can't stop you now!
        • +
      • Composition: The fundamental way humans solve problems is available to you at all times
        • +
      +
    +
    +
    +
      -
    • I'd like to finish this talk with some food for thought...
      • +
    • New super powers!
    -
    +
    =<< Closing Notes >>=

    Very big brain thoughts:

    @@ -1177,7 +1032,7 @@ threeFs = repeat("f").substr(0,3);
    -
    +
    @@ -1187,9 +1042,28 @@ threeFs = repeat("f").substr(0,3);
    • If nothing else, I really hope you're now just a little bit more curious about functional programming
      • -
    • And even though functional programing is not incredibly relevant to our roles just now, learning more about it will make you a better programmer
      • +
    • And even though functional programing is not incredibly relevant to our roles just now, learning more about it will make you a better programmer, and that benefits everyone :)
    • If you have any questions please message me, I'm always happy to talk about this stuff
    • I'd suggest going to the pub to talk about it, but, well, we can't do that just now
      • +
    • Bas mentioned that Haskell has a reputation for being academic
      • +
        +
      • It's true that it was initially written for academic purposes
        • +
      • But that was over 30 years ago and it has now evolved in to something that is usable in production
        • +
      +
    • Bas also asked about real world Haskell applications, here's a few I know of
      • +
        +
      • Facebook's spam filter is written in Haskell (and they even contributed back to the Haskell project)
        • +
      • Loads of banks use it for the reason that it's hard to write software that "goes wrong" in Haskell
        • +
      • Target use a program written in Haskell to optimise supply chains
        • +
      • NASA!
        • +
      +
    • And here's some resources!
      • +
        +
      • https://haskellbook.com/
        • +
      • http://learnyouahaskell.com/introduction
        • +
      • Me! I'm no master, but I'll always be happy to talk about Haskell and functional programming - send me a mesage!
        • +
      +
    • And remember, you can't spell "Functional Programming" without "Fun"!
    @@ -1242,10 +1116,12 @@ threeFs = repeat("f").substr(0,3); document.onkeydown = checkKey; notes = document.querySelectorAll('#slide-' + currentSlide + ' .notes'); - if(!!notes[0]) { + if(!!notes[0]) {1 bc.postMessage(notes[0].innerHTML); } + numSlides = document.querySelectorAll('div[id^="slide-"]').length; + function checkKey(e) { e = e || window.event; @@ -1279,7 +1155,8 @@ threeFs = repeat("f").substr(0,3); } - if (currentSlide == 1 || currentSlide == 63) { + document.location.hash = currentSlide; + if (currentSlide == 1 || currentSlide == numSlides) { confetti.start(); } else { confetti.stop(); diff --git a/notes.html b/notes.html index 6484aeb..1145af2 100644 --- a/notes.html +++ b/notes.html @@ -1,23 +1,54 @@ + + + + + + Wide-Eyed Crazy Functional Programming - Speaker Notes + -
    - hello +
    +
    =<< Speaker Notes >>=
    +
    +
    +
    +
    + +
    Hey! It's me again! Move this tab in a new window and as you go through the slides (unless your screen is small because I doubt the slides resize well), there'll be commentary here!
    +
    +
    +
    +
    -- 2.11.0