Separate Pure & Impure Code

[00:00:00]
>> Let's go ahead and just make a fetch. Start off by saying getJSON, how's that? When we getJSON, that takes in a url, preferably. And we'll just grab this fetch API, or let's do the getJSON part of it. We could make two functions, as typically advised, right? It would give you a fetch function, which is a Task, and then we would map over the Task at the JSON.

[00:00:26]
Okay, we'll do that. [LAUGH] All right. So let's do that. Hide all this stuff. So we're gonna do getJSON, or we'll just do fetchIt [LAUGH]. All right, takes a url. And let's bring in Task from our types. For your convenience I've added types. No, I haven't, done better while they're doing it?

[00:00:56]
Yeah, there it is. So, let's start by fetching it. And so, here's what I'm gonna do. I'm gonna get rid of this stuff. We're gonna start by separating our effects, our effects folder, we're gonna write a boundary, this is our colors stuff, and everything above it is gonna be pure.

[00:01:15]
So, fetchIt needs to be in a task, cuz it's above the line. Write address to be established where we can run effects and where we can't. And here we can do, then. Or no, this is just, yeah, then(res), catch(res). Wow, what is going on? There we go. It was like, Task, hey, it's a Task, I know it's a Task, I'm gonna tell you better [LAUGH].

[00:01:47]
Sorry, I'm still learning this from them, it's been a hard road. And this is not, this is no longer, it's just a url. Cool. So let's try out our new function, fetchIt with their url. And why don't we make this into a pure thing? Here you make url, or getURL, open weather.

[00:02:09]
GetOpenWeather, that's nice. All right. So it takes the url, or takes a zip. And, the API key, static, never changes. We can pass it in, and we can find out clever ways to do that. I'm just gonna leave it alone, I still consider this pure. So let's go down here.

[00:02:30]
We'll call fetchIt with the getOpenWeather, and we'll give it our zip. So where's the zip coming from? Well, the zip comes from this thing. So I hit Go. So let's just, we're below the line, so let's make a little app here. And this is where all the dirty, nasty stuff is gonna happen.

[00:02:54]
So we're gonna go ahead and, get our buttons. Let's see, just bring in a document, you can pass a document in here if you want. I don't care, I mean, whatever length. GetElementById, and we've got a Go button, that's out goButton. And then we have input, which is a zip.

[00:03:18]
And then we have our results, just results. And then we'll add our event listener down here on the goButton, goButton, getButton, goButton, addEventListener, and we'll go ahead and say, click. And when we click it, we don't care about the e there, we'll just say input.value.trial, Maybe? That'll be our zipCode.

[00:03:49]
And then we'll have the zipCode too fetchIt. Get the open weather API with the zipCode. And then we're gonna fork it. Console.error, console.log, cool. Now, stop me if you have questions or qualms. But, what I'm doing is, saying, listen, we're gonna build a nice app. And look, I'm already doing two things right here, in the trim.

[00:04:19]
I can push all of this above the line. We wanna push as much above the line as we can. So why don't we do, how about this? A little open weather type. And this little module, we can bring this new file or not, depending, whatever we want, and we'll be like getWeather, how's that?

[00:04:41]
Now we getOpenWeather. Just the same function, just takes the zip. But how aobut, it'd be the composition. Compose, makeUrl. What. No, this is getOpenWeather, that's the url. That's a terrible name. [LAUGH] makeWeatherUrl. All right, makeWeatherUrl, and then we'll compose that with fetchIt. Cool. So this is a function that returns a Task, it takes a zip, and then it makes a Task.

[00:05:17]
And it's a nice, little open weather API. So let's do that. I think I need to bring in compose from Ramda. Finally down here we'll get rid of this silly stuff, and we'll do openWeather.getWeather. It's bad names, is there anyone who has a better name than that? It's like, openWeather and getWeather's a silly thing.

[00:05:41]
But, let's see what happens-.
>> With fecth.
>> What is it, getFecth?
>> Or just fetch.
>> Yeah, fetchWeather? Response, course, redirected, false, headers, body. I did not call JSON on it. So, sorry, Mark, was it fetchWeather?
>> Or just fetch.
>> Fetch, openWeather.fetch, I like it. Fetch, fetchIt.

[00:06:08]
Cool. So, we've got that. Sorry, this is kind of. I don't have the most screen real estate right here, actually, this is all nonsense, we don't care about this stuff. Whoa, what did I just do? I made a new thing. Okay, cool. Here's a little bit more, a bit more for everyone to see.