Hello everybody, welcome back to Views on View. I am Steve Edwards, the host with the Face for Radio and the voice for being a mime, but I'm still your host with me as my partner today, flying as co-captain, or well, let's see, first officer. I don't know what we'll call him. It's Cody Bondacue, how you doing, Cody?
Cody Bontecou (00:20.177)
Hey internet, I'm doing well, happy to be home.
Yeah, today's the first day for what it's worth. I'm here in the Portland area, and over the past couple of weeks, it's gotten colder. I'm having to actually use my space heater in my office, and it sucks. I want warm weather. Don't drag me into fall kicking and screaming it, man. Last year was awesome around here, because it was really warm to the end of October, and now it's getting cold already. So.
Cody Bontecou (00:32.261)
Cody Bontecou (00:43.381)
Yeah, I actually had to put pants on this morning, so I feel your pain.
Me too, sweats too, and a sweatshirt. It's like, ah. Anyway, enough about that. Our special guest today is Mr. Alexander Gekov. How you doing, Alex?
Aleksandar Gekov (00:48.942)
Cody Bontecou (00:49.594)
Aleksandar Gekov (00:59.978)
Hey, thank you all, I'm doing well.
and enhancing our reputation as a worldwide podcast. Alex is coming to us from, I believe, Bulgaria, correct? All right. So before we dive into the topic and Alex's deep knowledge of Vue and Nuxt, why don't you tell us a little about yourself, Alex, your development history and how you got into Vue and Nuxt and why people should give you money and so on.
Aleksandar Gekov (01:11.946)
Aleksandar Gekov (01:29.438)
Okay, yeah, so now it's September, I've actually turned 23 this month. And I actually graduated from university in July. But yeah, usually maybe I can start from earlier when I decided to actually like study computer science and so on. Basically.
Like I've always been kind of interested in computers. You know, started off as like a script kiddie, running some scripts, hacking some online games. And then at some point I didn't know what to do, what to study. And I decided that I'd just go with this. And then I decided to actually study it in the Netherlands.
So I studied there the last four years and Yeah, my professional experience I started on the second year working for a biotech company And then we did yeah view and mapping and a lot of interesting stuff
Cody Bontecou (02:48.997)
just to uh... back in HTML1 or something like that. Oh, nice.
Yeah, we won't mention how old it makes me feel that I started in web development before he was born or the IT industry, but that's okay. We won't talk about that.
Aleksandar Gekov (02:52.287)
Ha ha ha.
Aleksandar Gekov (03:01.059)
I think it was HTML 0.5, you know, Windows 3.1. No, I kid you not, Windows 3.1. If you really want to go back in history, if you've ever seen the original IBM PC that had the green screen, and the commercials were really famous because IBM would use a little Charlie Chaplin type character.
Aleksandar Gekov (03:05.438)
Not even the one.
you know, as I was kicking up his heels at the end. My dad had one of those. He started doing some software development in the early, like 1980, 81 years. I can still remember him bringing it home and typing on the green screen. But I didn't get into the IT stuff till 95, mid 90s, but still that's, anyway, enough about my age.
Aleksandar Gekov (03:39.522)
Cody Bontecou (03:40.961)
Cody Bontecou (03:48.646)
I'm curious. I'm curious. I have a question actually. You said you were a script kiddie. What games were you hacking? What were you doing?
Aleksandar Gekov (03:56.711)
We started with like simple flash games, then League of Legends and some other stuff.
Cody Bontecou (04:04.461)
Yep. Super cool.
We like doing cheat codes to make you be able to do special stuff that nobody else could do type stuff.
Aleksandar Gekov (04:12.218)
Yeah, it was pretty fun, even though, yeah, obviously I got banned at some point, but you live and you learn.
Cody Bontecou (04:21.093)
Ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha
Cody Bontecou (04:24.897)
Yeah, that's fun. That's what got me into programming as well, is I would write bots for a video game called Runescape, if you're familiar. It's this funny little game, you just chop trees and stuff, and it turns out it's very easy to play it programmatically. And that's what got me into the programming world.
Aleksandar Gekov (04:33.951)
Yeah, yeah, yeah.
Aleksandar Gekov (04:42.698)
Yeah, it's actually nice because a lot of people actually get their interests from stuff like this.
Cody Bontecou (04:51.821)
Yep. Yeah. Now, especially with AI technology, you can build bots that are better than their anti-hack systems, their anti-botting systems. Like AI bots are taking over video games. It's amazing. But sure. So you're doing, you're working at, you said a biotech company, you're doing mapping. Are you mapping tree? What sort of things are you mapping?
Aleksandar Gekov (05:02.58)
Aleksandar Gekov (05:15.878)
Yeah, so I actually worked there until this month. But what we were doing there, we were basically, so we had some microscopes, which had like automated image taking. And then we analyzed those images with some machine learning.
And at the end, we had to display these images in some sort of map on the web portal. And these were like really big images, like 20,000 by 20,000 pixels. So it was very interesting how we managed to actually integrate the zooming and seeing all the little like microscopic level of details in the cells.
Cody Bontecou (06:14.673)
Yeah, that's it. I am muted, Steve.
Cody Bontecou (06:24.618)
Oh, Steve, you're muted.
Aleksandar Gekov (06:25.538)
Okay, let's edit that out and try again. Since I had the mute going on, I muted my mic to turn off my heater and forgot to turn it back on. Okay, so picking up. So, okay, so when you're talking about mapping, you're not talking about geographic mapping, where, you know, a map of the earth or a roadmap or a street map or some topographic, you're talking about mapping out an organism? Am I understanding it correctly or displaying it? Or what do you mean by mapping in that case?
Aleksandar Gekov (07:04.35)
Yeah, basically what you mentioned, like it's still a map. It has all the functionality of a map. It's just that it's not a geographic one. And actually, my talk at the View Summit, it was actually, I wanted to kind of focus on that part just to try to bring awareness that mapping is not only geographical.
as it is in most cases, but you can map a lot of things. And this is one interesting use case, like the biological use case, where you can map these images of cells to something that the user can experience like a map.
Yeah, I guess that makes sense. I mean, people talk about mind mapping. Um, you know, where you're trying to map out a process or, you know, just figure out your thought process on something. I don't think people have ever tried to do that with my mind, cause then they'd be run off screaming and yelling. But, uh, yeah, I guess that makes sense. Now, have you ever done with your, uh, the video, we'll put the link in the show notes, uh, it's from, uh, the, was it view global view global summit?
Aleksandar Gekov (07:58.57)
Aleksandar Gekov (08:08.792)
Aleksandar Gekov (08:24.236)
Have you done geographic mapping as well, like streeps and roads or topographic or anything like that?
Aleksandar Gekov (08:31.458)
Um, yeah, I've had like, um, only inside projects though, but, um, I can tell about one use case, uh, from university. Actually. Um, we, a couple of friends we gathered and we decided to make like, um, an application where you can take like, uh, walking meetings so you don't sit, uh, stationary and you just go for a walk. And, uh,
The application basically was keeping, like transcribing from voice to text the notes, and also creating like routes for the map so that you don't have to think about where you're going. Let's say you just say you're going on a 15 minute meeting and it makes like the route for it, which will take 15 minutes.
Cool. Have you ever used like Mapbox or any of that for generating your tiles and stuff like that?
Aleksandar Gekov (09:37.01)
Yeah, I've tried it, but most of the time I used OpenStreetMaps, I think, or just Google.
Open street map, right.
Yeah, I can remember back in, I don't remember what year it was. I want to say 2010. I started seeing this stuff coming into the Drupal world and the company that makes Mapbox was called Development Seed and they used to be the development shop. And then they switched over to doing mapping full time. And so Mapbox is their thing now. And I remember reading about Leaflet and sort of playing with it, but that was before jQuery and, and everything was server side, so it was a lot harder.
So now it's certain I'm tempted to play with leaflet again, just to see what I can come up with an open street map. For sure.
Aleksandar Gekov (10:26.082)
Yeah, definitely, yeah.
Cody Bontecou (10:27.873)
Yeah, it's a very approachable API. It's incredibly well-documented, very accessible. It's not too difficult to just plot anything you want. So OpenStreetMap provides the tiles to, whereas Leaflet is like the API that it...
You talking about OpenStreetMap?
Cody Bontecou (10:51.757)
interacts with the tiles, I guess. I believe Leaflet manages the zooming in and zooming out functionality. Yep, yep. And then whereas OpenStreetMaps just provides these tiles for free, you just have to give credit. Whereas Google also provides the tiles, but they also provide the API, but it's very expensive. Google Maps.
Aleksandar Gekov (10:58.764)
Yeah, they want to charge an arm and a leg, that's for sure.
Cody Bontecou (11:20.229)
Yeah, that's like a renowned API that's very expensive.
Aleksandar Gekov (11:20.747)
Yeah, I think.
Aleksandar Gekov (11:25.062)
I think if you use it in death mode, it's fine, but otherwise you get like a pop-up that's, okay, this is not, you need to pay for this. So yeah.
Cody Bontecou (11:36.685)
Yep. Yeah. I want to say Uber originally used Google Maps, but I think they all ended up building out their own solutions. I could be wrong there. Maybe that's something they're working towards. But.
Cody Bontecou (11:57.305)
But yeah, other than that, it's yeah, Leaflet, OpenStreetMaps, it's very approachable. I'm curious, how did you solve the problem? You said you, in this app you're talking about, you would say I was gonna take a 15 minute meeting, right? And so I wanna do a 15 minute walk. How did you generate that 15 minute walk? It was at random? Was there...
Aleksandar Gekov (12:22.528)
Aleksandar Gekov (12:27.143)
We kind of made it work in a hacky way. So let's say we presented it in university. So we just gathered manually with some automation, different routes based on, okay, this is five minutes, this is ten minutes and so on.
So we had like a big list of data of routes near university. So technically it would not work anywhere on the map, but it was good enough.
Cody Bontecou (13:04.413)
Okay, okay. So, so you were saying five minute walk and you always provided the same five minute route outside of your university, but here me in Hawaii I can't use this app and say I want to take a 20 minute walk and you'll generate a 20 minute route.
Aleksandar Gekov (13:24.411)
Yeah, I will assume that it's possible, but I haven't really looked into it. How exactly.
Cody Bontecou (13:33.849)
Yeah, that kind of gives me that, what is that? I can't think of the word right now, but it's that kind of famous algorithm, the traveling salesman, that kind of gives me the traveling salesman vibes of just infinite possibilities or near infinite.
Aleksandar Gekov (13:50.922)
Cody Bontecou (13:54.577)
But yeah, that's interesting. Is there any other APIs, any other areas of web that's really exciting you right now?
Aleksandar Gekov (14:05.998)
Well, right now, let me also mention the company that I switched to now, because it's actually also tied kind of with mapping. So the company that I'm working at now is called... I don't know if I should mention it or it's fine.
Cody Bontecou (14:28.386)
Oh no, you told me, unless you don't want to. Yeah.
Aleksandar Gekov (14:31.234)
I know it's fine. So it's called Office R&D and basically we offer like booking of rooms and desks and for flexible workspaces. So we also kind of have a map where you can view your office and your colleagues and also book meeting rooms and so on.
Cody Bontecou (14:56.897)
Okay, yeah, that totally makes sense. You're also, I imagine using Leaflet to map layers of the different floors, different layers within the buildings that you're managing. As well, yeah. Oh, that's pretty cool. So is, yeah, it's kind of perfect. I know a colleague of mine, I work at an agency, and so we're all on different projects, but that's one of the projects they were working on was...
Aleksandar Gekov (15:02.807)
Aleksandar Gekov (15:08.234)
So it was a nice transition.
Cody Bontecou (15:25.165)
was very similar of interactive maps within layers of an office building.
And so you can kind of, I think, like drag and drop, like, you know, if you want this table in this room or, you know, and it's all based on specific dimensions. Which, which kind of sounds, which is interesting. And I'm curious. There's so many little things you can work on that could be difficult. And like, how is there, are you manually inputting these data and crafting these maps or is that like a programmatic, is there a programmatic approach to generating them?
Aleksandar Gekov (16:04.038)
Yeah, well, at the current company, we have like something like a custom CMS, where we can actually put the data, like anybody from the company, and then it will populate the map. So, we basically generate these components with the coordinates. Also different, we have like different coordinate systems for various use cases.
But basically, yeah, we get the data from the API and then transform it into so that we can display it on the map. And in the last company, the biotech company, yeah, speaking of complexity, one of the most actually like complex stuff that I had to do was also integrate the...
leaflet map with the cells with WebGL. And I don't know if you're fans of WebGL, but it's really hard to debug it, especially when it's combined with something else. So we basically needed WebGL so that we can showcase some fluorescent capabilities of the cells, which the camera can capture.
And we had these, like you can imagine, some filters that manipulated the shaders in real time. So that was really beneficial for the end users, but it was really, really hard to implement.
Cody Bontecou (17:46.269)
And were you using this for like a three dimensional shading of these cells that you were looking at?
Aleksandar Gekov (17:54.543)
No, no, just 2D shading for like various substances within the cells. Yeah.
Cody Bontecou (18:02.285)
When I hear WebGL, I think 3JS, because I believe 3JS is built through WebGL, but that's not an area I have much experience with, because it is very complicated, very math heavy from what I've seen.
Aleksandar Gekov (18:12.191)
Aleksandar Gekov (18:19.836)
Yeah, hopefully I didn't have to do any 3D, but yeah. Yes, Steve?
So real quick, can we def-
You wanted to find what WebGL is for those of us who I had to type in what is WebGL real quick because I forgot I haven't used it before.
Aleksandar Gekov (18:31.059)
So WebGL is a web graphics library and it uses GLCL files which are the shaders. And as Cody mentioned it relies a lot on like geometry and mathematics and other stuff to actually create these shaders on some object. So that it can also be 3D.
which is all the fancy stuff that we see. I think Alvaro, he's working on a library for Vue that makes it easy to handle 3JS. But for my use case, I just use it for like 2D generation of shaders.
Ooh, and we're gonna be talking to Alvaro Saburido. Is that who you're talking about? Yeah, we're gonna be talking to him here in a few weeks. So that'll be something good to talk to him about.
Aleksandar Gekov (19:26.418)
Cody Bontecou (19:26.522)
Cody Bontecou (19:30.637)
Yeah, yeah, it's, and I'm curious, I don't know why, and I'm curious if you know the answer to this, like why we rely on such a complex API to do these things. Is it just very perform, is it just very, is that something we just can't do in Canvas or some other defined API? I guess that's just the place where we solve that problem.
Aleksandar Gekov (19:31.49)
because they're complex.
Aleksandar Gekov (19:59.678)
Yeah, I think like at some point from now, the WebGPU API is going to be released to browsers. So then maybe we'll see some new things forming, but until then, I think, yeah, this is like the most common way to do it, if you need 3D.
Cody Bontecou (20:24.049)
Cool. And what is the WebGPU API?
Aleksandar Gekov (20:28.782)
Um, yeah, so I think it's just a, um, better way to utilize the, uh, your, uh, laptop or PCs, uh, graphics cards to, uh, in the browser. So basically it will make things, uh, faster and you can probably use some native, uh, APIs that will probably help with, uh, yeah, with, uh,
with shaders and 3D.
Aleksandar Gekov (21:01.726)
I think it will also enable some more hardcore gaming in the browser, which also sounds nice. I looked at it some time ago, but haven't kept up to date.
Cody Bontecou (21:10.628)
Cody Bontecou (21:18.177)
Yep. Yeah, I'm looking at it right here. And that's one of the first lines. Web GPU is the successor of WebGL, providing better compatibility with modern GPUs. Oh, that's cool. Maybe that'll give us more like browser-based AI model integration as well, for like local first chat GPT clients or something, something crazy.
but I have to admit that's not my specialty. I don't get too deep into the zeros and ones.
Aleksandar Gekov (21:49.63)
Yeah, no, not me as well.
Cody Bontecou (21:52.495)
Ah, but that's cool. So is this something you looked at? Have you always believed you were going to become a map guy? Like this is where your career is taking you?
Aleksandar Gekov (22:07.134)
No, not really. Even at this point I don't consider myself tightly specializing in that area. Actually, for the past few weeks I had a few things going around. So I moved back to Bulgaria, obviously. And another reason that I kind of haven't uploaded recently.
is because with some friends we're building like a startup. And we are using of course Vue and Nuxt. But basically we're just experimenting with ways we can.
create a successful SaaS product in the HR field. So that has been occupying my mind recently. But yeah, I think I will, I have a few ideas on content that I would like to soon realize. Yeah.
Cody Bontecou (23:06.469)
Cody Bontecou (23:19.917)
Yeah, that's how I found you. Definitely, I'm a big fan of your YouTube videos. You're really great at teaching.
Aleksandar Gekov (23:28.022)
Thanks. I mean, I started it off as an experiment, but I definitely want to like, I don't want to leave it behind. Maybe I just need to find my own rhythm, maybe not upload every week, but every other week or something or once a month to just keep the consistency.
Cody Bontecou (23:36.314)
Cody Bontecou (23:47.238)
Now looking at your YouTube channel and then your own website, your blog at alexandergetkov.com, looks like you like to use Nuxt3. You've got a couple posts on intro to Nuxt3 and building with Nuxt3 and StoryBlock. So I'm just curious from your...
Do you use both Vue and Nuxt, or do you primarily use one or the other depending on, is it just depending on the use case, or what's your usage of those?
Aleksandar Gekov (24:30.514)
Yeah, so I've been using Nuxt in most cases. I think we had a project in the last company where we didn't incorporate Nuxt, but yeah, for me, like there's no reason not to go with Nuxt most of the time, because even if you don't utilize the server-side rendering, it still gives your application a little structure.
and you can do things quite fast. So, yeah, I don't see any reason for... Unless it's something that you really want to try out fast, then you don't need to scaffold the whole next application, but if you're building something, then I think it's very nice to use next.
Yeah, I mean, for what it's worth, my claim to fame that really rocketed me into starting was when I did an intro to NUXT's video course, Review Mastery. And ever since then, I've been having to fight off the autograph seekers. It's been crazy. But, uh, just kidding. But, uh, yeah, we've had, uh, we had Dan and Ro on two or three times here recently to talk about NUXT and everything that's coming in NUXT and a couple other people. So yeah, there's.
Aleksandar Gekov (25:42.306)
Crazy amount of stuff happening in the next ecosystem. And new and fancy things, for sure. For sure.
Cody Bontecou (26:07.386)
I'm kind of along the same lines as you, Alex. I struggle to find a use case for just pure view. Like you said, Nuxt solves many of the problems. And I think I was a big fan of Nuxt 2. And the move to Nuxt 3 was pretty rocky, pretty slow. And I think that had
maybe a bit of a negative impact on Nuxt. But I think now Nuxt 3 is very stable and most of the modules that we're used to with Nuxt 2 is now there are community support in Nuxt 3 and I think it's kind of exploding again. Like from my perspective, like Nuxt 3 just seems to be getting really big or much, much bigger than it was. And it's exciting to watch.
Aleksandar Gekov (26:56.334)
Yeah, I think that's the general consensus that Yeah, I remember also at the start when they reviewed it There were a lot of stuff that wasn't there yet, so it wasn't like ready to build an application with next three yet but from then on like I think it's Yeah, like bleeding catch what the
the guys are doing and really, I would even like, because I'm also, I've also used Next.js and if I have to like use one of them, I think that Next has some things that I just, yeah, I'm quite amazed by them that how they made it so structured and easy, yeah, it's easy to use.
Cody Bontecou (27:54.329)
So what server-side backend languages do you use? Are you like a node user? Are there other backend technologies that you use for when you do need to write server-side code?
Aleksandar Gekov (28:07.946)
Um, yeah, so first I started with actually PHP and Arvel, uh, which I actually enjoyed a lot. Um, but, uh, then I transitioned into my last job, which was, uh, C sharp and dotnet. And, but mostly for side projects and also my current job now, um, it's mostly node, uh, paired up with, um, some framework for the API like nest or.
Yeah, so it's interesting you mentioned PHP and Laravel because that's my day to day. I may work on a pretty large, huge application using PHP or Laravel and then I've, I won't beat this one to much to death because everybody knows it if they listen to this regularly. Have you ever used Inertia? Have you ever heard of Inertia.js?
Aleksandar Gekov (28:44.567)
Aleksandar Gekov (29:02.272)
I've heard of it but maybe if you can remind me about it.
It's really pretty sweet. What it does is it's sort of a glue layer more than anything else. And it was written by a guy named Jonathan Reinick who now works for Tailwind Labs. And it allows you to plug and play your backend with your frontend. So you can use Svelte or Vue or React. And I don't know about Angular if there's an adapter for that. And then you can use whatever backend you want to use. You want to use Ruby, you want to use Node, you want to use Laravel.
And I'm sure there's community adapters for other things if you really wanted to use something like Java or whatever. But what it does is it handles the communication between the front and the back end. So it hijacks your post request and just sends it. It stops it and then sends the data behind the scenes. And so in Laravel, since you're familiar with it, you would in your controller, you would use an inertia library, return inertia, tell it what component and it sends everything to your front end as props.
So for me it's awesome because I can use the tools that I'm already familiar with. And I have an app in production that I've had since May and it's crazy fast. It's so much faster and it's, you know, in my full time I'm using just the standard REST API from the Laravel backend to communicate that way. But this is so much faster and it's so much easier, right? And gives you a lot of flexibility. So anyway.
Aleksandar Gekov (30:33.43)
Nice, nice, yeah.
I started to get into node at one point and gave up just because I didn't have the time to really delve into it. And I was focusing more on the PHP anyway. But yeah, that's interesting. But I think the reason a lot of people use Nuxt is one, like you mentioned, it scaffold stuff out for you, right? You don't have to go into your view router and define your routes and what components attached to what route and all that kind of stuff is just based on your folder structure, which is that.
ironically what Inertia does with Laravel. And then if you really want to do some server-side rendering using your node familiarity and that kind of stuff, you can just plug it in. And I know in listening to Drew Baker, we haven't had him on for a while, but he's a big Next user for an agency in Los Angeles. The amount of stuff you can do with that back end processing is really quite amazing. You can do some cool stuff.
Aleksandar Gekov (31:32.587)
I saw I will take an auto look at it
Cody Bontecou (31:38.053)
So there was one thing you mentioned earlier, Alex, that I'm curious about. You said that you were updating these cell displays in real time. Were you using something like WebSockets for that solution? Or what made it specifically real time?
Aleksandar Gekov (31:48.683)
Aleksandar Gekov (31:59.058)
Yeah, basically WebSockets, we like the actual workflow was that the scientists plug in the device via USB and we have a service that's running in the background that actually sends this data to us via WebSockets. And from then on, we can manage and, yeah, update the shaders.
Cody Bontecou (32:29.712)
Did you write much of that real-time code?
Aleksandar Gekov (32:33.23)
Um, yeah, mostly I was focused on the web portal, but yeah, sometimes I had to tinker with it and see, see all the messages that we were sending.
Cody Bontecou (32:47.121)
Sure, sure. Did you ever run into some sort of limitation with the size of files or something there?
Aleksandar Gekov (32:58.014)
Um, yeah, we had a lot of, um, like downscaling of images, uh, high and lowest images, as well as, um, some weird, uh, naming conventions that we had to, um, specifically name our files in, uh, in, and also specific extensions. Um, but yeah, other than that, um,
It was pretty smooth, I would say.
Cody Bontecou (33:34.417)
Cool. I'm always thinking about real time and how to integrate that into my application as well. And so those are, it's just a fun problem to solve.
Aleksandar Gekov (33:48.694)
Yeah, we were using WebSockets and also just polling as a backup variant. And we were able to scale it if necessary. And we didn't experience any issues with that.
Cody Bontecou (34:10.421)
Yeah, so sorry, so I've read about long polling. And so from my understanding, polling is like the, kind of the pattern you use, used before WebSockets. And I'm curious if you could explain what that is. Like I've looked into it a little bit. Is it just like hitting an endpoint every so many seconds, or is there more to that?
Aleksandar Gekov (34:36.01)
Yeah, as far as I know, it's just communicating via HTTP, which is slower because you need to... Yeah, the protocol, you need to actually make the handshake and everything, and then the connection closes. So that's why, obviously, when you have the chance, WebSockets is better.
Cody Bontecou (35:07.361)
Yeah, oh, for sure. But, but, but for, so you do web sockets, you kind of need to be in control of the backend, right? Whereas like polling, you can implement that against any endpoint or am I understanding that incorrectly?
Aleksandar Gekov (35:08.514)
Aleksandar Gekov (35:25.286)
Um, no, I think, uh, yeah, it doesn't depend. You just need to make an HTTP request that eventually will fetch some data.
Cody Bontecou (35:34.765)
Aleksandar Gekov (35:36.486)
and you need to keep track of when to stop.
Cody Bontecou (35:40.961)
Yeah, yeah, yeah. When do you determine that? How do you determine when to stop calling?
Aleksandar Gekov (35:42.433)
Aleksandar Gekov (35:46.022)
Usually it's just some simple check that you're finished loading what you needed to load And then you just stop calling that endpoint
Cody Bontecou (35:58.101)
Okay, yeah. I guess like in the use case that I'm exploring, there is like an unknown when to stop looking at that data. It could be 20 minutes, it could be an hour and a half. I'm actually playing with League of Legends eSports data and so that's kind of like one of the problems I'm trying to solve with that technique is like you can interact with in-game.
Aleksandar Gekov (36:19.953)
Cody Bontecou (36:26.093)
like match data, but when that match is gonna end, when it starts, you know, like these are all variables that I don't know how to account for programmatically. But it's a fun problem to solve.
Aleksandar Gekov (36:38.046)
Yeah, I think you can either increase the time between each request or if there's a possibility you can use like webhooks to actually know when a certain event is happening.
Cody Bontecou (36:53.389)
Right, but they would need to know I exist for that as well, right? Yeah. And it's not like an officially supported API. So who knows? So kind of hacky, but that's why we're here.
Aleksandar Gekov (36:56.626)
Aleksandar Gekov (37:03.426)
Aleksandar Gekov (37:09.458)
One thing I was looking up recently is authentication. And I know there's some options for review. So I know about SuperBase, and all Hanku has on the authentication module. NextAuth, which I think is from SideBase. And I think there was also a port.
made from WAPS, Riano on GitHub, but for a clerk.
Cody Bontecou (37:49.357)
Aleksandar Gekov (37:50.726)
which is, if you don't know, Clerk is a really popular library for authentication in React. It's kind of becoming the go-to authentication service. And yeah, and I just saw that I was wondering why there isn't still yet a module for Clerk. So recently I...
Cody Bontecou (38:09.228)
Aleksandar Gekov (38:19.25)
I found a guy who made the client version plugin for Vue. And I just decided to try it out in Nuxt. And yeah, I managed to make it work also with the middleware both for the API and routes. So maybe I was thinking soon, maybe I can make some sort of video demonstrating that because...
Cody Bontecou (38:47.756)
Aleksandar Gekov (38:49.1)
It is quite popular.
Cody Bontecou (38:53.013)
Well, yeah. Why is that? I have also seen it more often, like recently. And I haven't played with it yet. And like, I tend to pick up Sidebass's Nuxt.Oth, which is kind of a wraparound next off. And I mean, it seems perfect. What is it missing? What does Clark provide?
Aleksandar Gekov (39:15.338)
I think it's maybe a bit subjective, but maybe like what I really liked about Clark is just the UI as well as the pre-built components. Like they have a few cool components like the user button, which actually all the functionality of managing your account, like your...
Cody Bontecou (39:21.553)
Aleksandar Gekov (39:45.326)
profile, first name, last name, avatar, image, and so on. All of that logic, as well as the usual two-step verification and passwords and so on, is already handled by them. So it makes it really plug and play to actually use it.
Cody Bontecou (40:08.805)
So it's more than just API. It's, they also provide like the UI components and are they providing, are they storing data on their backend here as well? Or.
Aleksandar Gekov (40:15.69)
Yeah, it's more of a full-size solution.
Aleksandar Gekov (40:24.815)
I'm not really sure.
Cody Bontecou (40:28.569)
Or I'm curious if they're just kind of making the interaction with these like authentication like services like GitHub or Google, like just very easy. You know, it's, it's still all happening on their end, but.
Aleksandar Gekov (40:39.923)
Aleksandar Gekov (40:44.654)
Could be I haven't I don't know
Cody Bontecou (40:47.553)
Yeah, because that's always the thing, right? First you build the auth system, the login portal, and then you have to build, yeah, the user dashboard or, you know, those.
Aleksandar Gekov (40:58.247)
Yeah, if you need customization beyond what Clerk offers, then probably, yeah, it's good to use one of the others because you have like more access to the actual APIs. So you have more control, but as a like a fast solution that actually has, you don't need to think about the components and so on.
Cody Bontecou (41:26.286)
Aleksandar Gekov (41:26.287)
It's definitely great.
Cody Bontecou (41:30.137)
Cool. I'm actually probably going to work towards building off of my site like today. So I'm going to, I'll play with this. I'm really happy you mentioned it.
Aleksandar Gekov (41:40.886)
Yeah, maybe I can share the link after in the chat.
Cody Bontecou (41:45.261)
Yeah, yeah, I'm actually looking at the GitHub right now. For example, one problem it solves that I was curious about is you can log in with GitHub, but then there's this connected accounts section. So you can actually then connect your Google account or Apple, whatever you want. So you can have multiple OAuth accounts within one. And that's something I've tried to build out myself before. And...
Aleksandar Gekov (41:49.161)
Aleksandar Gekov (42:05.708)
Cody Bontecou (42:15.669)
I didn't succeed. I wasn't really sure how they're storing some of that information. So that you're under one user, but you can interact with both Google's APIs and GitHub APIs through one authentication token.
Aleksandar Gekov (42:17.452)
Aleksandar Gekov (42:30.698)
Yeah, yeah, you need, if you're building it on your own, then you need to connect like certain data from both providers. Yeah.
Cody Bontecou (42:42.829)
Right, and make sure it's true, like this is the true ID that connects all of these OAuth services. So that's a really nice feature just right out of the box.
Aleksandar Gekov (42:48.818)
Yeah. And they actually have a lot of providers, like quite a few. Also some like Web3, like MetaMasks and so on.
Cody Bontecou (43:00.718)
Aleksandar Gekov (43:03.01)
Cody Bontecou (43:04.725)
Nice, nice, so this is gonna be your next YouTube video? Is that what I hear?
Aleksandar Gekov (43:08.978)
Um, maybe you heard it first here.
Cody Bontecou (43:11.661)
Yeah. Cool. Cool, cool. Looking forward to it.
And then, hey, one thing I'm a little curious about, you know, switching topics here a little bit. Hold on, I'm gonna play my transition.
been playing around with the soundboard today. You have a blog post on Nux 3 and StoryBlock. And that's something I've seen various videos or demos on it, haven't really played with myself. So I guess, can you explain the benefit of using StoryBlock? Now, my understanding is it's basically you can do everything visual in the StoryBlock editor itself.
Aleksandar Gekov (43:32.79)
Aleksandar Gekov (43:39.413)
and then that's imported and displayed in your app. In this case, Nuxt, is that, am I reading that correctly or what, how does Storyblock, why is it so good to use with Nuxt? Let's put it that way.
Aleksandar Gekov (44:07.242)
Aleksandar Gekov (44:11.57)
Yes, so StoryBlock, first of all, I should say that I am an ambassador for them. But actually what makes them really nice is, first of all, yeah, the visual editor is quite nice. But then there's also a lot more stuff going on, such as they have a lot of other integrations and there's like a whole store of plugins.
built by community from the community that actually extend the functionality. For example, if you want to add a certain block, which is actually where you actually put the content and different types of content, then there's different plugins that you can actually drag and drop and configure them.
straight in StoryBlock and then see the results in your live application. So it's really great. I've been using it a lot at the start when I was getting into programming and also recently, mainly for just building websites for clients which are not technical. So then they can...
go into StoryBlock login and then they can publish or save as drafts certain posts or like if it's a marketing website they can change the headline and it makes it really easy and it's a great solution both for non-technical persons and also for developers.
So is all of your visual components, your colors, your backgrounds, your, excuse me, all the, everything visual in StoryBlock as compared to say something, I'm thinking of like a Prismic or something that's strictly content, your text and images, and then you've got a display that's all handled within StoryBlock, and then it just somehow through their API, it all gets sent to your application?
Aleksandar Gekov (46:28.838)
Yeah, like the visual part is definitely a highlight. Some people prefer to just have it as in, yeah, as you said, more like just the content. But also it's worth considering like the, just the management of people who actually work on the content of a website.
It's a great solution to actually manage who does what and basically the whole workflow.
And then the different blogs I've opened now. Like there's blogs for optimizing image uploads. There's custom blogs for integrating with different services like Google Calendar and so on and so on. So yeah, it's definitely worth checking out if you're need a...
Cody Bontecou (47:42.381)
I've just started, there's so many CMSs out there. I'm actually not entirely, oh, I was working with Strappy. That's the one I was playing with recently. I was just helping my brother build a website for his company and that was the very first question he asked me was, you know, when I build this for him, will he be able to configure it and like change the pictures, things of that nature? And I was like, oh, I wasn't planning on that but now I'm gonna play around with the CMS and see if I can, you know, build this out for you. What's that take?
I've never actually done that before. And I was impressed by how simple it was actually to build out kind of just, you know, everything's almost, you're basically, from my understanding, everything's just kind of HTTP request behind the hood that's, you know, wrapped in these easy to use APIs, just like Nuxt libraries or whatever you might be using. And it'll just generate all of that for you. And then they just log into a dashboard.
and configure it. So they're happy, I'm happy.
Aleksandar Gekov (48:48.278)
Yeah, I'm a firm believer that you need to try multiple CMSs to see which fits you better. But I think I've also used Contentful and Strapi. I don't remember a lot, but I just remember sticking with Storyblock because it was nice.
Cody Bontecou (49:00.878)
Cody Bontecou (49:08.517)
Yeah, yeah. I'll have to play with it.
For some reason, I think a strappy was something you had to host yourself. Is that not correct? Is it online host?
Cody Bontecou (49:19.497)
So they do provide the option to host to yourself, but I think they also offer some sort of cloud service as well. I'll probably just host it myself through like a fly IO instance or something because their cloud service isn't cheap.
Aleksandar Gekov (49:37.522)
Yeah, if you're a single dev, I don't think pricing matters that much. But if you're like a bigger company, then for sure, like it plays a bigger part in deciding which is better for you. Yeah.
Cody Bontecou (49:51.913)
Oh yeah, yeah definitely.
Yeah, most places will do like a free developer account. Storyblock does that. So yeah, one seat so you can play with it. And then they soak you after that.
Aleksandar Gekov (49:58.37)
Aleksandar Gekov (50:04.78)
Cody Bontecou (50:04.889)
Yeah, I'm looking at, I'm actually looking at clerk right now. We're just talking about clerk soft system and 5,000 monthly active users. But then after the one thousand for the 0.2 cents per additional user. Um, like it goes up real fast. Right. So, so this app that I'm building, it interacts with Twitch streamers. And so.
Mm-hmm. Yeah, the free one. You get, what, 5,000 users?
Aleksandar Gekov (50:27.648)
Cody Bontecou (50:31.317)
it's not hard to all of a sudden have 20, 30,000 users on the site. And I was just trying to like calculate like, Oh man, how much did that cost? And, uh, that's, that's a difficult pricing structure to work with. Um, but I'll have to calculate it.
Aleksandar Gekov (50:39.222)
Aleksandar Gekov (50:46.95)
The good thing is that you can always change and build it yourself. Like even for like the startup that we are building, if we exceed that threshold, like it's nice that we have it quite easy to set up at the beginning. And by the time we reach that number of users, we'll probably have the time and capacity to think of something like.
Cody Bontecou (50:50.825)
Yeah, right, right.
Aleksandar Gekov (51:17.266)
more affordable and scalable that works for us.
Cody Bontecou (51:21.425)
Right, we're all writing perfectly abstracted code. So the authentication layer is easily, you know, you swap it out, no problem.
Aleksandar Gekov (51:24.542)
Of course, yes.
Yeah, authentication has to be one of the easiest problems in web dev.
Aleksandar Gekov (51:34.606)
Cody Bontecou (51:36.599)
All right, so before we wrap up and move to pics, Alex, is there anything else you wanted to talk about real quick?
Aleksandar Gekov (51:45.678)
Um, yeah, no, I don't think so. I just want to thank you for having me. It was really nice.
Cody Bontecou (51:54.415)
Yeah, it's our pleasure for sure. Oh, and before we go code it, I'd also like to point out that the metaphors are either under the hood or behind the scenes, but not behind the hood. So, you know, just for future reference, you said behind the hood, right? So, you know, and me being the grammar stickler that I am, shall we say, I thought I'd point that out.
Cody Bontecou (52:05.669)
Did I say that? Ah, well, it's a...
Aleksandar Gekov (52:10.264)
Cody Bontecou (52:14.061)
Welcome to the future, Steve. This is what all those young kids are saying these days. Just, yeah.
Aleksandar Gekov (52:18.487)
behind the hood. Now I remember having this thing about in the hood, but that's a whole different whole different meeting there sure. So alright so we'll move on to picks. Picks are part of the show where we get to talk about whatever we want within reason that doesn't get us in trouble with the FCC or whoever regulates podcasts. So Cody you got anything for us today? Or excuse me, do you have anything for us today? I gotta use proper grammar now.
Cody Bontecou (52:26.254)
Aleksandar Gekov (52:26.795)
Aleksandar Gekov (52:37.966)
Cody Bontecou (52:42.914)
Aleksandar Gekov (52:47.15)
Cody Bontecou (52:47.705)
Yeah, I do. I do. I've been playing around with, so I don't know if you're familiar with ShadCN. It's a UI component library that's gotten popular in the React world. No, I don't. Maybe that's what he named his account. So it's this UI component library.
Aleksandar Gekov (53:01.267)
Oh, I go shad fishing, is that the same thing? No, it's not, okay, sorry.
Aleksandar Gekov (53:07.851)
Cody Bontecou (53:14.681)
built off of something called the radix UI. And it's kind of taken over in the React world. But turns out open source, there's a guy building it out, shadCN view and a radix view, which I actually haven't looked at the source code, but I imagine are just like nice wrappers around the React component library.
Aleksandar Gekov (53:19.82)
Cody Bontecou (53:44.173)
Uh, and it's, it's similar to view defy in that, like, it's just like this all encompassing like UI component library. But what's unique about it is at least for the shad.
ShadCN, I wish I had a better name. You do just like an npx install command and it will actually download the UI components directly into your project. And so you have all of the view component code right there. So you can easily tinker the UI. The UI is all built into ONCSS and it's all just right there. Like there's no...
Aleksandar Gekov (54:00.235)
Cody Bontecou (54:23.493)
There's no magic taking place. You literally just have the component. And I've been really enjoying that in my free time.
Cody Bontecou (54:35.909)
You're muted again, Steve.
hate it when that happens. So I've been looking around at different tailwind component libraries just to plug in with that product that I have, just because it was just basic stuff that came out of the inertia demo app. And actually, it worked pretty well, to be honest. But the daisy UI is one that I've looked at quite a bit. That's sort of basic. And a coworker of mine uses that on his project. So.
Cody Bontecou (54:41.061)
Aleksandar Gekov (54:41.358)
Thanks for watching!
This will be interesting and definitely have to look at that. Uh, let's see, play around with it. I found the, uh, the view pose. You, uh, excuse me, that it's shad CN dash view under Radix dash view on GitHub. So we'll put the, uh, we'll put link in the show notes for anybody that wants to take a look at, uh, that, but that's awesome. It's amazing to me, you know, I've sort of drinking the tailwind, uh, what's the term I'm looking for Kool-Aid. Thank you.
Cody Bontecou (55:18.986)
Cody Bontecou (55:34.161)
Aleksandar Gekov (55:35.778)
tailwind Kool-Aid for a few years and have really gotten used to it liking it. And if you just do some searching on tailwind component libraries or tailwind components, there's a ton of stuff out there that's all built on tailwind.
Cody Bontecou (55:51.354)
Aleksandar Gekov (55:51.362)
Yeah, that's what I was thinking that like Shadzien right now is taking over React quite fast. And I think for Vue, we have, of course, a lot of UI libraries, but we don't have like a single straightforward option, like, okay, you go with this one usually. But it's nice that we have a lot of open source contributors working. I think even for
the Shazien port to view. I think there's like two different contributors working on extending Karadik's UI to view. So that's always... That's also the other idea for a video to analyze all of them.
Cody Bontecou (56:40.066)
Oh, to look at all the different Tailwind component libraries? Oh. Yeah, there's a number of different blog posts out there. I was looking around last night, and Log Rocket had one. They have a lot of good view content, actually. And I've seen a number of ones. So there's a number of review sites. And you start looking around at all the different reviews, and they all tend to have different ones in different positions. But you start to see a few ones sort of float to the top after a while. But anyway, sorry to.
Aleksandar Gekov (56:43.603)
Yeah, at least the most popular ones.
to get off on a rabbit trail there, Cody.
Cody Bontecou (57:12.997)
Hey, no problem. But yeah, that's all I got today. That's what I'll be playing around with.
Okay, so I will go next and we will get to the highlight of every podcast that I do, the dad jokes of the week. For what it's worth, I have multiple sources of dad joke content. I cannot claim to have ever written any bad, any dad jokes. Just to clarify that, because I've been asked that by people who are amazed at the high quality content I put out. And so anyway.
So I called my local dairy the other day and told them I wanted to get some milk so I could take a milk bath in it because it's supposed to be really good for your skin, right, and they said, okay, great, do you want it pasteurized? I said, no, just up to my neck.
And then we were talking about Videos and we've had other people on that I've written books So I decided to write a book on reverse. I call reverse psychology. Please don't buy it
And then last but not least, do you know, I don't know if anybody's seen the movie Aquaman or at least remembers, knows the character. Do you know what Aquaman's Twitter or rather should we say X handle is? It's Atlantis, right?
Aleksandar Gekov (58:45.122)
Cody had the confused look there. I think he finally got it. At, at sign, Lantus.
Aleksandar Gekov (58:48.436)
Cody Bontecou (58:50.145)
No, I didn't get that one. Dude. Thank you. It does.
Aleksandar Gekov (58:55.51)
sort of loses something when you gotta explain it, but that's okay.
Aleksandar Gekov (59:00.478)
he was thinking about Twitter being X.
Cody Bontecou (59:04.041)
I just sleep. Yeah. That's good. Thanks, Steve. Always put a smile on my face.
Okay, Alex, what do you have for us for picks?
Aleksandar Gekov (59:15.387)
Um, I have, uh, let me think.
I need something on my soundboard here with the Jeopardy theme.
Aleksandar Gekov (59:23.158)
Yeah, I have.
Aleksandar Gekov (59:27.81)
web scraping is kind of between legal and illegal.
Cody Bontecou (59:39.262)
the idea, that concept, the gray zone. Yeah. From my understanding, it's everything that doesn't require login is legal, right? Once you log in, you accept their terms and then you're breaking the rules if they can find you.
Aleksandar Gekov (59:42.794)
Is that something you're doing quite a bit these days, Alex? Are you being a script kiddie again or?
Aleksandar Gekov (01:00:08.395)
Aleksandar Gekov (01:00:11.734)
Depends, you haven't heard it from me, but I can say that LinkedIn is a pretty hard website to scrape.
Cody Bontecou (01:00:21.664)
Good to know. Yeah, it seemed to me that, I mean, web scraping could be hard because basically you've got a whole bunch of HTML and you probably don't want, you gotta filter out all the garbage, you know, or the HTML tags, or, you know, just to get your content. I'll date myself a little bit here and tell you that when I first got in, when talking about scraping, when I first got into IT, this was, I was working with banking systems and their mainframe computers where they...
Cody Bontecou (01:00:26.598)
stored all of their data and we were writing programs to communicate between PCs and mainframes. And when I first came in, we were still using DOS APIs for anybody who doesn't know that's disk operating system and through a terminal emulator to a mainframe system. And we had, that's how we communicated with screen scraping. And so we would have configuration files within our application that had
specific text and the location that it could be found out. So you'd navigate to a screen and you'd scan through, okay, is this text at this place? Okay, so I found it, that's this screen. And then you would write information to specifically mapped pixel locations or character locations, row and column locations on the screen. And then you would send a transmitted, go to the next screen, you say, okay, which screen is this? Okay, it's this one. So your mapping had to be spot on. If you were literally off one character, you could totally blow your application.
because you couldn't identify. And so when the vendors would update their screens, they would change things and things would break and loads of fun. So to me, that's my memories of screen scraping is mainframe systems with green screens and terminal emulators and their APIs. Back to the DOS days. So anyway, enough about my age.
Cody Bontecou (01:02:15.705)
I mean, from my understanding, things do still definitely break. And that is one thing websites will do is like, change their HTML or the IDs are always random, the CSS classes. However you're trying to select these HTML elements, they try to obfuscate to that obfuscate as much as possible.
I appreciate it.
Yeah, they tried to do that behind the hood, I think.
Cody Bontecou (01:02:40.985)
behind it. Yeah, man. And yeah, so but I'm curious why not just use the LinkedIn API?
in the head.
Cody Bontecou (01:02:49.977)
What does your friend want to scrape LinkedIn?
Aleksandar Gekov (01:02:50.748)
Yeah, so LinkedIn API is technically mostly used for logins. But other than that, it's basically non-existent. Like maybe you can scrape what they give you, but not everything. Yeah.
Cody Bontecou (01:03:12.525)
Alrighty, so with that we will wrap it up. We have talked a little about your YouTube channel. Just look under Alexander Gekhov, that's Alex with an X. Right, G-E-K-O-V. And then your blog is alexandergekov.com. A very hard name to remember, right? Nice to have your name. I tried looking at my name one time and it was like, yeah, sorry, somebody's already taken that.
Aleksandar Gekov (01:03:28.556)
Aleksandar Gekov (01:03:37.303)
because I have such a unique and different name, of course. Anywhere else, use Twitter slash X or GitHub, anywhere else that people can see your work.
Aleksandar Gekov (01:03:57.867)
Yeah, Twitter and from there on they can find everything else. Just the same. It's Alexander Gekhoff with an X.
and what's your Twitter handle?
All right, and we will put that in the show notes for sure. Alrighty, well, thank you for coming on, Alex. It's been a pleasure having you and talking about Vue and Nuxt. And I learned a whole bunch of stuff here about Shad and Clark and other four and five letter words. So very good. So all right.
Cody Bontecou (01:04:28.799)
Aleksandar Gekov (01:04:30.199)
Thank you for the invitation and for having me.
Our pleasure. All right, oh, and before I forget, I'm sorry people, I forgot to introduce you. We always forget the studio audience. So I'd like to say goodbye to the studio audience. That was here, you just didn't hear him.
Cody Bontecou (01:04:44.779)
Yes, if you want tickets for our shows, just contact me on Twitter at wonder95. Thank you. All right, with that, we'll wrap it up. Thanks, and we'll talk to you next time.
Aleksandar Gekov (01:05:01.282)