good Monday morning today we’re going to
good Monday morning today we’re going to take a look at observable which is a
service that provides interactive
service that provides interactive JavaScript playbooks with observable
JavaScript playbooks with observable
JavaScript playbooks with observable dependencies it’s a various show it to
dependencies it’s a various show it to
dependencies it’s a various show it to you to be honest eyes and then PJs and
you to be honest eyes and then PJs and
you to be honest eyes and then PJs and you are watching function
[Music]
[Music] in case you are wondering why I am
in case you are wondering why I am
in case you are wondering why I am wearing a hat it’s because I live in
wearing a hat it’s because I live in
wearing a hat it’s because I live in Sweden and right now in Sweden things
Sweden and right now in Sweden things
Sweden and right now in Sweden things are insanely cold like so cold that you
are insanely cold like so cold that you
are insanely cold like so cold that you get angry so cold I actually have a
get angry so cold I actually have a
get angry so cold I actually have a heater like what’s it called a space
heater like what’s it called a space
heater like what’s it called a space heater in the in my little studio here
heater in the in my little studio here
heater in the in my little studio here but I can’t keep it running while I’m
but I can’t keep it running while I’m
but I can’t keep it running while I’m recording so I like I’m covering myself
recording so I like I’m covering myself
recording so I like I’m covering myself with textiles all right so what is
with textiles all right so what is
with textiles all right so what is observable if you are familiar with
observable if you are familiar with
observable if you are familiar with ipython playbooks then it’s basically
ipython playbooks then it’s basically
ipython playbooks then it’s basically that except that it’s in JavaScript of
that except that it’s in JavaScript of
that except that it’s in JavaScript of course and it’s hosted software is a
course and it’s hosted software is a
course and it’s hosted software is a service so you don’t need to sit and
service so you don’t need to sit and
service so you don’t need to sit and mess with setting it up and it’s it also
mess with setting it up and it’s it also
mess with setting it up and it’s it also has is aware of its dependencies and
has is aware of its dependencies and
has is aware of its dependencies and will dynamically recalculate itself when
will dynamically recalculate itself when
will dynamically recalculate itself when a dependency has changed which has huge
a dependency has changed which has huge
a dependency has changed which has huge huge implications for for the entire
huge implications for for the entire
huge implications for for the entire playbook system and makes it so much
playbook system and makes it so much
playbook system and makes it so much more powerful than ipython playbook ever
more powerful than ipython playbook ever
more powerful than ipython playbook ever since I tried ipython playbook many
since I tried ipython playbook many
since I tried ipython playbook many years ago I have wanted this specific
years ago I have wanted this specific
years ago I have wanted this specific product and I am so happy that it’s
product and I am so happy that it’s
product and I am so happy that it’s finally created and it’s amazing and
finally created and it’s amazing and
finally created and it’s amazing and it’s going to be huge this is not a
it’s going to be huge this is not a
it’s going to be huge this is not a sponsored video they have not even asked
sponsored video they have not even asked
sponsored video they have not even asked me to make this this is just a product
me to make this this is just a product
me to make this this is just a product that I am incredibly excited about all
that I am incredibly excited about all
that I am incredibly excited about all right so this is a playbook if you are
right so this is a playbook if you are
right so this is a playbook if you are not familiar with ipython playbook
not familiar with ipython playbook
not familiar with ipython playbook it’s probably just better to just show
it’s probably just better to just show
it’s probably just better to just show you what it is it’s kind of like
you what it is it’s kind of like
you what it is it’s kind of like jsfiddle or code pen but it’s instead
jsfiddle or code pen but it’s instead
jsfiddle or code pen but it’s instead you write things in little cells that
you write things in little cells that
you write things in little cells that depend on depend on each other play
depend on depend on each other play
depend on depend on each other play books are almost exclusively used to
books are almost exclusively used to
books are almost exclusively used to mine data and visualize data sets you
mine data and visualize data sets you
mine data and visualize data sets you like okay we have this database of users
like okay we have this database of users
like okay we have this database of users and we need to figure out daily active
and we need to figure out daily active
and we need to figure out daily active users and we need
users and we need
users and we need display a graph of that lalala that kind
display a graph of that lalala that kind
display a graph of that lalala that kind of thing it’s kind of like an excel on
of thing it’s kind of like an excel on
of thing it’s kind of like an excel on super super super powers
super super super powers
super super super powers blah-blah-blah-blah-blah let me show you
blah-blah-blah-blah-blah let me show you
blah-blah-blah-blah-blah let me show you what it looks like this is observable
what it looks like this is observable
what it looks like this is observable I’ve just created my notebook so you see
I’ve just created my notebook so you see
I’ve just created my notebook so you see here that there’s a markdown block here
here that there’s a markdown block here
here that there’s a markdown block here so this evaluates to whatever I write
so this evaluates to whatever I write
so this evaluates to whatever I write here in markdown hello observable and I
here in markdown hello observable and I
here in markdown hello observable and I just hit shift enter and renders and I
just hit shift enter and renders and I
just hit shift enter and renders and I can just keep typing here and it will
can just keep typing here and it will
can just keep typing here and it will you know render it this nicely which is
you know render it this nicely which is
you know render it this nicely which is kind of cool you can write like document
kind of cool you can write like document
kind of cool you can write like document whatever it is that you you’re working
whatever it is that you you’re working
whatever it is that you you’re working with that at the moment make your play
with that at the moment make your play
with that at the moment make your play book pretty for the future of your
book pretty for the future of your
book pretty for the future of your future generations so these URLs after
future generations so these URLs after
future generations so these URLs after you publish them are shareable
you publish them are shareable
you publish them are shareable observable is a very early product I
observable is a very early product I
observable is a very early product I know that they are working on private
know that they are working on private
know that they are working on private privates privates play books and teams
privates privates play books and teams
privates privates play books and teams but for now all the play books that you
but for now all the play books that you
but for now all the play books that you publish are either public or private
publish are either public or private
publish are either public or private there’s nothing in between so you can
there’s nothing in between so you can
there’s nothing in between so you can write JavaScript 5+5 it shift-enter
write JavaScript 5+5 it shift-enter
write JavaScript 5+5 it shift-enter it’s it’s ten and you can also assign
it’s it’s ten and you can also assign
it’s it’s ten and you can also assign variables so i can do i hate these kinds
variables so i can do i hate these kinds
variables so i can do i hate these kinds of variable names but i’m gonna assign
of variable names but i’m gonna assign
of variable names but i’m gonna assign foo and then i can refer to those
foo and then i can refer to those
foo and then i can refer to those variables from other cells
variables from other cells
variables from other cells yes created new cell here and i’m gonna
yes created new cell here and i’m gonna
yes created new cell here and i’m gonna do food plus plus 25 that evaluates to
do food plus plus 25 that evaluates to
do food plus plus 25 that evaluates to 35 this so far is not very impressive
35 this so far is not very impressive
35 this so far is not very impressive this is exactly what i python playbook
this is exactly what i python playbook
this is exactly what i python playbook does but let me show you this let me
does but let me show you this let me
does but let me show you this let me change this to 8 and hit shift enter
change this to 8 and hit shift enter
change this to 8 and hit shift enter notice that this here updates let
notice that this here updates let
notice that this here updates let me change that again see that this live
me change that again see that this live
me change that again see that this live updates here and that is because that is
updates here and that is because that is
updates here and that is because that is not because the entire playbook
not because the entire playbook
not because the entire playbook rear Enders all the time no it’s because
rear Enders all the time no it’s because
rear Enders all the time no it’s because of the because this cell is aware of its
of the because this cell is aware of its
of the because this cell is aware of its dependency on this there are some cool
dependency on this there are some cool
dependency on this there are some cool implications with that but I’m going to
implications with that but I’m going to
implications with that but I’m going to show you how to declare a function first
show you how to declare a function first
show you how to declare a function first so let’s say that I declare a function
so let’s say that I declare a function
so let’s say that I declare a function and we call it hello and I’m going to do
and we call it hello and I’m going to do
and we call it hello and I’m going to do let me just do a this color return
let me just do a this color return
let me just do a this color return promise new promise and this from is how
promise new promise and this from is how
promise new promise and this from is how do you do promises okay it takes a
do you do promises okay it takes a
do you do promises okay it takes a function and it’s a result function and
function and it’s a result function and
function and it’s a result function and that resolve function is going to be
that resolve function is going to be
that resolve function is going to be cold with hello let’s just call this
cold with hello let’s just call this
cold with hello let’s just call this greeting instead to be honest and I
greeting instead to be honest and I
greeting instead to be honest and I don’t want it to be called immediately I
don’t want it to be called immediately I
don’t want it to be called immediately I want it to be cold after a second time
want it to be cold after a second time
want it to be cold after a second time it’s that time ouch and then it’s going
it’s that time ouch and then it’s going
it’s that time ouch and then it’s going to resolve and then it’s going to or so
to resolve and then it’s going to or so
to resolve and then it’s going to or so after saying oh let’s see if that
after saying oh let’s see if that
after saying oh let’s see if that evaluates nope unexpected token one
evaluates nope unexpected token one
evaluates nope unexpected token one parents too much cool see that now
parents too much cool see that now
parents too much cool see that now greeting is a function so if I just call
greeting is a function so if I just call
greeting is a function so if I just call greeting you see that after a second
greeting you see that after a second
greeting you see that after a second there in updates to a low so you see
there in updates to a low so you see
there in updates to a low so you see that observable is very much aware of
that observable is very much aware of
that observable is very much aware of the concept of promises and will kind of
the concept of promises and will kind of
the concept of promises and will kind of just I’ll figure this out so I can
just I’ll figure this out so I can
just I’ll figure this out so I can actually assign this to a variable just
actually assign this to a variable just
actually assign this to a variable just call it current greeting there BAM and
call it current greeting there BAM and
call it current greeting there BAM and then I’m going to dictate it it urged
then I’m going to dictate it it urged
then I’m going to dictate it it urged let me with reference count greeting
let me with reference count greeting
let me with reference count greeting from here current greeting you see okay
from here current greeting you see okay
from here current greeting you see okay that evaluates to hello 25 because
that evaluates to hello 25 because
that evaluates to hello 25 because JavaScript doesn’t make sense
JavaScript doesn’t make sense
JavaScript doesn’t make sense let me delete this
let me delete this
let me delete this sell here so that we don’t get too
sell here so that we don’t get too
sell here so that we don’t get too confused I would really like
confused I would really like
confused I would really like drag-and-drop support here so that I
drag-and-drop support here so that I
drag-and-drop support here so that I could drag reading down because they
could drag reading down because they
could drag reading down because they order of these things don’t make sense
order of these things don’t make sense
order of these things don’t make sense perhaps Ursa can I move them somehow I
perhaps Ursa can I move them somehow I
perhaps Ursa can I move them somehow I don’t know how to
don’t know how to
don’t know how to what’s the hotkey for moving I don’t
what’s the hotkey for moving I don’t
what’s the hotkey for moving I don’t know there’s probably some oh there
know there’s probably some oh there
know there’s probably some oh there there cool now have a look at this when
there cool now have a look at this when
there cool now have a look at this when I change hello here to buy and it
I change hello here to buy and it
I change hello here to buy and it updates after a second notice how sleek
updates after a second notice how sleek
updates after a second notice how sleek this is that the environment is aware of
this is that the environment is aware of
this is that the environment is aware of promises and constantly re-evaluate them
promises and constantly re-evaluate them
promises and constantly re-evaluate them all the time it’s just so incredibly
all the time it’s just so incredibly
all the time it’s just so incredibly sleek to work with let me refer this
sleek to work with let me refer this
sleek to work with let me refer this thing to be a delay function delay
thing to be a delay function delay
thing to be a delay function delay milliseconds and we’re gonna call it
milliseconds and we’re gonna call it
milliseconds and we’re gonna call it there and then it’s gonna be now so
there and then it’s gonna be now so
there and then it’s gonna be now so delay is now a function that returns a
delay is now a function that returns a
delay is now a function that returns a promise that resolves after its certain
promise that resolves after its certain
promise that resolves after its certain amount of milliseconds and as you see
amount of milliseconds and as you see
amount of milliseconds and as you see here now these cells that depend on
here now these cells that depend on
here now these cells that depend on having but the function greeting exists
having but the function greeting exists
having but the function greeting exists they are now broken because you know
they are now broken because you know
they are now broken because you know that make sense so there’s this concept
that make sense so there’s this concept
that make sense so there’s this concept in in in also a book called blocks I
in in in also a book called blocks I
in in in also a book called blocks I think they’re called blocks whatever and
think they’re called blocks whatever and
think they’re called blocks whatever and I want to call this numbers and I’m
I want to call this numbers and I’m
I want to call this numbers and I’m gonna create blocks so this is not an
gonna create blocks so this is not an
gonna create blocks so this is not an object literal that I’m creating now
object literal that I’m creating now
object literal that I’m creating now this is a this is a block so this can do
this is a this is a block so this can do
this is a this is a block so this can do the churn so blocks are kind of you can
the churn so blocks are kind of you can
the churn so blocks are kind of you can think of them as probably if ease like
think of them as probably if ease like
think of them as probably if ease like it’s just it’s like a function that is
it’s just it’s like a function that is
it’s just it’s like a function that is immediately evaluated so you can it’s
immediately evaluated so you can it’s
immediately evaluated so you can it’s kind of like an implicit and place it
kind of like an implicit and place it
kind of like an implicit and place it like this this is kind of what it looks
like this this is kind of what it looks
like this this is kind of what it looks like but but it also has it’s kind of
like but but it also has it’s kind of
like but but it also has it’s kind of like an implicit a sinc function as well
like an implicit a sinc function as well
like an implicit a sinc function as well so I can just
so I can just
so I can just if I do this delay 10 1000 and I just
if I do this delay 10 1000 and I just
if I do this delay 10 1000 and I just say oh wait and then return tap all
say oh wait and then return tap all
say oh wait and then return tap all right 17 and I’ll play that see that oh
right 17 and I’ll play that see that oh
right 17 and I’ll play that see that oh it waits a second and then it returns a
it waits a second and then it returns a
it waits a second and then it returns a 1017 and it’s also an implicit generator
1017 and it’s also an implicit generator
1017 and it’s also an implicit generator wait what I’m gonna let that sink in a
wait what I’m gonna let that sink in a
wait what I’m gonna let that sink in a bit because I didn’t even know that a
bit because I didn’t even know that a
bit because I didn’t even know that a synchronous generators was a thing and
synchronous generators was a thing and
synchronous generators was a thing and it’s it’s amazingly useful in the
it’s it’s amazingly useful in the
it’s it’s amazingly useful in the context of data analysis let me show you
context of data analysis let me show you
context of data analysis let me show you let me do a while true and we’re going
let me do a while true and we’re going
let me do a while true and we’re going to do let I equals 0 and we’re going to
to do let I equals 0 and we’re going to
to do let I equals 0 and we’re going to wait for 100 milliseconds and then we’re
wait for 100 milliseconds and then we’re
wait for 100 milliseconds and then we’re going to do I plus plus and then we’re
going to do I plus plus and then we’re
going to do I plus plus and then we’re going to yield I and can I run look at
going to yield I and can I run look at
going to yield I and can I run look at that that is so cool and of course I can
that that is so cool and of course I can
that that is so cool and of course I can depend on this so let me delete this
depend on this so let me delete this
depend on this so let me delete this cell here and just say like I can do
cell here and just say like I can do
cell here and just say like I can do hello plus numbers and see that this
hello plus numbers and see that this
hello plus numbers and see that this dynamic leary evaluates it might be that
dynamic leary evaluates it might be that
dynamic leary evaluates it might be that you are not familiar with generators or
you are not familiar with generators or
you are not familiar with generators or a synchronous functions then this is
a synchronous functions then this is
a synchronous functions then this is mind-bending to you you might want to
mind-bending to you you might want to
mind-bending to you you might want to check out my episode on generators here
check out my episode on generators here
check out my episode on generators here I also made a video on a sink await that
I also made a video on a sink await that
I also made a video on a sink await that you will probably find very interesting
you will probably find very interesting
you will probably find very interesting throws out if if this confuses you
throws out if if this confuses you
throws out if if this confuses you because this is going to be way more
because this is going to be way more
because this is going to be way more confusing later all right
confusing later all right
confusing later all right besides just being cool is there
besides just being cool is there
besides just being cool is there something that we can actually use this
something that we can actually use this
something that we can actually use this for let me show you but so there’s
for let me show you but so there’s
for let me show you but so there’s there’s an end point that I have for on
there’s an end point that I have for on
there’s an end point that I have for on the Fun Fun forum which is the private
the Fun Fun forum which is the private
the Fun Fun forum which is the private forum for for patrons where people can
forum for for patrons where people can
forum for for patrons where people can in their profile
in their profile
in their profile just insert arbitrary JSON and this is
just insert arbitrary JSON and this is
just insert arbitrary JSON and this is exposed through an endpoint that all
exposed through an endpoint that all
exposed through an endpoint that all other former members can use so you can
other former members can use so you can
other former members can use so you can use this to kind of create dump services
use this to kind of create dump services
use this to kind of create dump services without my involvement let me just show
without my involvement let me just show
without my involvement let me just show you what it looks like so I’m just gonna
you what it looks like so I’m just gonna
you what it looks like so I’m just gonna run that okay if I just fetch it it it
run that okay if I just fetch it it it
run that okay if I just fetch it it it gives a it gives a response object which
gives a it gives a response object which
gives a it gives a response object which is not very useful to us let me evaluate
is not very useful to us let me evaluate
is not very useful to us let me evaluate you know we can actually do do a block
you know we can actually do do a block
you know we can actually do do a block here and await this miss fetch put it
here and await this miss fetch put it
here and await this miss fetch put it into a response and then we and do a
into a response and then we and do a
into a response and then we and do a body do you know what we can do this
body do you know what we can do this
body do you know what we can do this with bones dot JSON and we just return
with bones dot JSON and we just return
with bones dot JSON and we just return that all right so we get some this is
that all right so we get some this is
that all right so we get some this is what it looks like it’s just a username
what it looks like it’s just a username
what it looks like it’s just a username on the left side and then maybe JSON on
on the left side and then maybe JSON on
on the left side and then maybe JSON on the right side so members are highly
the right side so members are highly
the right side so members are highly encouraged to insert stuff that will
encouraged to insert stuff that will
encouraged to insert stuff that will will break the applications of other
will break the applications of other
will break the applications of other users let me close that for a bit let’s
users let me close that for a bit let’s
users let me close that for a bit let’s look at my Jason so I want to how let’s
look at my Jason so I want to how let’s
look at my Jason so I want to how let’s assign this to a variable we’re gonna
assign this to a variable we’re gonna
assign this to a variable we’re gonna call it old data worst variable name I’m
call it old data worst variable name I’m
call it old data worst variable name I’m gonna create a new cell I’m going to do
gonna create a new cell I’m going to do
gonna create a new cell I’m going to do all data
all data
all data and check out my user which has mpj so
and check out my user which has mpj so
and check out my user which has mpj so here’s some Jason let’s say this is just
here’s some Jason let’s say this is just
here’s some Jason let’s say this is just a JSON string so let me do a json.parse
percent up okay
percent up okay lookie lookie here’s an object so this
lookie lookie here’s an object so this
lookie lookie here’s an object so this is a pretty cool thing there is I can
is a pretty cool thing there is I can
is a pretty cool thing there is I can show you actually let’s go to fun fun
show you actually let’s go to fun fun
show you actually let’s go to fun fun forum cow and their ears a blow show you
forum cow and their ears a blow show you
forum cow and their ears a blow show you was and there’s this pretty cool map
was and there’s this pretty cool map
was and there’s this pretty cool map that valise has made which is moderator
that valise has made which is moderator
that valise has made which is moderator on the front of inform it’s currently
on the front of inform it’s currently
on the front of inform it’s currently broken because I just rewrote this
broken because I just rewrote this
broken because I just rewrote this endpoint but it basically shows you all
endpoint but it basically shows you all
endpoint but it basically shows you all the locations of of members of the font
the locations of of members of the font
the locations of of members of the font on forum that has put their stuff in
on forum that has put their stuff in
on forum that has put their stuff in there in the hackable json endpoint so
there in the hackable json endpoint so
there in the hackable json endpoint so here’s my location in gothenburg and you
here’s my location in gothenburg and you
here’s my location in gothenburg and you need to place it in the user map
need to place it in the user map
need to place it in the user map location know that is what the app
location know that is what the app
location know that is what the app expects you to do let’s actually have a
expects you to do let’s actually have a
expects you to do let’s actually have a have a have a look at at that this is my
have a have a look at at that this is my
have a have a look at at that this is my my location let’s let’s do user location
my location let’s let’s do user location
my location let’s let’s do user location lam there now it would be pretty cool if
lam there now it would be pretty cool if
lam there now it would be pretty cool if this location was live updating when I
this location was live updating when I
this location was live updating when I updated it on the forum what I mean by
updated it on the forum what I mean by
updated it on the forum what I mean by that let’s actually go to my user
that let’s actually go to my user
that let’s actually go to my user profile and I just changed my caption
profile and I just changed my caption
profile and I just changed my caption here to get nose lulu lululu oopps
here to get nose lulu lululu oopps
here to get nose lulu lululu oopps and save changes and go
and save changes and go
and save changes and go – observable and you know I just really
– observable and you know I just really
– observable and you know I just really ate this cell here and you see that lulu
ate this cell here and you see that lulu
ate this cell here and you see that lulu lululu it would be cool if i didn’t have
lululu it would be cool if i didn’t have
lululu it would be cool if i didn’t have to do that if there was some some way of
to do that if there was some some way of
to do that if there was some some way of us to to listen to the changes and have
us to to listen to the changes and have
us to to listen to the changes and have this thing update life turns out that
this thing update life turns out that
this thing update life turns out that there is the first thing that i want to
there is the first thing that i want to
there is the first thing that i want to do is we’re gonna did assign this to a
do is we’re gonna did assign this to a
do is we’re gonna did assign this to a variable I’m gonna call it left or user
variable I’m gonna call it left or user
variable I’m gonna call it left or user map yeah user hash so that we don’t
map yeah user hash so that we don’t
map yeah user hash so that we don’t confuse ourselves and we need to await
confuse ourselves and we need to await
confuse ourselves and we need to await that let me return user hash so that you
that let me return user hash so that you
that let me return user hash so that you can see what we’re thinking about yes it
can see what we’re thinking about yes it
can see what we’re thinking about yes it still looks good now there’s actually a
still looks good now there’s actually a
still looks good now there’s actually a WebSocket endpoint the way you do a
WebSocket endpoint the way you do a
WebSocket endpoint the way you do a WebSocket is new WebSocket let the duty
WebSocket is new WebSocket let the duty
WebSocket is new WebSocket let the duty to and usual copy this is the endpoint
to and usual copy this is the endpoint
to and usual copy this is the endpoint the right so it’s WebSocket secure and
the right so it’s WebSocket secure and
the right so it’s WebSocket secure and it’s fun fun Automator Heroku app calm
it’s fun fun Automator Heroku app calm
it’s fun fun Automator Heroku app calm hacker palliation basically the same
hacker palliation basically the same
hacker palliation basically the same thing as this end point but just
thing as this end point but just
thing as this end point but just WebSocket and we’re gonna pull this
WebSocket and we’re gonna pull this
WebSocket and we’re gonna pull this socket socket and then we’re going to
socket socket and then we’re going to
socket socket and then we’re going to look at the bits so get on message and
look at the bits so get on message and
look at the bits so get on message and this gives us a function or and we gave
this gives us a function or and we gave
this gives us a function or and we gave it a function and that take the function
it a function and that take the function
it a function and that take the function accepts and event and no console.log
accepts and event and no console.log
accepts and event and no console.log we can distribute the juji juji you know
we can distribute the juji juji you know
we can distribute the juji juji you know what I’m going to do this in a separate
what I’m going to do this in a separate
what I’m going to do this in a separate block so that we can think about one
block so that we can think about one
block so that we can think about one thing at a time
thing at a time
thing at a time oh there we go there we go we’re gonna
oh there we go there we go we’re gonna
oh there we go there we go we’re gonna console.log out event dot data no data
console.log out event dot data no data
console.log out event dot data no data is data and run that or start running
is data and run that or start running
is data and run that or start running that dump up the console here data is
that dump up the console here data is
that dump up the console here data is ping ping all right yeah so it pings us
ping ping all right yeah so it pings us
ping ping all right yeah so it pings us every seems like it’s ends ping as data
every seems like it’s ends ping as data
every seems like it’s ends ping as data every every five seconds or so let me
every every five seconds or so let me
every every five seconds or so let me change my profile change it back to not
change my profile change it back to not
change my profile change it back to not Lulu what is happening you know some
Lulu what is happening you know some
Lulu what is happening you know some weird order complaining here which I
weird order complaining here which I
weird order complaining here which I don’t want it to do there oh my god what
don’t want it to do there oh my god what
don’t want it to do there oh my god what what is happening like OSX is confused
what is happening like OSX is confused
what is happening like OSX is confused about mine what this field is okay let’s
about mine what this field is okay let’s
about mine what this field is okay let’s have a look and you see era that if we
have a look and you see era that if we
have a look and you see era that if we now get some new new the updated user
now get some new new the updated user
now get some new new the updated user here so we want to want to update this
here so we want to want to update this
here so we want to want to update this old data objects cache with that and
old data objects cache with that and
old data objects cache with that and then feed that up to this year so how do
then feed that up to this year so how do
then feed that up to this year so how do we do that
we do that
we do that well if I look at the old data endpoint
well if I look at the old data endpoint
well if I look at the old data endpoint we could start yielding things here
we could start yielding things here
we could start yielding things here because it’s an it’s a generator but in
because it’s an it’s a generator but in
because it’s an it’s a generator but in order to do that we need to be able to
order to do that we need to be able to
order to do that we need to be able to kind of wait for for the stream or for
kind of wait for for the stream or for
kind of wait for for the stream or for the port D for the data and there’s no
the port D for the data and there’s no
the port D for the data and there’s no way of us do that so
way of us do that so
way of us do that so refactor this to be a kind of promise
refactor this to be a kind of promise
refactor this to be a kind of promise we’re going to call this function next
and and did it’s going to return a new
and and did it’s going to return a new promise that resolves to do boom boom
promise that resolves to do boom boom
promise that resolves to do boom boom [Music]
[Music]
[Music] there we go and on the message we’re
there we go and on the message we’re
there we go and on the message we’re going to give event dot data it’s not
going to give event dot data it’s not
going to give event dot data it’s not the ping
the ping
the ping we’re don’t care about the ping you just
we’re don’t care about the ping you just
we’re don’t care about the ping you just want the user updates then we’re going
want the user updates then we’re going
want the user updates then we’re going to resolve it with event dot of data so
to resolve it with event dot of data so
to resolve it with event dot of data so look at that let’s call it let’s call
look at that let’s call it let’s call
look at that let’s call it let’s call its let’s call this a function and let’s
its let’s call this a function and let’s
its let’s call this a function and let’s call it start streaming something like
call it start streaming something like
call it start streaming something like that and M then let’s jump to this one
that and M then let’s jump to this one
that and M then let’s jump to this one and we do so let’s create a block let’s
and we do so let’s create a block let’s
and we do so let’s create a block let’s assign next to the function that is
assign next to the function that is
assign next to the function that is returned from start streaming see what
returned from start streaming see what
returned from start streaming see what this looks like
this looks like
this looks like and then we turn next what happens
and then we turn next what happens
and then we turn next what happens nothing is happening
nothing is happening
nothing is happening so what makes sense because there’s no
so what makes sense because there’s no
so what makes sense because there’s no user updates let’s let’s update and I
user updates let’s let’s update and I
user updates let’s let’s update and I asked lululu and oh sorry about that
asked lululu and oh sorry about that
asked lululu and oh sorry about that Save Changes see order get something oh
Save Changes see order get something oh
Save Changes see order get something oh we did boom
we did boom
we did boom so now this next function will return
so now this next function will return
so now this next function will return the next thing in the stream so if I
the next thing in the stream so if I
the next thing in the stream so if I actually just
actually just
actually just J son dot parse and I need to await this
J son dot parse and I need to await this
J son dot parse and I need to await this as well otherwise frustration dot parse
as well otherwise frustration dot parse
as well otherwise frustration dot parse wants an actual value nor the promise
wants an actual value nor the promise
wants an actual value nor the promise see what this looks like and I’m gonna
see what this looks like and I’m gonna
see what this looks like and I’m gonna update my profile again Moodle and save
update my profile again Moodle and save
update my profile again Moodle and save the changes and now you see here oh it’s
the changes and now you see here oh it’s
the changes and now you see here oh it’s in JSON object and close this because we
in JSON object and close this because we
in JSON object and close this because we know it works
know it works
know it works now I want to because this is just doing
now I want to because this is just doing
now I want to because this is just doing this once I want to make sure that this
this once I want to make sure that this
this once I want to make sure that this does it like shows it as as we as we
does it like shows it as as we as we
does it like shows it as as we as we update so let’s let’s just call this me
update so let’s let’s just call this me
update so let’s let’s just call this me and then me dot so the look we want the
and then me dot so the look we want the
and then me dot so the look we want the we actually want to parse out the
we actually want to parse out the
we actually want to parse out the hackable jason we’re gonna call this
hackable jason we’re gonna call this
hackable jason we’re gonna call this hackable I’m gonna do me don’t hack
hackable I’m gonna do me don’t hack
hackable I’m gonna do me don’t hack JSON new Jason parse it’s jason within
JSON new Jason parse it’s jason within
JSON new Jason parse it’s jason within the JSON it’s all very confusing
the JSON it’s all very confusing
the JSON it’s all very confusing packable dot user location and
packable dot user location and
packable dot user location and lalalalala what do we have
lalalalala what do we have
lalalalala what do we have I want the caption caption it’s returned
I want the caption caption it’s returned
I want the caption caption it’s returned on what happens and let me update it
on what happens and let me update it
on what happens and let me update it again
again
again substance of some stuff mandatory and it
substance of some stuff mandatory and it
substance of some stuff mandatory and it was an unexpected end of Jason input why
was an unexpected end of Jason input why
was an unexpected end of Jason input why is that that confuses me a bit perhaps
is that that confuses me a bit perhaps
is that that confuses me a bit perhaps it isn’t valid Jason let’s actually
it isn’t valid Jason let’s actually
it isn’t valid Jason let’s actually check it perhaps I’ve messed it up
me paste this into a new cell yeah I
me paste this into a new cell yeah I think I deleted I accidentally deleted a
think I deleted I accidentally deleted a
think I deleted I accidentally deleted a curly bracket thing at the end so
curly bracket thing at the end so
curly bracket thing at the end so actually let me fix up their curly what
actually let me fix up their curly what
actually let me fix up their curly what curly bracket all right so now instead
curly bracket all right so now instead
curly bracket all right so now instead of having this stream just once I wanted
of having this stream just once I wanted
of having this stream just once I wanted to be a generator so I just do
to be a generator so I just do
to be a generator so I just do wild true and I’m gonna do its this
wild true and I’m gonna do its this
wild true and I’m gonna do its this inside of the the wild true didn’t do
inside of the the wild true didn’t do
inside of the the wild true didn’t do there we go and now instead of returning
there we go and now instead of returning
there we go and now instead of returning we’re going to be yielding so yield just
we’re going to be yielding so yield just
we’re going to be yielding so yield just it’s kind of like a possible return it’s
it’s kind of like a possible return it’s
it’s kind of like a possible return it’s kinda like instead of terminating the
kinda like instead of terminating the
kinda like instead of terminating the function just pauses all right just hey
function just pauses all right just hey
function just pauses all right just hey I’ll give you whatever is running me the
I’ll give you whatever is running me the
I’ll give you whatever is running me the generator up some value and then I’m
generator up some value and then I’m
generator up some value and then I’m going to continue running file out here
going to continue running file out here
going to continue running file out here and going to change this string here two
and going to change this string here two
and going to change this string here two moves back again and I’m going to hit
moves back again and I’m going to hit
moves back again and I’m going to hit save take a look here and you see that
save take a look here and you see that
save take a look here and you see that Boop it updates let me do that again
Boop it updates let me do that again
Boop it updates let me do that again [Music]
[Music]
[Music] say that again and it updates and you
say that again and it updates and you
say that again and it updates and you know we could call this label let’s now
know we could call this label let’s now
know we could call this label let’s now actually integrate this into the old
actually integrate this into the old
actually integrate this into the old data thing so instead of returning user
data thing so instead of returning user
data thing so instead of returning user hash here we’re going to yield it and
hash here we’re going to yield it and
hash here we’re going to yield it and then we are going to start
then we are going to start
then we are going to start do next I’m gonna start streaming grab
do next I’m gonna start streaming grab
do next I’m gonna start streaming grab this actually and go back to old data
this actually and go back to old data
this actually and go back to old data while we’re true we have this gonna grab
while we’re true we have this gonna grab
while we’re true we have this gonna grab your update to use your hash and we’re
your update to use your hash and we’re
your update to use your hash and we’re gonna grab like me don’t use your name
and sign that with the hacker Bob JSON
and sign that with the hacker Bob JSON because that’s how it’s structured and
because that’s how it’s structured and
because that’s how it’s structured and once we’re done with that we are going
once we’re done with that we are going
once we’re done with that we are going to the entire user hash and we know this
to the entire user hash and we know this
to the entire user hash and we know this BAM
BAM
BAM let’s actually delete these observable
let’s actually delete these observable
let’s actually delete these observable numbers as well because they have been
numbers as well because they have been
numbers as well because they have been distracting us for long enough and here
distracting us for long enough and here
distracting us for long enough and here let’s just call this mpj and as we see
let’s just call this mpj and as we see
let’s just call this mpj and as we see here now
here now
here now this refers to like old like mpj in the
this refers to like old like mpj in the
this refers to like old like mpj in the old day – so like if you remember this
old day – so like if you remember this
old day – so like if you remember this is a hash of all the users and now we’re
is a hash of all the users and now we’re
is a hash of all the users and now we’re referring to an PJ and the user
referring to an PJ and the user
referring to an PJ and the user application here so before this was now
application here so before this was now
application here so before this was now like we have to refresh for this to
like we have to refresh for this to
like we have to refresh for this to update however if all of this works now
update however if all of this works now
update however if all of this works now I should be able to change this here and
I should be able to change this here and
I should be able to change this here and Save Changes and this should live update
Save Changes and this should live update
Save Changes and this should live update and it does see that I’m gonna save
and it does see that I’m gonna save
and it does see that I’m gonna save again boom and it’s I’m going to publish
again boom and it’s I’m going to publish
again boom and it’s I’m going to publish this this notebook here so that you can
this this notebook here so that you can
this this notebook here so that you can play around with it just find it in the
play around with it just find it in the
play around with it just find it in the link in the episode description and I
link in the episode description and I
link in the episode description and I think that this is very cool
think that this is very cool
think that this is very cool observability make so much sense for a
observability make so much sense for a
observability make so much sense for a playbook environment it’s so easy to
playbook environment it’s so easy to
playbook environment it’s so easy to work with
work with
work with javascript is
javascript is
javascript is also stupendously useful for stuff like
also stupendously useful for stuff like
also stupendously useful for stuff like this it’s really good at it
this it’s really good at it
this it’s really good at it by the way something that I haven’t even
by the way something that I haven’t even
by the way something that I haven’t even showed you is that you can just pull in
showed you is that you can just pull in
showed you is that you can just pull in NPM modules here like randa or you know
NPM modules here like randa or you know
NPM modules here like randa or you know whatever you need you can also render
Google Maps and HTML right into here so
Google Maps and HTML right into here so that you can visualize this map and like
that you can visualize this map and like
that you can visualize this map and like do all kinds of shenanigans it’s really
do all kinds of shenanigans it’s really
do all kinds of shenanigans it’s really really nice you’re probably going to see
really nice you’re probably going to see
really nice you’re probably going to see me doing quite a bit of more observable
me doing quite a bit of more observable
me doing quite a bit of more observable stuff over the coming months because
stuff over the coming months because
stuff over the coming months because this is a product that I’m I’m very
this is a product that I’m I’m very
this is a product that I’m I’m very excited about I hope you found that
excited about I hope you found that
excited about I hope you found that useful if you’re confused please post
useful if you’re confused please post
useful if you’re confused please post questions down below or if you are a
questions down below or if you are a
questions down below or if you are a patron you can post it on the dedicated
patron you can post it on the dedicated
patron you can post it on the dedicated discussion topic on the Fun Fun forum by
discussion topic on the Fun Fun forum by
discussion topic on the Fun Fun forum by clicking here or in the link in the
clicking here or in the link in the
clicking here or in the link in the episode description if you are new well
episode description if you are new well
episode description if you are new well come you have just watched an episode of
come you have just watched an episode of
come you have just watched an episode of fun fun function a release is every
fun fun function a release is every
fun fun function a release is every Monday morning Oh 800 GMT if you are
Monday morning Oh 800 GMT if you are
Monday morning Oh 800 GMT if you are forgetful you can subscribe here so that
forgetful you can subscribe here so that
forgetful you can subscribe here so that you don’t miss it or just watch another
you don’t miss it or just watch another
you don’t miss it or just watch another episode right now by clicking here I am
episode right now by clicking here I am
episode right now by clicking here I am npj until next Monday morning stay
npj until next Monday morning stay
npj until next Monday morning stay curious
good Monday morning today we’re going to take a look at observable which is a
service that provides interactive
service that provides interactive JavaScript playbooks with observable
JavaScript playbooks with observable
JavaScript playbooks with observable dependencies it’s a various show it to
dependencies it’s a various show it to
dependencies it’s a various show it to you to be honest eyes and then PJs and
you to be honest eyes and then PJs and
you to be honest eyes and then PJs and you are watching function
[Music]
[Music] in case you are wondering why I am
in case you are wondering why I am
in case you are wondering why I am wearing a hat it’s because I live in
wearing a hat it’s because I live in
wearing a hat it’s because I live in Sweden and right now in Sweden things
Sweden and right now in Sweden things
Sweden and right now in Sweden things are insanely cold like so cold that you
are insanely cold like so cold that you
are insanely cold like so cold that you get angry so cold I actually have a
get angry so cold I actually have a
get angry so cold I actually have a heater like what’s it called a space
heater like what’s it called a space
heater like what’s it called a space heater in the in my little studio here
heater in the in my little studio here
heater in the in my little studio here but I can’t keep it running while I’m
but I can’t keep it running while I’m
but I can’t keep it running while I’m recording so I like I’m covering myself
recording so I like I’m covering myself
recording so I like I’m covering myself with textiles all right so what is
with textiles all right so what is
with textiles all right so what is observable if you are familiar with
observable if you are familiar with
observable if you are familiar with ipython playbooks then it’s basically
ipython playbooks then it’s basically
ipython playbooks then it’s basically that except that it’s in JavaScript of
that except that it’s in JavaScript of
that except that it’s in JavaScript of course and it’s hosted software is a
course and it’s hosted software is a
course and it’s hosted software is a service so you don’t need to sit and
service so you don’t need to sit and
service so you don’t need to sit and mess with setting it up and it’s it also
mess with setting it up and it’s it also
mess with setting it up and it’s it also has is aware of its dependencies and
has is aware of its dependencies and
has is aware of its dependencies and will dynamically recalculate itself when
will dynamically recalculate itself when
will dynamically recalculate itself when a dependency has changed which has huge
a dependency has changed which has huge
a dependency has changed which has huge huge implications for for the entire
huge implications for for the entire
huge implications for for the entire playbook system and makes it so much
playbook system and makes it so much
playbook system and makes it so much more powerful than ipython playbook ever
more powerful than ipython playbook ever
more powerful than ipython playbook ever since I tried ipython playbook many
since I tried ipython playbook many
since I tried ipython playbook many years ago I have wanted this specific
years ago I have wanted this specific
years ago I have wanted this specific product and I am so happy that it’s
product and I am so happy that it’s
product and I am so happy that it’s finally created and it’s amazing and
finally created and it’s amazing and
finally created and it’s amazing and it’s going to be huge this is not a
it’s going to be huge this is not a
it’s going to be huge this is not a sponsored video they have not even asked
sponsored video they have not even asked
sponsored video they have not even asked me to make this this is just a product
me to make this this is just a product
me to make this this is just a product that I am incredibly excited about all
that I am incredibly excited about all
that I am incredibly excited about all right so this is a playbook if you are
right so this is a playbook if you are
right so this is a playbook if you are not familiar with ipython playbook
not familiar with ipython playbook
not familiar with ipython playbook it’s probably just better to just show
it’s probably just better to just show
it’s probably just better to just show you what it is it’s kind of like
you what it is it’s kind of like
you what it is it’s kind of like jsfiddle or code pen but it’s instead
jsfiddle or code pen but it’s instead
jsfiddle or code pen but it’s instead you write things in little cells that
you write things in little cells that
you write things in little cells that depend on depend on each other play
depend on depend on each other play
depend on depend on each other play books are almost exclusively used to
books are almost exclusively used to
books are almost exclusively used to mine data and visualize data sets you
mine data and visualize data sets you
mine data and visualize data sets you like okay we have this database of users
like okay we have this database of users
like okay we have this database of users and we need to figure out daily active
and we need to figure out daily active
and we need to figure out daily active users and we need
users and we need
users and we need display a graph of that lalala that kind
display a graph of that lalala that kind
display a graph of that lalala that kind of thing it’s kind of like an excel on
of thing it’s kind of like an excel on
of thing it’s kind of like an excel on super super super powers
super super super powers
super super super powers blah-blah-blah-blah-blah let me show you
blah-blah-blah-blah-blah let me show you
blah-blah-blah-blah-blah let me show you what it looks like this is observable
what it looks like this is observable
what it looks like this is observable I’ve just created my notebook so you see
I’ve just created my notebook so you see
I’ve just created my notebook so you see here that there’s a markdown block here
here that there’s a markdown block here
here that there’s a markdown block here so this evaluates to whatever I write
so this evaluates to whatever I write
so this evaluates to whatever I write here in markdown hello observable and I
here in markdown hello observable and I
here in markdown hello observable and I just hit shift enter and renders and I
just hit shift enter and renders and I
just hit shift enter and renders and I can just keep typing here and it will
can just keep typing here and it will
can just keep typing here and it will you know render it this nicely which is
you know render it this nicely which is
you know render it this nicely which is kind of cool you can write like document
kind of cool you can write like document
kind of cool you can write like document whatever it is that you you’re working
whatever it is that you you’re working
whatever it is that you you’re working with that at the moment make your play
with that at the moment make your play
with that at the moment make your play book pretty for the future of your
book pretty for the future of your
book pretty for the future of your future generations so these URLs after
future generations so these URLs after
future generations so these URLs after you publish them are shareable
you publish them are shareable
you publish them are shareable observable is a very early product I
observable is a very early product I
observable is a very early product I know that they are working on private
know that they are working on private
know that they are working on private privates privates play books and teams
privates privates play books and teams
privates privates play books and teams but for now all the play books that you
but for now all the play books that you
but for now all the play books that you publish are either public or private
publish are either public or private
publish are either public or private there’s nothing in between so you can
there’s nothing in between so you can
there’s nothing in between so you can write JavaScript 5+5 it shift-enter
write JavaScript 5+5 it shift-enter
write JavaScript 5+5 it shift-enter it’s it’s ten and you can also assign
it’s it’s ten and you can also assign
it’s it’s ten and you can also assign variables so i can do i hate these kinds
variables so i can do i hate these kinds
variables so i can do i hate these kinds of variable names but i’m gonna assign
of variable names but i’m gonna assign
of variable names but i’m gonna assign foo and then i can refer to those
foo and then i can refer to those
foo and then i can refer to those variables from other cells
variables from other cells
variables from other cells yes created new cell here and i’m gonna
yes created new cell here and i’m gonna
yes created new cell here and i’m gonna do food plus plus 25 that evaluates to
do food plus plus 25 that evaluates to
do food plus plus 25 that evaluates to 35 this so far is not very impressive
35 this so far is not very impressive
35 this so far is not very impressive this is exactly what i python playbook
this is exactly what i python playbook
this is exactly what i python playbook does but let me show you this let me
does but let me show you this let me
does but let me show you this let me change this to 8 and hit shift enter
change this to 8 and hit shift enter
change this to 8 and hit shift enter notice that this here updates let
notice that this here updates let
notice that this here updates let me change that again see that this live
me change that again see that this live
me change that again see that this live updates here and that is because that is
updates here and that is because that is
updates here and that is because that is not because the entire playbook
not because the entire playbook
not because the entire playbook rear Enders all the time no it’s because
rear Enders all the time no it’s because
rear Enders all the time no it’s because of the because this cell is aware of its
of the because this cell is aware of its
of the because this cell is aware of its dependency on this there are some cool
dependency on this there are some cool
dependency on this there are some cool implications with that but I’m going to
implications with that but I’m going to
implications with that but I’m going to show you how to declare a function first
show you how to declare a function first
show you how to declare a function first so let’s say that I declare a function
so let’s say that I declare a function
so let’s say that I declare a function and we call it hello and I’m going to do
and we call it hello and I’m going to do
and we call it hello and I’m going to do let me just do a this color return
let me just do a this color return
let me just do a this color return promise new promise and this from is how
promise new promise and this from is how
promise new promise and this from is how do you do promises okay it takes a
do you do promises okay it takes a
do you do promises okay it takes a function and it’s a result function and
function and it’s a result function and
function and it’s a result function and that resolve function is going to be
that resolve function is going to be
that resolve function is going to be cold with hello let’s just call this
cold with hello let’s just call this
cold with hello let’s just call this greeting instead to be honest and I
greeting instead to be honest and I
greeting instead to be honest and I don’t want it to be called immediately I
don’t want it to be called immediately I
don’t want it to be called immediately I want it to be cold after a second time
want it to be cold after a second time
want it to be cold after a second time it’s that time ouch and then it’s going
it’s that time ouch and then it’s going
it’s that time ouch and then it’s going to resolve and then it’s going to or so
to resolve and then it’s going to or so
to resolve and then it’s going to or so after saying oh let’s see if that
after saying oh let’s see if that
after saying oh let’s see if that evaluates nope unexpected token one
evaluates nope unexpected token one
evaluates nope unexpected token one parents too much cool see that now
parents too much cool see that now
parents too much cool see that now greeting is a function so if I just call
greeting is a function so if I just call
greeting is a function so if I just call greeting you see that after a second
greeting you see that after a second
greeting you see that after a second there in updates to a low so you see
there in updates to a low so you see
there in updates to a low so you see that observable is very much aware of
that observable is very much aware of
that observable is very much aware of the concept of promises and will kind of
the concept of promises and will kind of
the concept of promises and will kind of just I’ll figure this out so I can
just I’ll figure this out so I can
just I’ll figure this out so I can actually assign this to a variable just
actually assign this to a variable just
actually assign this to a variable just call it current greeting there BAM and
call it current greeting there BAM and
call it current greeting there BAM and then I’m going to dictate it it urged
then I’m going to dictate it it urged
then I’m going to dictate it it urged let me with reference count greeting
let me with reference count greeting
let me with reference count greeting from here current greeting you see okay
from here current greeting you see okay
from here current greeting you see okay that evaluates to hello 25 because
that evaluates to hello 25 because
that evaluates to hello 25 because JavaScript doesn’t make sense
JavaScript doesn’t make sense
JavaScript doesn’t make sense let me delete this
let me delete this
let me delete this sell here so that we don’t get too
sell here so that we don’t get too
sell here so that we don’t get too confused I would really like
confused I would really like
confused I would really like drag-and-drop support here so that I
drag-and-drop support here so that I
drag-and-drop support here so that I could drag reading down because they
could drag reading down because they
could drag reading down because they order of these things don’t make sense
order of these things don’t make sense
order of these things don’t make sense perhaps Ursa can I move them somehow I
perhaps Ursa can I move them somehow I
perhaps Ursa can I move them somehow I don’t know how to
don’t know how to
don’t know how to what’s the hotkey for moving I don’t
what’s the hotkey for moving I don’t
what’s the hotkey for moving I don’t know there’s probably some oh there
know there’s probably some oh there
know there’s probably some oh there there cool now have a look at this when
there cool now have a look at this when
there cool now have a look at this when I change hello here to buy and it
I change hello here to buy and it
I change hello here to buy and it updates after a second notice how sleek
updates after a second notice how sleek
updates after a second notice how sleek this is that the environment is aware of
this is that the environment is aware of
this is that the environment is aware of promises and constantly re-evaluate them
promises and constantly re-evaluate them
promises and constantly re-evaluate them all the time it’s just so incredibly
all the time it’s just so incredibly
all the time it’s just so incredibly sleek to work with let me refer this
sleek to work with let me refer this
sleek to work with let me refer this thing to be a delay function delay
thing to be a delay function delay
thing to be a delay function delay milliseconds and we’re gonna call it
milliseconds and we’re gonna call it
milliseconds and we’re gonna call it there and then it’s gonna be now so
there and then it’s gonna be now so
there and then it’s gonna be now so delay is now a function that returns a
delay is now a function that returns a
delay is now a function that returns a promise that resolves after its certain
promise that resolves after its certain
promise that resolves after its certain amount of milliseconds and as you see
amount of milliseconds and as you see
amount of milliseconds and as you see here now these cells that depend on
here now these cells that depend on
here now these cells that depend on having but the function greeting exists
having but the function greeting exists
having but the function greeting exists they are now broken because you know
they are now broken because you know
they are now broken because you know that make sense so there’s this concept
that make sense so there’s this concept
that make sense so there’s this concept in in in also a book called blocks I
in in in also a book called blocks I
in in in also a book called blocks I think they’re called blocks whatever and
think they’re called blocks whatever and
think they’re called blocks whatever and I want to call this numbers and I’m
I want to call this numbers and I’m
I want to call this numbers and I’m gonna create blocks so this is not an
gonna create blocks so this is not an
gonna create blocks so this is not an object literal that I’m creating now
object literal that I’m creating now
object literal that I’m creating now this is a this is a block so this can do
this is a this is a block so this can do
this is a this is a block so this can do the churn so blocks are kind of you can
the churn so blocks are kind of you can
the churn so blocks are kind of you can think of them as probably if ease like
think of them as probably if ease like
think of them as probably if ease like it’s just it’s like a function that is
it’s just it’s like a function that is
it’s just it’s like a function that is immediately evaluated so you can it’s
immediately evaluated so you can it’s
immediately evaluated so you can it’s kind of like an implicit and place it
kind of like an implicit and place it
kind of like an implicit and place it like this this is kind of what it looks
like this this is kind of what it looks
like this this is kind of what it looks like but but it also has it’s kind of
like but but it also has it’s kind of
like but but it also has it’s kind of like an implicit a sinc function as well
like an implicit a sinc function as well
like an implicit a sinc function as well so I can just
so I can just
so I can just if I do this delay 10 1000 and I just
if I do this delay 10 1000 and I just
if I do this delay 10 1000 and I just say oh wait and then return tap all
say oh wait and then return tap all
say oh wait and then return tap all right 17 and I’ll play that see that oh
right 17 and I’ll play that see that oh
right 17 and I’ll play that see that oh it waits a second and then it returns a
it waits a second and then it returns a
it waits a second and then it returns a 1017 and it’s also an implicit generator
1017 and it’s also an implicit generator
1017 and it’s also an implicit generator wait what I’m gonna let that sink in a
wait what I’m gonna let that sink in a
wait what I’m gonna let that sink in a bit because I didn’t even know that a
bit because I didn’t even know that a
bit because I didn’t even know that a synchronous generators was a thing and
synchronous generators was a thing and
synchronous generators was a thing and it’s it’s amazingly useful in the
it’s it’s amazingly useful in the
it’s it’s amazingly useful in the context of data analysis let me show you
context of data analysis let me show you
context of data analysis let me show you let me do a while true and we’re going
let me do a while true and we’re going
let me do a while true and we’re going to do let I equals 0 and we’re going to
to do let I equals 0 and we’re going to
to do let I equals 0 and we’re going to wait for 100 milliseconds and then we’re
wait for 100 milliseconds and then we’re
wait for 100 milliseconds and then we’re going to do I plus plus and then we’re
going to do I plus plus and then we’re
going to do I plus plus and then we’re going to yield I and can I run look at
going to yield I and can I run look at
going to yield I and can I run look at that that is so cool and of course I can
that that is so cool and of course I can
that that is so cool and of course I can depend on this so let me delete this
depend on this so let me delete this
depend on this so let me delete this cell here and just say like I can do
cell here and just say like I can do
cell here and just say like I can do hello plus numbers and see that this
hello plus numbers and see that this
hello plus numbers and see that this dynamic leary evaluates it might be that
dynamic leary evaluates it might be that
dynamic leary evaluates it might be that you are not familiar with generators or
you are not familiar with generators or
you are not familiar with generators or a synchronous functions then this is
a synchronous functions then this is
a synchronous functions then this is mind-bending to you you might want to
mind-bending to you you might want to
mind-bending to you you might want to check out my episode on generators here
check out my episode on generators here
check out my episode on generators here I also made a video on a sink await that
I also made a video on a sink await that
I also made a video on a sink await that you will probably find very interesting
you will probably find very interesting
you will probably find very interesting throws out if if this confuses you
throws out if if this confuses you
throws out if if this confuses you because this is going to be way more
because this is going to be way more
because this is going to be way more confusing later all right
confusing later all right
confusing later all right besides just being cool is there
besides just being cool is there
besides just being cool is there something that we can actually use this
something that we can actually use this
something that we can actually use this for let me show you but so there’s
for let me show you but so there’s
for let me show you but so there’s there’s an end point that I have for on
there’s an end point that I have for on
there’s an end point that I have for on the Fun Fun forum which is the private
the Fun Fun forum which is the private
the Fun Fun forum which is the private forum for for patrons where people can
forum for for patrons where people can
forum for for patrons where people can in their profile
in their profile
in their profile just insert arbitrary JSON and this is
just insert arbitrary JSON and this is
just insert arbitrary JSON and this is exposed through an endpoint that all
exposed through an endpoint that all
exposed through an endpoint that all other former members can use so you can
other former members can use so you can
other former members can use so you can use this to kind of create dump services
use this to kind of create dump services
use this to kind of create dump services without my involvement let me just show
without my involvement let me just show
without my involvement let me just show you what it looks like so I’m just gonna
you what it looks like so I’m just gonna
you what it looks like so I’m just gonna run that okay if I just fetch it it it
run that okay if I just fetch it it it
run that okay if I just fetch it it it gives a it gives a response object which
gives a it gives a response object which
gives a it gives a response object which is not very useful to us let me evaluate
is not very useful to us let me evaluate
is not very useful to us let me evaluate you know we can actually do do a block
you know we can actually do do a block
you know we can actually do do a block here and await this miss fetch put it
here and await this miss fetch put it
here and await this miss fetch put it into a response and then we and do a
into a response and then we and do a
into a response and then we and do a body do you know what we can do this
body do you know what we can do this
body do you know what we can do this with bones dot JSON and we just return
with bones dot JSON and we just return
with bones dot JSON and we just return that all right so we get some this is
that all right so we get some this is
that all right so we get some this is what it looks like it’s just a username
what it looks like it’s just a username
what it looks like it’s just a username on the left side and then maybe JSON on
on the left side and then maybe JSON on
on the left side and then maybe JSON on the right side so members are highly
the right side so members are highly
the right side so members are highly encouraged to insert stuff that will
encouraged to insert stuff that will
encouraged to insert stuff that will will break the applications of other
will break the applications of other
will break the applications of other users let me close that for a bit let’s
users let me close that for a bit let’s
users let me close that for a bit let’s look at my Jason so I want to how let’s
look at my Jason so I want to how let’s
look at my Jason so I want to how let’s assign this to a variable we’re gonna
assign this to a variable we’re gonna
assign this to a variable we’re gonna call it old data worst variable name I’m
call it old data worst variable name I’m
call it old data worst variable name I’m gonna create a new cell I’m going to do
gonna create a new cell I’m going to do
gonna create a new cell I’m going to do all data
all data
all data and check out my user which has mpj so
and check out my user which has mpj so
and check out my user which has mpj so here’s some Jason let’s say this is just
here’s some Jason let’s say this is just
here’s some Jason let’s say this is just a JSON string so let me do a json.parse
percent up okay
percent up okay lookie lookie here’s an object so this
lookie lookie here’s an object so this
lookie lookie here’s an object so this is a pretty cool thing there is I can
is a pretty cool thing there is I can
is a pretty cool thing there is I can show you actually let’s go to fun fun
show you actually let’s go to fun fun
show you actually let’s go to fun fun forum cow and their ears a blow show you
forum cow and their ears a blow show you
forum cow and their ears a blow show you was and there’s this pretty cool map
was and there’s this pretty cool map
was and there’s this pretty cool map that valise has made which is moderator
that valise has made which is moderator
that valise has made which is moderator on the front of inform it’s currently
on the front of inform it’s currently
on the front of inform it’s currently broken because I just rewrote this
broken because I just rewrote this
broken because I just rewrote this endpoint but it basically shows you all
endpoint but it basically shows you all
endpoint but it basically shows you all the locations of of members of the font
the locations of of members of the font
the locations of of members of the font on forum that has put their stuff in
on forum that has put their stuff in
on forum that has put their stuff in there in the hackable json endpoint so
there in the hackable json endpoint so
there in the hackable json endpoint so here’s my location in gothenburg and you
here’s my location in gothenburg and you
here’s my location in gothenburg and you need to place it in the user map
need to place it in the user map
need to place it in the user map location know that is what the app
location know that is what the app
location know that is what the app expects you to do let’s actually have a
expects you to do let’s actually have a
expects you to do let’s actually have a have a have a look at at that this is my
have a have a look at at that this is my
have a have a look at at that this is my my location let’s let’s do user location
my location let’s let’s do user location
my location let’s let’s do user location lam there now it would be pretty cool if
lam there now it would be pretty cool if
lam there now it would be pretty cool if this location was live updating when I
this location was live updating when I
this location was live updating when I updated it on the forum what I mean by
updated it on the forum what I mean by
updated it on the forum what I mean by that let’s actually go to my user
that let’s actually go to my user
that let’s actually go to my user profile and I just changed my caption
profile and I just changed my caption
profile and I just changed my caption here to get nose lulu lululu oopps
here to get nose lulu lululu oopps
here to get nose lulu lululu oopps and save changes and go
and save changes and go
and save changes and go – observable and you know I just really
– observable and you know I just really
– observable and you know I just really ate this cell here and you see that lulu
ate this cell here and you see that lulu
ate this cell here and you see that lulu lululu it would be cool if i didn’t have
lululu it would be cool if i didn’t have
lululu it would be cool if i didn’t have to do that if there was some some way of
to do that if there was some some way of
to do that if there was some some way of us to to listen to the changes and have
us to to listen to the changes and have
us to to listen to the changes and have this thing update life turns out that
this thing update life turns out that
this thing update life turns out that there is the first thing that i want to
there is the first thing that i want to
there is the first thing that i want to do is we’re gonna did assign this to a
do is we’re gonna did assign this to a
do is we’re gonna did assign this to a variable I’m gonna call it left or user
variable I’m gonna call it left or user
variable I’m gonna call it left or user map yeah user hash so that we don’t
map yeah user hash so that we don’t
map yeah user hash so that we don’t confuse ourselves and we need to await
confuse ourselves and we need to await
confuse ourselves and we need to await that let me return user hash so that you
that let me return user hash so that you
that let me return user hash so that you can see what we’re thinking about yes it
can see what we’re thinking about yes it
can see what we’re thinking about yes it still looks good now there’s actually a
still looks good now there’s actually a
still looks good now there’s actually a WebSocket endpoint the way you do a
WebSocket endpoint the way you do a
WebSocket endpoint the way you do a WebSocket is new WebSocket let the duty
WebSocket is new WebSocket let the duty
WebSocket is new WebSocket let the duty to and usual copy this is the endpoint
to and usual copy this is the endpoint
to and usual copy this is the endpoint the right so it’s WebSocket secure and
the right so it’s WebSocket secure and
the right so it’s WebSocket secure and it’s fun fun Automator Heroku app calm
it’s fun fun Automator Heroku app calm
it’s fun fun Automator Heroku app calm hacker palliation basically the same
hacker palliation basically the same
hacker palliation basically the same thing as this end point but just
thing as this end point but just
thing as this end point but just WebSocket and we’re gonna pull this
WebSocket and we’re gonna pull this
WebSocket and we’re gonna pull this socket socket and then we’re going to
socket socket and then we’re going to
socket socket and then we’re going to look at the bits so get on message and
look at the bits so get on message and
look at the bits so get on message and this gives us a function or and we gave
this gives us a function or and we gave
this gives us a function or and we gave it a function and that take the function
it a function and that take the function
it a function and that take the function accepts and event and no console.log
accepts and event and no console.log
accepts and event and no console.log we can distribute the juji juji you know
we can distribute the juji juji you know
we can distribute the juji juji you know what I’m going to do this in a separate
what I’m going to do this in a separate
what I’m going to do this in a separate block so that we can think about one
block so that we can think about one
block so that we can think about one thing at a time
thing at a time
thing at a time oh there we go there we go we’re gonna
oh there we go there we go we’re gonna
oh there we go there we go we’re gonna console.log out event dot data no data
console.log out event dot data no data
console.log out event dot data no data is data and run that or start running
is data and run that or start running
is data and run that or start running that dump up the console here data is
that dump up the console here data is
that dump up the console here data is ping ping all right yeah so it pings us
ping ping all right yeah so it pings us
ping ping all right yeah so it pings us every seems like it’s ends ping as data
every seems like it’s ends ping as data
every seems like it’s ends ping as data every every five seconds or so let me
every every five seconds or so let me
every every five seconds or so let me change my profile change it back to not
change my profile change it back to not
change my profile change it back to not Lulu what is happening you know some
Lulu what is happening you know some
Lulu what is happening you know some weird order complaining here which I
weird order complaining here which I
weird order complaining here which I don’t want it to do there oh my god what
don’t want it to do there oh my god what
don’t want it to do there oh my god what what is happening like OSX is confused
what is happening like OSX is confused
what is happening like OSX is confused about mine what this field is okay let’s
about mine what this field is okay let’s
about mine what this field is okay let’s have a look and you see era that if we
have a look and you see era that if we
have a look and you see era that if we now get some new new the updated user
now get some new new the updated user
now get some new new the updated user here so we want to want to update this
here so we want to want to update this
here so we want to want to update this old data objects cache with that and
old data objects cache with that and
old data objects cache with that and then feed that up to this year so how do
then feed that up to this year so how do
then feed that up to this year so how do we do that
we do that
we do that well if I look at the old data endpoint
well if I look at the old data endpoint
well if I look at the old data endpoint we could start yielding things here
we could start yielding things here
we could start yielding things here because it’s an it’s a generator but in
because it’s an it’s a generator but in
because it’s an it’s a generator but in order to do that we need to be able to
order to do that we need to be able to
order to do that we need to be able to kind of wait for for the stream or for
kind of wait for for the stream or for
kind of wait for for the stream or for the port D for the data and there’s no
the port D for the data and there’s no
the port D for the data and there’s no way of us do that so
way of us do that so
way of us do that so refactor this to be a kind of promise
refactor this to be a kind of promise
refactor this to be a kind of promise we’re going to call this function next
and and did it’s going to return a new
and and did it’s going to return a new promise that resolves to do boom boom
promise that resolves to do boom boom
promise that resolves to do boom boom [Music]
[Music]
[Music] there we go and on the message we’re
there we go and on the message we’re
there we go and on the message we’re going to give event dot data it’s not
going to give event dot data it’s not
going to give event dot data it’s not the ping
the ping
the ping we’re don’t care about the ping you just
we’re don’t care about the ping you just
we’re don’t care about the ping you just want the user updates then we’re going
want the user updates then we’re going
want the user updates then we’re going to resolve it with event dot of data so
to resolve it with event dot of data so
to resolve it with event dot of data so look at that let’s call it let’s call
look at that let’s call it let’s call
look at that let’s call it let’s call its let’s call this a function and let’s
its let’s call this a function and let’s
its let’s call this a function and let’s call it start streaming something like
call it start streaming something like
call it start streaming something like that and M then let’s jump to this one
that and M then let’s jump to this one
that and M then let’s jump to this one and we do so let’s create a block let’s
and we do so let’s create a block let’s
and we do so let’s create a block let’s assign next to the function that is
assign next to the function that is
assign next to the function that is returned from start streaming see what
returned from start streaming see what
returned from start streaming see what this looks like
this looks like
this looks like and then we turn next what happens
and then we turn next what happens
and then we turn next what happens nothing is happening
nothing is happening
nothing is happening so what makes sense because there’s no
so what makes sense because there’s no
so what makes sense because there’s no user updates let’s let’s update and I
user updates let’s let’s update and I
user updates let’s let’s update and I asked lululu and oh sorry about that
asked lululu and oh sorry about that
asked lululu and oh sorry about that Save Changes see order get something oh
Save Changes see order get something oh
Save Changes see order get something oh we did boom
we did boom
we did boom so now this next function will return
so now this next function will return
so now this next function will return the next thing in the stream so if I
the next thing in the stream so if I
the next thing in the stream so if I actually just
actually just
actually just J son dot parse and I need to await this
J son dot parse and I need to await this
J son dot parse and I need to await this as well otherwise frustration dot parse
as well otherwise frustration dot parse
as well otherwise frustration dot parse wants an actual value nor the promise
wants an actual value nor the promise
wants an actual value nor the promise see what this looks like and I’m gonna
see what this looks like and I’m gonna
see what this looks like and I’m gonna update my profile again Moodle and save
update my profile again Moodle and save
update my profile again Moodle and save the changes and now you see here oh it’s
the changes and now you see here oh it’s
the changes and now you see here oh it’s in JSON object and close this because we
in JSON object and close this because we
in JSON object and close this because we know it works
know it works
know it works now I want to because this is just doing
now I want to because this is just doing
now I want to because this is just doing this once I want to make sure that this
this once I want to make sure that this
this once I want to make sure that this does it like shows it as as we as we
does it like shows it as as we as we
does it like shows it as as we as we update so let’s let’s just call this me
update so let’s let’s just call this me
update so let’s let’s just call this me and then me dot so the look we want the
and then me dot so the look we want the
and then me dot so the look we want the we actually want to parse out the
we actually want to parse out the
we actually want to parse out the hackable jason we’re gonna call this
hackable jason we’re gonna call this
hackable jason we’re gonna call this hackable I’m gonna do me don’t hack
hackable I’m gonna do me don’t hack
hackable I’m gonna do me don’t hack JSON new Jason parse it’s jason within
JSON new Jason parse it’s jason within
JSON new Jason parse it’s jason within the JSON it’s all very confusing
the JSON it’s all very confusing
the JSON it’s all very confusing packable dot user location and
packable dot user location and
packable dot user location and lalalalala what do we have
lalalalala what do we have
lalalalala what do we have I want the caption caption it’s returned
I want the caption caption it’s returned
I want the caption caption it’s returned on what happens and let me update it
on what happens and let me update it
on what happens and let me update it again
again
again substance of some stuff mandatory and it
substance of some stuff mandatory and it
substance of some stuff mandatory and it was an unexpected end of Jason input why
was an unexpected end of Jason input why
was an unexpected end of Jason input why is that that confuses me a bit perhaps
is that that confuses me a bit perhaps
is that that confuses me a bit perhaps it isn’t valid Jason let’s actually
it isn’t valid Jason let’s actually
it isn’t valid Jason let’s actually check it perhaps I’ve messed it up
me paste this into a new cell yeah I
me paste this into a new cell yeah I think I deleted I accidentally deleted a
think I deleted I accidentally deleted a
think I deleted I accidentally deleted a curly bracket thing at the end so
curly bracket thing at the end so
curly bracket thing at the end so actually let me fix up their curly what
actually let me fix up their curly what
actually let me fix up their curly what curly bracket all right so now instead
curly bracket all right so now instead
curly bracket all right so now instead of having this stream just once I wanted
of having this stream just once I wanted
of having this stream just once I wanted to be a generator so I just do
to be a generator so I just do
to be a generator so I just do wild true and I’m gonna do its this
wild true and I’m gonna do its this
wild true and I’m gonna do its this inside of the the wild true didn’t do
inside of the the wild true didn’t do
inside of the the wild true didn’t do there we go and now instead of returning
there we go and now instead of returning
there we go and now instead of returning we’re going to be yielding so yield just
we’re going to be yielding so yield just
we’re going to be yielding so yield just it’s kind of like a possible return it’s
it’s kind of like a possible return it’s
it’s kind of like a possible return it’s kinda like instead of terminating the
kinda like instead of terminating the
kinda like instead of terminating the function just pauses all right just hey
function just pauses all right just hey
function just pauses all right just hey I’ll give you whatever is running me the
I’ll give you whatever is running me the
I’ll give you whatever is running me the generator up some value and then I’m
generator up some value and then I’m
generator up some value and then I’m going to continue running file out here
going to continue running file out here
going to continue running file out here and going to change this string here two
and going to change this string here two
and going to change this string here two moves back again and I’m going to hit
moves back again and I’m going to hit
moves back again and I’m going to hit save take a look here and you see that
save take a look here and you see that
save take a look here and you see that Boop it updates let me do that again
Boop it updates let me do that again
Boop it updates let me do that again [Music]
[Music]
[Music] say that again and it updates and you
say that again and it updates and you
say that again and it updates and you know we could call this label let’s now
know we could call this label let’s now
know we could call this label let’s now actually integrate this into the old
actually integrate this into the old
actually integrate this into the old data thing so instead of returning user
data thing so instead of returning user
data thing so instead of returning user hash here we’re going to yield it and
hash here we’re going to yield it and
hash here we’re going to yield it and then we are going to start
then we are going to start
then we are going to start do next I’m gonna start streaming grab
do next I’m gonna start streaming grab
do next I’m gonna start streaming grab this actually and go back to old data
this actually and go back to old data
this actually and go back to old data while we’re true we have this gonna grab
while we’re true we have this gonna grab
while we’re true we have this gonna grab your update to use your hash and we’re
your update to use your hash and we’re
your update to use your hash and we’re gonna grab like me don’t use your name
and sign that with the hacker Bob JSON
and sign that with the hacker Bob JSON because that’s how it’s structured and
because that’s how it’s structured and
because that’s how it’s structured and once we’re done with that we are going
once we’re done with that we are going
once we’re done with that we are going to the entire user hash and we know this
to the entire user hash and we know this
to the entire user hash and we know this BAM
BAM
BAM let’s actually delete these observable
let’s actually delete these observable
let’s actually delete these observable numbers as well because they have been
numbers as well because they have been
numbers as well because they have been distracting us for long enough and here
distracting us for long enough and here
distracting us for long enough and here let’s just call this mpj and as we see
let’s just call this mpj and as we see
let’s just call this mpj and as we see here now
here now
here now this refers to like old like mpj in the
this refers to like old like mpj in the
this refers to like old like mpj in the old day – so like if you remember this
old day – so like if you remember this
old day – so like if you remember this is a hash of all the users and now we’re
is a hash of all the users and now we’re
is a hash of all the users and now we’re referring to an PJ and the user
referring to an PJ and the user
referring to an PJ and the user application here so before this was now
application here so before this was now
application here so before this was now like we have to refresh for this to
like we have to refresh for this to
like we have to refresh for this to update however if all of this works now
update however if all of this works now
update however if all of this works now I should be able to change this here and
I should be able to change this here and
I should be able to change this here and Save Changes and this should live update
Save Changes and this should live update
Save Changes and this should live update and it does see that I’m gonna save
and it does see that I’m gonna save
and it does see that I’m gonna save again boom and it’s I’m going to publish
again boom and it’s I’m going to publish
again boom and it’s I’m going to publish this this notebook here so that you can
this this notebook here so that you can
this this notebook here so that you can play around with it just find it in the
play around with it just find it in the
play around with it just find it in the link in the episode description and I
link in the episode description and I
link in the episode description and I think that this is very cool
think that this is very cool
think that this is very cool observability make so much sense for a
observability make so much sense for a
observability make so much sense for a playbook environment it’s so easy to
playbook environment it’s so easy to
playbook environment it’s so easy to work with
work with
work with javascript is
javascript is
javascript is also stupendously useful for stuff like
also stupendously useful for stuff like
also stupendously useful for stuff like this it’s really good at it
this it’s really good at it
this it’s really good at it by the way something that I haven’t even
by the way something that I haven’t even
by the way something that I haven’t even showed you is that you can just pull in
showed you is that you can just pull in
showed you is that you can just pull in NPM modules here like randa or you know
NPM modules here like randa or you know
NPM modules here like randa or you know whatever you need you can also render
Google Maps and HTML right into here so
Google Maps and HTML right into here so that you can visualize this map and like
that you can visualize this map and like
that you can visualize this map and like do all kinds of shenanigans it’s really
do all kinds of shenanigans it’s really
do all kinds of shenanigans it’s really really nice you’re probably going to see
really nice you’re probably going to see
really nice you’re probably going to see me doing quite a bit of more observable
me doing quite a bit of more observable
me doing quite a bit of more observable stuff over the coming months because
stuff over the coming months because
stuff over the coming months because this is a product that I’m I’m very
this is a product that I’m I’m very
this is a product that I’m I’m very excited about I hope you found that
excited about I hope you found that
excited about I hope you found that useful if you’re confused please post
useful if you’re confused please post
useful if you’re confused please post questions down below or if you are a
questions down below or if you are a
questions down below or if you are a patron you can post it on the dedicated
patron you can post it on the dedicated
patron you can post it on the dedicated discussion topic on the Fun Fun forum by
discussion topic on the Fun Fun forum by
discussion topic on the Fun Fun forum by clicking here or in the link in the
clicking here or in the link in the
clicking here or in the link in the episode description if you are new well
episode description if you are new well
episode description if you are new well come you have just watched an episode of
come you have just watched an episode of
come you have just watched an episode of fun fun function a release is every
fun fun function a release is every
fun fun function a release is every Monday morning Oh 800 GMT if you are
Monday morning Oh 800 GMT if you are
Monday morning Oh 800 GMT if you are forgetful you can subscribe here so that
forgetful you can subscribe here so that
forgetful you can subscribe here so that you don’t miss it or just watch another
you don’t miss it or just watch another
you don’t miss it or just watch another episode right now by clicking here I am
episode right now by clicking here I am
episode right now by clicking here I am npj until next Monday morning stay
npj until next Monday morning stay
npj until next Monday morning stay curious
Please follow and like us: