WEBVTT 1 00:00:06.200 --> 00:00:10.359 Hey, Welcome to React Round Up, the podcast where we keep you updated 2 00:00:10.400 --> 00:00:15.320 on all things React related. This show is sponsored by Raygun and produced by 3 00:00:15.439 --> 00:00:19.480 Top and Doves and Onvoid. Top and Doves is where we create Top and 4 00:00:19.519 --> 00:00:23.719 Doves to get top and pay and recognition while working on interesting problems and making 5 00:00:23.760 --> 00:00:30.000 meaningful community contributions. An Onvoid which provides remote design and software development services on 6 00:00:30.239 --> 00:00:35.719 task basis, so clients only pay when tests are delivered and approved. In 7 00:00:35.759 --> 00:00:41.520 today's episode, we will talk about material Y, which is a library that 8 00:00:42.119 --> 00:00:46.000 I'm pretty sure that most of you are going to be familiar with, and 9 00:00:46.200 --> 00:00:53.000 in today's show we have somebody that is well definitely much more well versed in 10 00:00:53.039 --> 00:00:57.600 the library than myself and has even done some a few contributions to the library 11 00:00:57.640 --> 00:01:03.879 itself, which is Dmitri Kovalenko. Hello everyone, very happy to be here, 12 00:01:04.079 --> 00:01:08.640 and yeah, sure we'll be asking any questions you want about Montreal UI. 13 00:01:10.599 --> 00:01:14.079 Just note that I kind of, like you know, retired contributors to 14 00:01:14.120 --> 00:01:18.159 mateil Ui. I did spend like you know, so basically I've been working 15 00:01:18.239 --> 00:01:23.120 full time for about a year on Matelli UI. But yeah it was yeah, 16 00:01:23.159 --> 00:01:26.400 but then I left, so and I stopped my contribution though, but 17 00:01:26.640 --> 00:01:30.079 I still like one of the top contributors by gitthub. You know, my 18 00:01:30.200 --> 00:01:34.879 face is right on the GitHub profile of mateil ui, so you can check 19 00:01:34.920 --> 00:01:42.280 it out. Awesome, awesome, And Dmitry, have I said your name 20 00:01:42.359 --> 00:01:49.079 the correct way, Dmitryvalenco, Sure sure, awesome, Okay, all right, 21 00:01:49.319 --> 00:01:53.439 and well my name is Lucas Paganini, one of the hosts in the 22 00:01:53.480 --> 00:02:00.439 show, and joining me in today's episode are also the amazing hosts Chris Hi, 23 00:02:00.439 --> 00:02:09.360 everyone and Peter Osa. Hello one. All right, so Dmitri, 24 00:02:10.240 --> 00:02:15.560 let's get started. So I think the first thing that we should talk about, 25 00:02:15.639 --> 00:02:22.439 since we talked about UI library is well specifically about mature uy. When 26 00:02:22.479 --> 00:02:27.280 do you think people should care about it and when do you think people should 27 00:02:27.479 --> 00:02:31.039 not care about it? For example, I do know that it is a 28 00:02:31.280 --> 00:02:38.879 very opinionated library in terms of styles, Like we were recently talking about other 29 00:02:38.680 --> 00:02:44.400 UI libraries that are very, very flexible in terms of how much you can 30 00:02:44.439 --> 00:02:49.199 customize the components itself, and some of them go even to the point where 31 00:02:49.199 --> 00:02:54.360 they only provide you the functionalities and you provide the entire style. And I 32 00:02:54.360 --> 00:02:59.360 imagine that mature y is kind of like in the middle because I know that 33 00:02:59.400 --> 00:03:06.319 it provides somewhat flexibility in terms of of custom styles and changes and et cetera. 34 00:03:06.680 --> 00:03:13.000 But I also know that it still follows uh well, the material the 35 00:03:13.080 --> 00:03:19.039 material design at the end. But yeah, how would you would you explain 36 00:03:19.120 --> 00:03:24.319 to somebody if they should care or not about material UI. So like, 37 00:03:24.400 --> 00:03:30.240 I will just clarify that it used to be very opinionated, and now they're 38 00:03:30.240 --> 00:03:38.360 moving from the opinionated mature UI styled approach to the separate you know, like 39 00:03:38.759 --> 00:03:43.599 headless components used to like do the same thing as radics, as like an 40 00:03:43.879 --> 00:03:47.919 area or wherever I forget. There are a few of them headless UI and 41 00:03:47.919 --> 00:03:53.719 all of this stuff, and now they have split in their library into base 42 00:03:53.199 --> 00:04:00.240 UI and mature UI. Material is basically skin of matel ui design to you 43 00:04:00.319 --> 00:04:03.240 the on the you know, the skeleton of the headless component used by the 44 00:04:03.280 --> 00:04:06.919 component of mature UI, which includes a lot of like good things, you 45 00:04:06.960 --> 00:04:10.680 know, all of the accessibility, all of the functionality, all of the 46 00:04:10.759 --> 00:04:15.800 props used to be known by developers, so you can use both of this 47 00:04:15.279 --> 00:04:21.759 modes kind of uh, but it is definitely you know, known by being 48 00:04:21.839 --> 00:04:28.120 like Matre UI oriented. So like usually all of the big you know, 49 00:04:28.279 --> 00:04:34.279 customers that are used to Mature youI there definitely often they are choosing MARIOI because 50 00:04:34.319 --> 00:04:39.279 it is a good library that you can just pick and just integrate into your 51 00:04:40.240 --> 00:04:44.439 you know, just take component displayed on a page and it looks good and 52 00:04:44.519 --> 00:04:47.800 basically that's it. Like I don't know, today people who are starting building 53 00:04:47.839 --> 00:04:54.519 their own design system are very rarely choose Mateli because they kind of lost the 54 00:04:54.600 --> 00:04:58.399 competition of his headless UI libraries because they just started building it like a year 55 00:04:58.480 --> 00:05:01.079 ago and the rod extent a that components who were there for a while. 56 00:05:01.519 --> 00:05:05.000 I don't know, like I think I made this issue to create the un 57 00:05:05.040 --> 00:05:10.319 styled components before all of this hype around them, and they were ignoring this 58 00:05:10.439 --> 00:05:14.759 issue for six years and just started doing that, just finished that like doing 59 00:05:14.839 --> 00:05:17.600 like a year ago. So yeah, I think today it's probably more still 60 00:05:17.680 --> 00:05:23.000 more more about like you know, ready to use stylis components they can just 61 00:05:23.040 --> 00:05:26.560 integrate into your you know, I don't know, at meant panel or what 62 00:05:26.839 --> 00:05:30.800 if you like major you into your like you know, Core app and just 63 00:05:30.800 --> 00:05:33.959 just use it as a because it's customization of the existing UI is kind of 64 00:05:34.319 --> 00:05:39.959 weird with a new modes. I don't say that they are that popular. 65 00:05:40.079 --> 00:05:46.800 Probably gotcha, Okay, So that's it's good to know that it is more 66 00:05:46.879 --> 00:05:55.639 flexible than then I assumed, because that definitely opens up the possibilities of using 67 00:05:55.680 --> 00:06:01.240 the library. So that's that's very good. For instance, For instance, 68 00:06:01.279 --> 00:06:05.560 I still use the one component of majo ui, which is out a complete 69 00:06:06.199 --> 00:06:12.439 hook. Basically it is very flexible and probably one of the best out of 70 00:06:12.480 --> 00:06:18.160 complete implementation that I know, because I remember that like basically Olive Olivier or 71 00:06:18.519 --> 00:06:24.800 Oliver or I don't still understand how to pronounce his name. I'm always forgetting 72 00:06:24.800 --> 00:06:29.040 about that. Probably Olivia is like the main contributor and creator of majo ui. 73 00:06:29.079 --> 00:06:31.519 He spent like I don't know, a year and a half building the 74 00:06:31.720 --> 00:06:35.879 one auto complete component. So it is like literally like you know, the 75 00:06:36.000 --> 00:06:43.759 deepest and the best optimized and the most flexible functionality out a complete hook that 76 00:06:43.839 --> 00:06:46.120 I know from all of the other one. But yeah, so basically, 77 00:06:46.160 --> 00:06:50.560 there are a few things that are very core and very useful inside mature UI, 78 00:06:50.720 --> 00:06:55.759 and I'm happy that they're exposing that separately off styles right now. Already 79 00:06:55.959 --> 00:06:59.360 Yeah, that that is very interesting. So why don't we talk about this 80 00:06:59.560 --> 00:07:02.279 a little bit more. So, Let's say that someone is listening to this 81 00:07:02.600 --> 00:07:09.360 show and they're like, I already have my inputs, Like I don't know 82 00:07:09.439 --> 00:07:13.800 if I need a library for this, Like my project already exists, and 83 00:07:13.959 --> 00:07:16.959 I already have the things that I'm working on, Like everything is working. 84 00:07:17.600 --> 00:07:24.319 But you touched on an important point, like there are a lot of utilities 85 00:07:24.839 --> 00:07:30.600 that were built to be used within the Mature UI library, and they can 86 00:07:30.680 --> 00:07:36.680 be imported individually and used in the context of your specific applications. So are 87 00:07:36.720 --> 00:07:44.040 there other utilities such as the autocomplete one that you just mentioned that you think 88 00:07:44.639 --> 00:07:48.319 would be useful for people to know about. I don't know, like probably. 89 00:07:48.600 --> 00:07:53.560 So basically, if your app is working, you know, like don't 90 00:07:53.600 --> 00:07:57.600 touch it, why would you replace your component? There are still working, 91 00:07:57.759 --> 00:08:01.040 right? If you are looking for existence, like and you need some kind 92 00:08:01.079 --> 00:08:07.079 of you know, working, you know, accessible, like virtualized, optimized, 93 00:08:07.120 --> 00:08:09.560 like I don't know, core component, you can look. You will 94 00:08:09.560 --> 00:08:13.480 look for them, right, And just mature UI will probably be not the 95 00:08:13.600 --> 00:08:18.759 first option, but it's definitely one of the one of the really good one 96 00:08:18.800 --> 00:08:22.079 because mature your adapts are spending a lot of time because there are a lot 97 00:08:22.079 --> 00:08:26.399 of users right of the base components and the I think it's pretty pretty decent 98 00:08:26.519 --> 00:08:33.039 choice if you have like competition having mature UI because it's like the support because 99 00:08:33.039 --> 00:08:37.399 you know it will be supported for a while for forever. Probably it has 100 00:08:37.440 --> 00:08:39.159 like a lot of users, a lot of like testa in before, a 101 00:08:39.200 --> 00:08:43.200 lot of like good you know, you know, like you know, process 102 00:08:43.279 --> 00:08:48.000 around like contributions and all this stuff. So probably it's a good choice to 103 00:08:48.200 --> 00:08:52.840 be choosing between like hadless UI, which is kind of dead right now. 104 00:08:54.039 --> 00:08:58.799 When we started using it, it's like tailvin CSS based components and they stopped 105 00:08:58.960 --> 00:09:05.039 actually you know supporting it. Raddicks is really good as well, and maturely 106 00:09:05.039 --> 00:09:07.039 you are based is also good. So basically we have more you know, 107 00:09:07.200 --> 00:09:13.279 choice, which is good. Competitions never is never been bad thing. Chris 108 00:09:13.320 --> 00:09:18.960 Peter, Do you guys have any hands on experience with materii why? Okay, 109 00:09:18.039 --> 00:09:22.279 Yeah, so personally I think I have. Yeah, so I kind 110 00:09:22.279 --> 00:09:26.039 of worked on a React application that feeds solo on it. I think it 111 00:09:26.279 --> 00:09:31.080 was like passion feels, I think the producing but before the new changes, 112 00:09:31.200 --> 00:09:37.080 right, Well, I do have some kind of like I only say complaints 113 00:09:37.200 --> 00:09:41.159 do but like reservations on my end for me too, and maybe Dmitry you 114 00:09:41.159 --> 00:09:46.000 could just clear that thought as well, so I don't have as well as 115 00:09:46.039 --> 00:09:50.759 working with out like this on the fontain, right, many of them kind 116 00:09:50.759 --> 00:09:56.120 of see that it's it it's rigid, right, Like maybe for example, 117 00:09:56.960 --> 00:10:03.279 I actually know someone who kind of dislikes the way material defined, like the 118 00:10:03.320 --> 00:10:07.080 goals on the columns and this kind of things. I was like, oh, 119 00:10:07.360 --> 00:10:11.519 if I could just do this with CSS easily and the club don't, 120 00:10:11.639 --> 00:10:16.000 maybe better. So I don't know what to I'm just accing, So like, 121 00:10:16.919 --> 00:10:20.879 what what do you think like coming to Okay, yeah, I know 122 00:10:20.919 --> 00:10:22.799 that they were built, there was like a kind of a change, right, 123 00:10:22.840 --> 00:10:28.240 so coming to like previous versions that of just many companies kind of I 124 00:10:28.320 --> 00:10:33.200 see using the produce versions because that's kind of the version they're going to maintain. 125 00:10:33.279 --> 00:10:37.080 Quite so, so did you see working on the previous ones? So 126 00:10:37.080 --> 00:10:41.240 I did you see any door back or have you heard anyone from any developers? 127 00:10:41.279 --> 00:10:45.480 Like you once you think that kind of gets to you that you feel 128 00:10:45.519 --> 00:10:48.879 that are they're kind of like primary concerns as well, just like the example 129 00:10:48.919 --> 00:10:52.840 I gave us, some people say they don't like how the API was built, 130 00:10:52.960 --> 00:10:58.039 like for example the layout APIs and then the the idea of the atomic 131 00:10:58.159 --> 00:11:05.120 CSS you can passing was like maybe margins ms pops onto. I know some 132 00:11:05.200 --> 00:11:09.360 kind of people that don't like that structure. Right, so what do you 133 00:11:09.399 --> 00:11:11.799 think, like do you have any consceransis about what have we hit from others 134 00:11:11.919 --> 00:11:20.799 abouts how pre stopping constructed? Yeah? I think actually that they so basically 135 00:11:20.799 --> 00:11:24.879 they did a lot of long way of having different approaches to style things. 136 00:11:26.240 --> 00:11:30.840 So right now, I believe that there should be a way to target any 137 00:11:30.879 --> 00:11:37.519 element of machel Ui and have the MOUI like me ui style and trigger it 138 00:11:37.559 --> 00:11:43.000 globally from CSS because of developers actually like we're fighting for that, you know, 139 00:11:43.080 --> 00:11:46.600 like we want to add mergent too specific like you know in CSS, 140 00:11:46.799 --> 00:11:52.320 just just give me this option. And they did it. But I believe 141 00:11:52.679 --> 00:11:58.879 that these limitations were did for a good thing, right because you so basically 142 00:11:58.879 --> 00:12:03.679 like right, you know, if you have everything built in one like you 143 00:12:03.720 --> 00:12:07.879 know, is a LITD approach your components or is related you never you never 144 00:12:07.039 --> 00:12:11.840 touched them like you know, globally they can be mutated by global styles and 145 00:12:11.879 --> 00:12:15.000 all of this stuff. It is like, you know, more robust solution 146 00:12:15.519 --> 00:12:18.399 because you know that like your competents rendering, it will be rendered the same 147 00:12:18.399 --> 00:12:24.240 way in like ten years because nobody will break it excidentially good at it or 148 00:12:24.360 --> 00:12:28.639 bad it. Like probably everyone chooses for himself. So I personally did like 149 00:12:28.720 --> 00:12:33.279 this. I personally did like this project. I think it's pretty good because 150 00:12:33.320 --> 00:12:37.120 like you know, additional safety kind of, but the other developers who love 151 00:12:37.559 --> 00:12:45.000 doing CSS and all this other stuff probably not. So yeah, we're just 152 00:12:45.039 --> 00:12:50.000 like, you know, just choosing which one to prefer. Yeah, yeah, 153 00:12:50.039 --> 00:12:54.559 I get that also, And the I think there was the point where 154 00:12:54.799 --> 00:12:56.399 you kind of if you want to define styles, you have to create like 155 00:12:56.399 --> 00:13:01.279 an object, you know, you have component and then kind of properly define 156 00:13:01.320 --> 00:13:05.320 those styles. Yeah. I think that one was actually like that was changed. 157 00:13:05.399 --> 00:13:11.399 That was changed. So basically they did use GSX right for styles GSS 158 00:13:11.759 --> 00:13:16.639 not GSX, and now they are using emotion probably, so basically you can 159 00:13:16.759 --> 00:13:22.279 use template literal liter roles, or you can use CSS files as well. 160 00:13:22.840 --> 00:13:26.919 So yeah, I think it's now flexible enough. Before it, yes, 161 00:13:26.960 --> 00:13:31.320 there was. Firstly, it was in line styles, which are annoying because 162 00:13:31.320 --> 00:13:35.240 you didn't have harvards and all this stuff. Then there was a GSS, 163 00:13:35.679 --> 00:13:41.679 which is kind of style components but using objects of styles, which was not 164 00:13:43.919 --> 00:13:46.960 which was good but not good enough because people who are complaining, we want 165 00:13:48.000 --> 00:13:52.080 to write CSS. And then they gave you completely, you know, freedom 166 00:13:52.120 --> 00:13:56.120 of choosing how you will write your CSS, which is good. Yeah, 167 00:13:56.240 --> 00:14:01.600 that's also yeah. Also that I also have another question in the access in 168 00:14:01.639 --> 00:14:07.720 the aspeite of accessibility, so like and I don't know, I've kind of 169 00:14:07.720 --> 00:14:13.399 worked on it to start a level with accessibility war do you feel that as 170 00:14:13.440 --> 00:14:18.320 compared to other popular filmworks like maybe Chaka you are, Like, do you 171 00:14:18.399 --> 00:14:24.519 feel much where you kind of kind of follows the whole accessibility ideology because I 172 00:14:24.519 --> 00:14:26.399 know that when it comes to accessibility, a lot of people kind of mentioned 173 00:14:26.480 --> 00:14:33.840 all that your libraries as accessible kind of that was like the kind of so 174 00:14:33.000 --> 00:14:37.840 what do you think on accessibility as regards much where you are? I'm pretty 175 00:14:37.840 --> 00:14:39.799 sure it is like you know, the best of the kind, you know, 176 00:14:39.879 --> 00:14:43.039 the best, the best, the best in the world, probably I 177 00:14:43.080 --> 00:14:46.399 don't know, like probably not the best, but I am pretty sure they're 178 00:14:46.399 --> 00:14:48.799 following all of the accessibility guidelines. At least when I've been working on much 179 00:14:48.840 --> 00:14:54.960 air components, accessibility was one of the top priorities, and following all of 180 00:14:54.039 --> 00:15:01.360 the v W three C right W three C convention of how to build certain 181 00:15:01.480 --> 00:15:05.159 components, like specifically like date picker, it's like a nightmare for the accessibility 182 00:15:05.200 --> 00:15:09.759 perspective. You need to support average and it's like such a such a customizable 183 00:15:09.759 --> 00:15:16.279 component and like greeds just the target is not less than one hundred percent be 184 00:15:16.480 --> 00:15:20.919 accessible and tested through the accessibility trees. So yeah, I'm pretty sure it's 185 00:15:20.960 --> 00:15:28.399 all all done pretty well. Yeah, that's awesome because I think I needed 186 00:15:28.519 --> 00:15:31.399 that to be clear because I I know I've worked on accessibility for as well 187 00:15:31.559 --> 00:15:35.919 as well kind of just it in the world, but there's some developers have 188 00:15:35.039 --> 00:15:39.120 kind of argued that it's not this. That's so I think map that is 189 00:15:39.120 --> 00:15:46.480 actually kind of cleared, that's actually very accessible for that filmot to you have 190 00:15:46.600 --> 00:15:50.399 films. I'm also I have on a question again as we gods from the 191 00:15:50.480 --> 00:15:54.039 ease of use right so, as I think Becle I talked about the API, 192 00:15:54.399 --> 00:15:58.240 I'm kind of usually like opinions from people I've worked it as well. 193 00:15:58.519 --> 00:16:03.279 My person my experiences, right, so many people feel that there's kind of 194 00:16:03.320 --> 00:16:08.440 a learning CoV working with Macho yu are in this sense that the APIs are 195 00:16:08.519 --> 00:16:15.679 kind of rigid. The music was from people where they feel that it takes 196 00:16:15.720 --> 00:16:18.720 so much to do just easy things and use thatvel. So what do you 197 00:16:18.799 --> 00:16:22.240 think about that? Or do you think that maybe that was actually a concern 198 00:16:22.960 --> 00:16:29.519 previously and maybe the contributors contributors are trying to kind of work on how to 199 00:16:30.279 --> 00:16:33.240 maybe you refine it or something. So I just want to know you're beyond 200 00:16:33.279 --> 00:16:38.360 that. What people say about the rigidity of the APIs and hys been so 201 00:16:38.559 --> 00:16:44.120 much Valua, I mean, like probably the wrong person to ask because I 202 00:16:44.240 --> 00:16:48.120 use martual Euy since zero points, like you know, versions, which is 203 00:16:48.200 --> 00:16:52.799 like very long time ago. So they basically core principles who are imigrated. 204 00:16:52.840 --> 00:16:56.840 So for me it's very easy to use right now, you know. But 205 00:16:56.240 --> 00:17:00.000 in fact, if if I am not, like, isn't it full time 206 00:17:00.240 --> 00:17:03.559 right now? So I don't. I actually don't write. I still write 207 00:17:03.599 --> 00:17:07.799 some somewhat react on my full time job, but I don't. We don't 208 00:17:07.880 --> 00:17:12.279 use machell UI, we use tale Wing CSS plus radics. I love it, 209 00:17:12.839 --> 00:17:17.319 but I still sometimes rejoin it back to machell UI because I have so 210 00:17:17.400 --> 00:17:21.279 much like stings that I wrote for the years and mature UI and it doesn't 211 00:17:21.319 --> 00:17:25.240 have problems, to be honest, like write it matell ui. But if 212 00:17:25.279 --> 00:17:29.799 somebody does have and somebody wants more freedom, somebody who wants something more like 213 00:17:29.839 --> 00:17:33.720 you know, closer to just HTML and CSS, just don't pick machel u 214 00:17:33.839 --> 00:17:37.519 I. Right, it's like the difference. You have plenty of choice. 215 00:17:37.559 --> 00:17:41.440 Why would you like, you know, force yourself doing things that you don't 216 00:17:41.559 --> 00:17:45.279 like? Right, just choose whatever you think is more good or is it 217 00:17:45.319 --> 00:17:48.200 to use more clear? Like, yeah, somebody choose Materia because they think 218 00:17:48.240 --> 00:17:52.519 like, okay, we'll take the component, here's an API, I will 219 00:17:52.519 --> 00:17:55.440 configure it and forget about it. Somebody wants to have like you know, 220 00:17:55.720 --> 00:17:59.400 the one thousand lines of HTM al to configure one component. Why not, 221 00:17:59.440 --> 00:18:03.400 like it's different do it in products? Yeah, that's that's that's that's very 222 00:18:03.440 --> 00:18:08.200 correct. So now, because yeah, I think when usually doing that kind 223 00:18:08.240 --> 00:18:14.119 of concern, I usually say maybe the kind of developers that are concerned about 224 00:18:14.160 --> 00:18:19.559 maybe maybe tail wind or history of atomic CSS's the kind of pattern, right, 225 00:18:19.880 --> 00:18:25.839 A lot of people who love like crafting designs from scratch, that they 226 00:18:25.839 --> 00:18:30.559 want to get that kind of fundamental freedom to every component, right, And 227 00:18:30.839 --> 00:18:33.920 just this on people who really loves like how every like how like feel most 228 00:18:34.000 --> 00:18:37.759 like okay, like Matvalua, and it's kind of buoyant and they don't really 229 00:18:37.839 --> 00:18:41.880 need to do much to do certain things right. So I get that actually, 230 00:18:42.440 --> 00:18:45.839 and I get that. I think it's based on the person who actually 231 00:18:47.079 --> 00:18:49.359 like what is your choice and what do you want on? Which type of 232 00:18:49.880 --> 00:18:55.680 dry system do you like? Right? So like also money, right, 233 00:18:55.720 --> 00:18:59.519 if you're building some kind of you know, admin component or the thing that 234 00:18:59.599 --> 00:19:03.599 you don't really care about how it will look like, you don't want to 235 00:19:03.640 --> 00:19:06.799 spend a lot of time configuring it, like you know, building like internal 236 00:19:06.880 --> 00:19:11.119 components. That's why I think Materio is very often used for admin dashboards, 237 00:19:11.119 --> 00:19:15.839 because you're just import component and you forget about it. And when you have 238 00:19:15.960 --> 00:19:18.279 your lending page, right, when you need to have a complete you know, 239 00:19:18.359 --> 00:19:21.920 like I don't know why would you use React for lending page? But 240 00:19:22.279 --> 00:19:26.319 people using React for lat I mean I mean like probably something like I don't 241 00:19:26.359 --> 00:19:30.000 know, like your I don't know whatever, Like I don't know versatile dashboard. 242 00:19:30.039 --> 00:19:33.880 It's really didn't react. You want to have like you know, precise 243 00:19:33.960 --> 00:19:37.359 control over how the thing svenders because of thousands of people are using that, 244 00:19:37.680 --> 00:19:41.640 so pick something different probably or just write it from spread for yourself. Right, 245 00:19:41.720 --> 00:19:44.759 It's just like a matter of time, of money of like you know, 246 00:19:44.920 --> 00:19:48.559 your personal preference, so yeah whatever, yeah, yes, yeah, 247 00:19:48.559 --> 00:19:52.319 because also I worked a lot of projects I use MAT for like admin dashboard, 248 00:19:52.440 --> 00:19:55.960 like B two B doshbooks. That's what I think I get you on 249 00:19:56.039 --> 00:19:59.279 that. So it's I think it's busy on. If you want to see 250 00:19:59.440 --> 00:20:02.119 time, it's just best to use that. But then you want to your 251 00:20:02.119 --> 00:20:06.680 concern about into kid design and certain that you want to customize everything, right, 252 00:20:06.880 --> 00:20:11.279 I think you can just you can use any frame of any free app. 253 00:20:11.720 --> 00:20:12.880 They went back. I think they wanted to get good for so many 254 00:20:12.880 --> 00:20:18.960 people, so you just think they just going down probably rads or shots in 255 00:20:18.279 --> 00:20:22.279 and so on. Yeah, so that's yeah, that's abstually. Another question 256 00:20:22.359 --> 00:20:27.759 I have again is do you have an idea of probably any improvement or any 257 00:20:29.000 --> 00:20:33.079 maybe future concerns A lot going to come up into the frame of that's why 258 00:20:33.160 --> 00:20:37.359 you are an idea of in hmm, this is a hard question to be 259 00:20:37.440 --> 00:20:41.680 honest, like I, as I said, I left contributing a long time 260 00:20:41.720 --> 00:20:47.400 ago, and I don't use it like every day, So probably I I 261 00:20:47.440 --> 00:20:51.039 am not the best the best person to actually, like, you know, 262 00:20:51.720 --> 00:20:56.079 ask about that's right now. I mean, like probably they're moving to the 263 00:20:56.160 --> 00:21:00.599 right direction or right now with all of the basically why support for tailorween for 264 00:21:00.759 --> 00:21:07.160 whatever, trying to be like more customizable, more flexible, and having like 265 00:21:07.240 --> 00:21:12.319 their styles as a ski in tone or like theme or whatever. I mean, 266 00:21:12.480 --> 00:21:17.960 I feel like they're doing good things right now, but probably they're today 267 00:21:18.240 --> 00:21:22.680 they're already too big to move faster. So basically, you know, like 268 00:21:22.799 --> 00:21:26.000 the market goes a bit faster than they are moving. I feel like because 269 00:21:26.039 --> 00:21:30.039 it's already a big company, like I don't know, maybe twenty twenty people 270 00:21:30.200 --> 00:21:33.359 working there or maybe even more, I don't even know. Right now, 271 00:21:33.400 --> 00:21:37.079 it's not like a small team of like just into the ass or building like 272 00:21:37.200 --> 00:21:41.279 big Comple Library because they like it, it's like already a company, so 273 00:21:41.359 --> 00:21:47.200 they're started moving slowly kind of I don't know, whatever, and probably like 274 00:21:47.200 --> 00:21:52.680 I don't know, maybe just move faster for the market would be my guess. 275 00:21:52.759 --> 00:21:56.200 But I probably you know, like it's just like you know, one 276 00:21:56.279 --> 00:22:00.720 shot. Yeah, yeah, yeah yeah. Does those are my questions? 277 00:22:02.240 --> 00:22:07.200 Do you have any Yeah? Sure, yeah. First I wanted to mention 278 00:22:07.680 --> 00:22:14.519 so some people like me, all my websites are written and react a lot 279 00:22:14.559 --> 00:22:18.200 of my a lot of my homepages. But you I wanted to pick your 280 00:22:18.200 --> 00:22:26.680 brain about radics because I started a project with that and I actually thought it 281 00:22:26.839 --> 00:22:30.000 was kind of weird. Maybe you can help explain why. But like the 282 00:22:30.119 --> 00:22:34.759 primitives page they give like for a dialogue, they give you like the markup 283 00:22:34.799 --> 00:22:38.759 and react, but then all the I don't know if it's recommended CSS or 284 00:22:38.880 --> 00:22:44.160 like, I have this feeling like if I don't use exactly they're recommended CSS, 285 00:22:44.599 --> 00:22:48.119 then like it won't be best practices or whatever. So because I was 286 00:22:48.160 --> 00:22:52.319 comparing it, I was looking at at material UI, which I unfortunately I 287 00:22:52.440 --> 00:22:57.079 haven't used yet. But you just drop in a dialogue and it just works, 288 00:22:57.200 --> 00:23:02.400 like because I mean I don't mind external CSS, I just have I 289 00:23:02.480 --> 00:23:07.200 have the concern that you know, if the Radics team decides like, hey, 290 00:23:07.240 --> 00:23:10.480 we don't like this look exactly, let's change this one line. You 291 00:23:10.480 --> 00:23:15.039 know, if you've copied some custom cfs just for a component. Later it's 292 00:23:15.079 --> 00:23:18.079 like probably will still look fine, but it just won't be like like up 293 00:23:18.119 --> 00:23:23.440 to date. So yeah, sure, I mean like probably the whole idea 294 00:23:23.440 --> 00:23:30.279 of around Radix is to be exactly the thing that is not require you to 295 00:23:30.559 --> 00:23:36.000 there's no expert in CSS. They on their examples, right, They have 296 00:23:36.119 --> 00:23:40.200 CSS just to show up things right and to be able you to copy it. 297 00:23:40.640 --> 00:23:44.359 But if you don't want if you want to crafted totally different styles like 298 00:23:44.359 --> 00:23:45.839 I don't know, they want to sharp edges, you want like I don't 299 00:23:45.839 --> 00:23:49.400 know, like dark components, or you want like I don't know, maybe 300 00:23:49.400 --> 00:23:53.119 cartoon based components. You can do that without any SYSS overhead, because if 301 00:23:53.160 --> 00:23:59.559 you have initial you know ton or initial theme INITIALSS and you need to overwrite 302 00:23:59.599 --> 00:24:03.119 it, basically you have two copy of sss for a component, then it 303 00:24:03.200 --> 00:24:06.279 might be hard to support when you update a component, might be like, 304 00:24:06.319 --> 00:24:11.079 you know, look bad because the new property appeared in this style sheet, 305 00:24:11.240 --> 00:24:15.200 then you did not overwrite it, it's now bad or like you know, 306 00:24:15.279 --> 00:24:22.279 priorities and all this stuff. So the radics itself is probably claims that you 307 00:24:22.359 --> 00:24:26.000 should not you should just write your CSS for yourself. Right, They have 308 00:24:26.200 --> 00:24:30.480 the examples with tail wind, I think, and you just like just take 309 00:24:30.519 --> 00:24:34.480 it and then do whatever you want to because the radics itself does not have 310 00:24:34.519 --> 00:24:38.920 any components, and this on the examples, I am pretty sure basically just 311 00:24:38.920 --> 00:24:44.200 just just a reference to just display something in not play an HTM. Al 312 00:24:44.319 --> 00:24:47.720 right, okay, okay, yeah, maybe I think I probably took the 313 00:24:47.759 --> 00:24:52.559 examples like as required like this markup with the CSS, which I guess it 314 00:24:52.640 --> 00:24:56.000 was just weird for me. No, I'm pretty sure it's not. I'm 315 00:24:56.000 --> 00:24:59.079 pretty sure it's not. Basically it's like you know, if you will open 316 00:24:59.359 --> 00:25:03.599 like radis screen now it should say pretty clearly on D so it's starting an 317 00:25:03.599 --> 00:25:10.039 open source component library to my fast development is maintenance. Okay, it's it's 318 00:25:10.079 --> 00:25:15.839 not saying that it's not a headless library, right but oh you have Yeah, 319 00:25:15.839 --> 00:25:19.000 so there is some roddix themes, right I have, No, I 320 00:25:19.000 --> 00:25:23.640 didn't even see that before. Probably there is some some kind of semen right 321 00:25:23.720 --> 00:25:27.400 now, but I personally use it as a headless library to totally. So 322 00:25:27.640 --> 00:25:33.200 it doesn't have any any styles at all, and only styles that they have 323 00:25:33.680 --> 00:25:38.440 are used to do something for accessibility and all the stuff like attributes and style. 324 00:25:38.480 --> 00:25:42.680 It open myself. Yeah, I also had a question in general, 325 00:25:42.839 --> 00:25:48.839 just with your experience with customization. I saw material you I it provides a 326 00:25:48.880 --> 00:25:52.920 lot of different ways, Like you can do one off like I think you 327 00:25:52.960 --> 00:25:56.160 mentioned, like inline styles, or you can do overrides. So for me, 328 00:25:56.319 --> 00:26:03.279 typically, like whenever I'm working with a library, I typically enjoy writing 329 00:26:03.359 --> 00:26:10.200 CSS and like using it globally. But I was just wondering what approaches you've 330 00:26:10.279 --> 00:26:12.880 used and what do you like or you know, are you are you more 331 00:26:12.880 --> 00:26:17.680 of the type that you hate CSS and you like to do all style components 332 00:26:17.799 --> 00:26:22.839 or because I always find like there's just a huge variety in front end depth, 333 00:26:22.920 --> 00:26:26.039 like what they like more and what they dislike. Yeah, so if 334 00:26:26.079 --> 00:26:30.720 you ask my personal thing, I don't like writing global CSS just because it's 335 00:26:30.759 --> 00:26:36.079 too like you know, to switching context for me a lot right now, 336 00:26:36.119 --> 00:26:40.319 my personal way, my personal preferred ways tell wind sss where you have base 337 00:26:40.400 --> 00:26:45.480 styles and you just converted. I love being able to you know, style 338 00:26:45.559 --> 00:26:51.160 everything inside one HTML, right, I think the CSS is kind of over 339 00:26:51.200 --> 00:26:53.240 a keel just so yeah, just don't take me wrong. It's just my 340 00:26:53.279 --> 00:26:57.160 personal opinion. I think like SVG, for instance, you can perfectly find 341 00:26:57.240 --> 00:27:03.400 right svgs with in line styles only right when you just put attributes to styles, 342 00:27:03.440 --> 00:27:07.799 it doesn't it's pretty. It's not really matter where you put your CSS 343 00:27:07.799 --> 00:27:11.759 and as a file or into the HTML files. If you have component system, 344 00:27:12.000 --> 00:27:15.759 if you don't have COMPONENTSYSM, you have pretty like separated schammel And sayss 345 00:27:15.839 --> 00:27:18.440 yes, it makes sense because you need to target things and you don't want 346 00:27:18.440 --> 00:27:23.279 to duplicate stuff. But when you have components right and you can you can 347 00:27:25.039 --> 00:27:29.319 write your attributes once and then redew the component, then it probably makes more 348 00:27:29.359 --> 00:27:34.000 sense to me to write CSS right inside each tamel and tail wind does it. 349 00:27:34.160 --> 00:27:38.279 I think in the best possible way, the fastest, the easier, 350 00:27:38.680 --> 00:27:45.000 the easiest, and like the more the clearest for me personally. So I 351 00:27:45.160 --> 00:27:48.960 just choose in this way instead of writing CSS. But I totally, like, 352 00:27:48.000 --> 00:27:52.279 you know, respect the point of view of developers who love writing CSS, 353 00:27:52.279 --> 00:27:56.640 who did write SYSS for years and they want to just write class names. 354 00:27:57.000 --> 00:28:00.400 Just make sure that it is not like you know, there is no 355 00:28:00.480 --> 00:28:06.599 collisions and there is no like potentially no problems with uh missing styles like you 356 00:28:06.640 --> 00:28:08.599 know, important and all this stuff. So yeah, well not, I 357 00:28:08.640 --> 00:28:11.880 think both ways are pretty good. Cool, Yes, awesome, thank you. 358 00:28:12.359 --> 00:28:18.440 Yeah, that that part was I think you did well because it could 359 00:28:18.480 --> 00:28:25.839 have been very very polemic, so you're able to please both sides. I 360 00:28:25.880 --> 00:28:32.319 am mostly from from the team of writing CSS when possible, but when I'm 361 00:28:32.359 --> 00:28:40.160 doing React then I always just go with style components. But but yeah, 362 00:28:40.640 --> 00:28:48.359 okay, so Dmitri, there are there are a couple of components that even 363 00:28:48.440 --> 00:28:53.960 though they could be they could be reused, it's just so simple to code 364 00:28:55.000 --> 00:29:00.039 them that I never needed any library to help me. So, for example, 365 00:29:00.720 --> 00:29:07.519 a bottom like, it's not like a super complex thing to build, 366 00:29:07.599 --> 00:29:11.039 so I generally just build it myself. But on the other expectrum, there 367 00:29:11.079 --> 00:29:15.279 are components that they're really hard to build. So for example, a date 368 00:29:15.319 --> 00:29:21.279 picker or a calendar, well basically anything that has time zones in it. 369 00:29:21.279 --> 00:29:27.920 It's it's pretty hard, and that also needs the support for internationalization and a 370 00:29:27.960 --> 00:29:36.279 lot of different user gestures and stuff like that. So what I'm trying to 371 00:29:36.319 --> 00:29:41.799 get is, do you think there are any components in the mature UI that, 372 00:29:42.160 --> 00:29:48.000 even though people could have could be coding them from scratch or whatever, 373 00:29:48.240 --> 00:29:56.119 You do think that they should definitely first see if what mature UI has serves 374 00:29:56.160 --> 00:30:02.279 their purpose so that they try it there first before are trying to recreate them. 375 00:30:02.400 --> 00:30:07.640 I would say definitely date pigger because I am actually so I've been working 376 00:30:07.759 --> 00:30:10.400 mostly on date pickers, and I may tell you so basically I build the 377 00:30:10.440 --> 00:30:12.160 date pickers and mich tell you I have the date, the time, the 378 00:30:12.240 --> 00:30:17.000 daytime pickers. And this is like, you know, this is the freaking 379 00:30:18.000 --> 00:30:21.240 worst components in the world to builds from myself, Like you know, I 380 00:30:21.319 --> 00:30:26.319 spend like years building these date pickers. They are complicated as hack. I 381 00:30:26.319 --> 00:30:32.000 don't know, like it is really complicated components. I mean, there are 382 00:30:32.039 --> 00:30:34.640 a lot of issues that you have never think about, Like you know, 383 00:30:34.759 --> 00:30:38.480 you have a phone, right and basically you have phone like this, and 384 00:30:38.680 --> 00:30:42.160 if you turn it, like you know, in the landscape orientation right, 385 00:30:42.160 --> 00:30:47.079 the date pickers should rotate right. And you have never think about that unless 386 00:30:47.160 --> 00:30:51.559 you have somebody who is like complaining about this and making this from scratch. 387 00:30:51.960 --> 00:30:56.119 Supporting the mobile input, which is totally different from the desktip input, is 388 00:30:56.240 --> 00:31:00.319 very hard because in desk dep input people used to do the mask and input, 389 00:31:00.359 --> 00:31:03.480 which is the easiest way. You know, you have a mask for 390 00:31:03.640 --> 00:31:07.880 days for months in years right, and you need to enter You want to 391 00:31:07.960 --> 00:31:10.960 enter it from keyboard. You don't want to pick your in oil of mouse 392 00:31:11.039 --> 00:31:15.400 and just scroll for years, which is like weird. And on mobile it's 393 00:31:15.480 --> 00:31:21.000 much easier to just like scroll it with your with your thumb right. And 394 00:31:21.119 --> 00:31:23.799 in fact, there are a lot of like tweaks to make it look good 395 00:31:23.839 --> 00:31:29.960 because date pickers and time pickers, they both have different views for mobile and 396 00:31:30.000 --> 00:31:33.519 for desktop. You need to make it accessible for mobiles accessible for desktop. 397 00:31:33.640 --> 00:31:37.759 There are a lot of works with you know, displaying the dates, you 398 00:31:37.799 --> 00:31:41.680 know, like you know, manipulating with days. Because everyone wants their own 399 00:31:41.759 --> 00:31:48.319 library, So I wrote the whole library to adapt as an adapter between different 400 00:31:48.400 --> 00:31:52.519 like types of libraries data Finass, date gass and all of this stuff. 401 00:31:52.559 --> 00:31:56.799 And it's published in my name under my name Date are right now and MA 402 00:31:56.920 --> 00:32:00.160 sure you I I suppose they're still using it or they forked, but they've 403 00:32:00.160 --> 00:32:05.200 been using it for a while. And there is a lot of issues I 404 00:32:05.799 --> 00:32:10.480 don't remember even about because it's very hard and very complicated components and other stuff 405 00:32:10.720 --> 00:32:15.880 like I don't know, like tables with virtualization. It's also a very complicated 406 00:32:15.920 --> 00:32:20.119 component that you probably don't want to start building from scratch because it's very hard. 407 00:32:20.920 --> 00:32:24.240 I wouldn't say, though, that Matchell UI implementation is the best in 408 00:32:24.279 --> 00:32:29.039 the world. I am not sure about this right now. I was sure 409 00:32:29.039 --> 00:32:31.160 about that when I've been building day Pickert, that it was one of the 410 00:32:31.200 --> 00:32:36.640 best in the world. Probably still it's very good, but like you just 411 00:32:36.640 --> 00:32:39.000 need to check and probably just don't you know, like I don't know, 412 00:32:39.079 --> 00:32:45.799 don't build your own bicycle every time, which is like maybe will be not 413 00:32:45.960 --> 00:32:50.680 the best you know UI and not the best thing, not because you are 414 00:32:50.680 --> 00:32:53.240 a bad developer, just but just you don't have time to think about all 415 00:32:53.279 --> 00:32:59.160 of the you know, edge cases which appeared through the years of different users 416 00:32:59.400 --> 00:33:02.359 using mache you I owe different libraries. That makes a lot of sense, 417 00:33:04.319 --> 00:33:07.799 and I can identify a lot with the part about thinking that it is the 418 00:33:07.839 --> 00:33:14.039 best in the world until you see what somebody else has done. I felt 419 00:33:14.079 --> 00:33:21.880 that way multiple times, but yeah, some eventually I got my ego in 420 00:33:22.000 --> 00:33:25.359 check and I started looking at my own code without even comparing to others, 421 00:33:25.359 --> 00:33:30.839 and thinking somewhere around the world that's something, there's something better than this. 422 00:33:31.279 --> 00:33:36.880 Yeah, cool, cool. And on the other side, what are some 423 00:33:36.960 --> 00:33:42.200 of the things that you would you would not recommend people to rely on not 424 00:33:42.319 --> 00:33:45.279 just mature you why, but any library to do like stuff that you would 425 00:33:45.359 --> 00:33:50.359 say, Hey, honestly, from my experience, you're better off just coding 426 00:33:50.400 --> 00:33:53.839 this from scratch. Like you know, it's a matter of time, right, 427 00:33:54.000 --> 00:33:58.519 If you're so, I mean, like, it's definitely the matter of 428 00:33:58.559 --> 00:34:01.720 time. If you are building like I don't know, if your whole like 429 00:34:01.880 --> 00:34:06.279 app is all about like tables, right, I don't know. Like, 430 00:34:06.400 --> 00:34:09.119 for instance, you might want to build it like I don't know. You 431 00:34:09.440 --> 00:34:14.280 build a notion or whatever, right, and one of the core features is 432 00:34:14.320 --> 00:34:17.719 your tables, and you want to make it like very flexible and have the 433 00:34:17.880 --> 00:34:23.079 whole control of how you are displaying tables. Probably worse to build it from 434 00:34:23.079 --> 00:34:28.760 scratch, even if it's complicated. Just make sure that you follow all of 435 00:34:28.800 --> 00:34:32.039 the guidelines. You may look good on all of the devices accessible all this 436 00:34:32.119 --> 00:34:37.480 stuff, but if you have yeah, and the same for all of the 437 00:34:37.519 --> 00:34:40.639 components, it's a matter of time, Like you know, how much time 438 00:34:40.679 --> 00:34:45.280 you can spend on building specific components. If you are building like I don't 439 00:34:45.320 --> 00:34:49.800 know, Like notion calendar used to be chronified, right, you don't want 440 00:34:49.840 --> 00:34:53.599 to pick the picker from some library, probably because it is like one of 441 00:34:53.639 --> 00:34:59.400 the most core functionality of your app. Just build it for yourself and make 442 00:34:59.440 --> 00:35:01.920 sure it it is, like you know, optimized for your business purpose. 443 00:35:02.239 --> 00:35:07.880 I would say, so okay, that does make sense, all right. 444 00:35:07.920 --> 00:35:13.079 So guys, honestly, in terms of questions that I had, I think 445 00:35:13.119 --> 00:35:19.239 it's mostly it. I would love to just know if there's anything you would 446 00:35:19.320 --> 00:35:25.039 like to to expand more, Dmitri before we just start wrapping up and talk 447 00:35:25.079 --> 00:35:32.360 about some of our other projects and stuff. So yeah, let's let's talk 448 00:35:32.360 --> 00:35:37.239 about some of the other things that we've been working on. So, Dmitry, 449 00:35:37.519 --> 00:35:42.400 why don't you start since you're the start today. So I did solve 450 00:35:42.599 --> 00:35:46.519 some of the some other project that you're working on, which is a frames. 451 00:35:47.639 --> 00:35:54.199 I honestly thought this was really really interesting. So why don't you pitch 452 00:35:54.280 --> 00:35:59.199 that project to the audience and tell us a little bit more about that? 453 00:35:59.559 --> 00:36:04.199 Okay, okay, So basically effa frames. So if you heard about like 454 00:36:04.280 --> 00:36:09.360 things like remotion, which is a tool for rendering videos in React, and 455 00:36:09.400 --> 00:36:14.199 it is slow, like I don't know, like a snail. So basically 456 00:36:14.239 --> 00:36:17.599 my goal is to take the same concept and to make it fast as like 457 00:36:17.679 --> 00:36:22.480 I don't know, as whatever as Rocket. Basically, it's a project in 458 00:36:22.639 --> 00:36:27.360 Rust which I'm building for two years and I'm you know, like I don't 459 00:36:27.360 --> 00:36:30.639 have time to actually finish it. I have like one last feature that I 460 00:36:30.679 --> 00:36:34.239 want to finish, and it's very complicated. I want to integrate the full 461 00:36:34.320 --> 00:36:38.440 Skia renderer tow AFA frames, which is basically the to do renderer based on 462 00:36:38.840 --> 00:36:44.599 inside your Chrome, right inside your that render scrom and all of the probably 463 00:36:44.639 --> 00:36:50.800 hours and today GPU based and very fast. But I wrote a lot of 464 00:36:50.800 --> 00:36:57.480 code already and basically it's all about like rendering videos in the basically very inspired 465 00:36:57.599 --> 00:37:05.199 way of reactings in Rust, but your videos are rendering as kind of SVG 466 00:37:05.320 --> 00:37:08.639 components, which are G six inspired. Basically, you have a macro to 467 00:37:08.800 --> 00:37:15.440 render SVG yourself like and you describe it as a SVG template based as an 468 00:37:15.519 --> 00:37:20.719 unreact and the concept of rendering is very similar. You have like one render 469 00:37:20.920 --> 00:37:24.920 of one frame and you have like isolated renders, no murations, nothing like 470 00:37:25.000 --> 00:37:29.960 that, no state up based because the videos doesn't have state at all. 471 00:37:30.119 --> 00:37:34.159 But yeah, basically it's trying to be very fast and it's still in beta, 472 00:37:34.320 --> 00:37:37.840 so it includes beta. So yeah, I hope I will not die 473 00:37:37.880 --> 00:37:42.280 before I will release it. I won't let you die. I gotta see 474 00:37:42.280 --> 00:37:47.679 that product. Thank you. How about you, Peter? Yeah, so 475 00:37:49.159 --> 00:37:52.000 not emotion of mind. I think I shared Pat m I bs, I 476 00:37:52.000 --> 00:37:57.960 think we talked about it. So I think maybe you could just share this 477 00:37:58.360 --> 00:38:08.880 audience could especially for audiences MBI kind of hes okay, let me also, 478 00:38:09.320 --> 00:38:14.079 I also send some of the links that we discussed today, So I'm going 479 00:38:14.159 --> 00:38:19.760 to send it on the on the comments section two. Uh, Well, 480 00:38:20.000 --> 00:38:24.199 my my promo is just going to be Onvoid. So for any of you 481 00:38:24.360 --> 00:38:30.280 that might be interested in software outsourcing or extending your staff, Onvoid offers design 482 00:38:30.400 --> 00:38:37.440 and software development services on either hourly, the traditional hourly model, or in 483 00:38:37.480 --> 00:38:44.639 a task based manner. So you can break your tasks into sprints and assign 484 00:38:44.760 --> 00:38:50.239 them to Onvoid, and they're going to work directly with your staff, and 485 00:38:50.440 --> 00:38:53.280 you're only going to have to pay after those tasks are delivered and approved. 486 00:38:53.360 --> 00:39:01.280 So it really does give you a ton of safety into uh in software allsourcing. 487 00:39:02.400 --> 00:39:05.639 And how about you, Chris, So I'm going to send some of 488 00:39:05.639 --> 00:39:09.519 those links here in the coming section, while Chris and shares with us the 489 00:39:09.559 --> 00:39:15.880 things he's working on. Sure, yeah, I'm going to also share something 490 00:39:16.079 --> 00:39:21.519 that I've started. It's I guess similar I mentioned the big or we were 491 00:39:21.519 --> 00:39:24.159 talking before the show, Uh to Dimitri, I'm working on a similar thing. 492 00:39:24.159 --> 00:39:30.320 But now I've just been blown away by real technology. So basically what 493 00:39:30.400 --> 00:39:35.599 I'm doing, I have a very small little applet that it can convert. 494 00:39:35.960 --> 00:39:38.039 You know, you give a code snippet and it writes it on a canvas, 495 00:39:38.960 --> 00:39:45.440 uses WASM in the browser and generates a video that's actually but I've kind 496 00:39:45.440 --> 00:39:50.360 of pivoted away from that because you know, maybe someone like for TikTok would 497 00:39:50.440 --> 00:39:53.480 use it to explain like a very small snippet of code. But now I've 498 00:39:53.559 --> 00:40:00.360 I've kind of gone it's not generative AI, but I leverage AI stuff like 499 00:40:00.480 --> 00:40:07.159 voice cloning and step generation to actually do a screen capture where you can say, 500 00:40:07.239 --> 00:40:12.239 like okay, open the terminal, issue this command. The whole thing 501 00:40:12.280 --> 00:40:15.920 behind it is Eventually my goal is because I make software courses and I've realized 502 00:40:15.960 --> 00:40:21.199 that it's really painful to edit them down, and like when you make mistakes, 503 00:40:21.239 --> 00:40:23.079 you got to go back and cut it. The goal is eventually that 504 00:40:23.159 --> 00:40:30.320 you can almost automate or at least greatly help your workflow when you create software 505 00:40:30.360 --> 00:40:38.199 courses. But it's nowhere near like Dimitri's work with f f frames. It's 506 00:40:39.159 --> 00:40:45.079 yeah, just sorry for interrupting you, but this is exactly the thing that 507 00:40:45.239 --> 00:40:51.280 is I'm trying to so f frames is targeting people who are building apps like 508 00:40:51.400 --> 00:40:53.760 you were doing, right, but just like it not in the inside browser, 509 00:40:54.119 --> 00:40:59.199 but you're building an app and it's renders some server and I'm trying to 510 00:40:59.280 --> 00:41:04.039 make it just fast so you can not host your own like GPU infrastructure, 511 00:41:04.159 --> 00:41:07.360 but you have your own pretty pretty good, like pretty standard you know, 512 00:41:07.480 --> 00:41:12.159 AWS infrastructure, and it's still renders pretty frost on the CPU. Basically, 513 00:41:12.440 --> 00:41:15.440 it's very fun. I'm sorry of being really excited about your project because it's 514 00:41:15.519 --> 00:41:20.800 really like a thing that should be very easy to do with different frames. 515 00:41:20.960 --> 00:41:24.079 Basically, FRA frames would be a back end for your project, right, 516 00:41:24.400 --> 00:41:28.800 and that's very fun. Yeah, yeah, it's funny you mentioned that because 517 00:41:28.840 --> 00:41:30.599 I tried. I tried to be cool and say like, okay, you 518 00:41:30.599 --> 00:41:35.280 can use a doctor back end image or you can use the front end. 519 00:41:35.440 --> 00:41:38.039 The front end is WASM, which is anyway, like barely. It feels 520 00:41:38.119 --> 00:41:42.719 somehow like it's still beta. And the back end I was fighting. I 521 00:41:42.800 --> 00:41:46.119 ended up trying to fight like doing recording like a screen capture on a LAMBA 522 00:41:46.119 --> 00:41:50.480 function and you, oh, I went down this rabbit hole of like there's 523 00:41:50.599 --> 00:41:53.440 specific rules. Yeah yeah, so yeah, of course, Like as soon 524 00:41:53.480 --> 00:41:57.199 as I saw this project, I said, man, I need this for 525 00:41:57.480 --> 00:42:00.719 like yeah, like you said, it's my back end, so yeah, 526 00:42:00.800 --> 00:42:04.079 let's let's definitely get in touch after the show. I'd definitely be interested. 527 00:42:04.159 --> 00:42:07.400 Yeah, sure, I would be happy to help, because I think there 528 00:42:07.519 --> 00:42:10.159 used to be one person who tried to build the same thing, but I 529 00:42:10.199 --> 00:42:16.039 don't know. I think he just like disappeared. Like I mean, like 530 00:42:16.239 --> 00:42:23.199 the idea of rendering things videos inside browser is very bad because of the codex 531 00:42:23.239 --> 00:42:27.719 and all of this stuff. Is only one way if we would have like 532 00:42:28.079 --> 00:42:34.719 backwards. So basically there is a VP codex API that allows you to decode 533 00:42:34.760 --> 00:42:38.039 the audio and video right inside the browser then like you know, ce C 534 00:42:38.119 --> 00:42:42.679 plus plus B API inside browser and all this stuff, but there is no 535 00:42:42.760 --> 00:42:46.719 way to use it backwards. And if you're trying to compile like back to 536 00:42:47.000 --> 00:42:52.599 was, it becomes really slow and people are not like I think love it. 537 00:42:52.679 --> 00:42:55.920 To be honest, there is no big projects that there aren't coding videos 538 00:42:55.920 --> 00:43:00.440 in the browser. It's just slow. Yeah, but I mean, like 539 00:43:00.559 --> 00:43:04.920 I don't know, if you just started whatever, it's it's pretty good and 540 00:43:05.159 --> 00:43:08.400 I definitely would play around with that. I'm becoming really excited. Yeah, 541 00:43:08.400 --> 00:43:14.159 we can talk after the show. Sure, just be careful Chris, because 542 00:43:14.400 --> 00:43:19.639 he literally said that he's your competitor, and the other guy that was doing 543 00:43:19.639 --> 00:43:25.199 it suddenly disappeared. No, no, no, oh, Like so I 544 00:43:25.360 --> 00:43:30.360 you know, like I'm not the competitor, I'm the partner. I am 545 00:43:30.480 --> 00:43:37.599 kind of interested in more tools like that appear because info frames meant to be 546 00:43:37.760 --> 00:43:42.599 used to make them faster, right because right now, like there is not 547 00:43:42.880 --> 00:43:46.000 a lot of things that are programmatically renders video, not a lot of like 548 00:43:46.079 --> 00:43:50.440 you will not find a lot of products that renders like I don't know, 549 00:43:50.599 --> 00:43:57.440 charts videos in in browser programmatically based on data. And I think that just 550 00:43:57.480 --> 00:44:01.000 because there is no product that makes is fast and easy to build, like 551 00:44:01.039 --> 00:44:07.519 you know, like reactors used to be thing that is easy to build SAT 552 00:44:07.840 --> 00:44:12.719 right, Single page application SPA right, and there is no way there is 553 00:44:12.760 --> 00:44:15.840 no library that makes it fast and easy to build like a video from data 554 00:44:15.880 --> 00:44:21.880 programmatically. And if F frames will succeed, I hope there will build much 555 00:44:21.880 --> 00:44:25.199 more product like that based on e F frames or maybe other potential things. 556 00:44:25.280 --> 00:44:28.920 Yeah, and it's like for me, it's it's kind of like the next 557 00:44:28.960 --> 00:44:31.880 generation, right, Like now we have so many image generators right like for 558 00:44:32.440 --> 00:44:37.199 I don't know, like Instagram borders and you even have carbon makes like static 559 00:44:37.400 --> 00:44:42.880 pictures of code, but there's nobody doing it for video because of what you 560 00:44:42.960 --> 00:44:45.639 mentioned. It's like it's there's no tool, there's no good tool for it. 561 00:44:45.760 --> 00:44:51.320 So yeah, I'm super excited. Yeah, all right, all right, 562 00:44:51.719 --> 00:44:55.039 thanks guys. Uh yeah, Diometry was lovely to have you on the 563 00:44:55.079 --> 00:45:00.360 show, so I feel free to join again whenever you want. Your very 564 00:45:00.480 --> 00:45:04.559 very welcome here. It was very nice meeting you, and yeah, for 565 00:45:04.760 --> 00:45:08.119 all of you that stick to this episode up until the very end, thank 566 00:45:08.119 --> 00:45:10.400 you so much and I'll see you in the next one.