1 00:00:06,679 --> 00:00:10,720 Speaker 1: Hello, and how do you Welcome to another adventures in Angular. 2 00:00:10,839 --> 00:00:13,880 My name is Alessa Nicel. I am the Angular Developer 3 00:00:13,919 --> 00:00:17,039 Advocate for Kendo you I and today with me as 4 00:00:17,079 --> 00:00:19,839 a Panla Summer show, I have Brooks Force with us. 5 00:00:19,920 --> 00:00:22,600 Speaker 2: Hello, Hello, and we. 6 00:00:22,320 --> 00:00:27,280 Speaker 1: Are super excited to introduce our guests today. It is 7 00:00:27,359 --> 00:00:29,239 and Kit Sharma Welcome. 8 00:00:29,320 --> 00:00:31,359 Speaker 3: Hello, Hello Alisha. 9 00:00:31,399 --> 00:00:33,439 Speaker 1: So tell us tell us about yourself. 10 00:00:33,799 --> 00:00:36,600 Speaker 3: Yeah, so my name is un Kit. I am currently 11 00:00:37,119 --> 00:00:40,719 staying in Hedrabad, India and I'm currently working with ADP. 12 00:00:41,240 --> 00:00:44,759 I have almost six years of experience in dott net 13 00:00:44,799 --> 00:00:47,840 technologies and I'm currently working as a Fullish tech developer. 14 00:00:48,280 --> 00:00:50,719 Where in the front and I'm using Angler, We're in 15 00:00:50,759 --> 00:00:53,280 the back and I'm using dott Neet technologies and I 16 00:00:53,320 --> 00:00:56,079 am a Google Developer expert and I am also a 17 00:00:56,159 --> 00:01:00,759 community contributor. So I like to write articles and blogs 18 00:01:00,799 --> 00:01:04,040 on various platforms and I also written books. One of 19 00:01:04,079 --> 00:01:06,319 the book is on Blazer and another one is on 20 00:01:06,400 --> 00:01:09,439 sea Shot and I also published a free ebook on 21 00:01:09,640 --> 00:01:13,239 Angler and how to use Angler and Firebase to create 22 00:01:13,280 --> 00:01:14,920 an blog application. 23 00:01:15,519 --> 00:01:19,239 Speaker 1: Oh my goodness, So, like, how do you have time? 24 00:01:19,519 --> 00:01:24,439 First off, let's hit that one because it sounds like 25 00:01:24,480 --> 00:01:26,560 you do it all and I can't even conquer the 26 00:01:26,560 --> 00:01:27,000 front end. 27 00:01:27,280 --> 00:01:33,079 Speaker 3: So yes, so maybe front and in the morning, back 28 00:01:33,120 --> 00:01:33,760 and in the evening. 29 00:01:35,120 --> 00:01:41,560 Speaker 1: You're right and needs more time management. So today we 30 00:01:41,640 --> 00:01:43,640 are I don't want to spoil it, but do you 31 00:01:43,719 --> 00:01:45,959 want to tell the audience about what we are talking 32 00:01:45,959 --> 00:01:47,000 about on the show today? 33 00:01:47,799 --> 00:01:50,879 Speaker 3: Yes, So today we are going to talk about how 34 00:01:50,959 --> 00:01:54,359 to make your Angler applications and smart. We are going 35 00:01:54,400 --> 00:01:58,239 to introduce as your cognitive service to an Angler application 36 00:01:58,640 --> 00:02:00,840 using an asp dot ne code back in so it 37 00:02:00,879 --> 00:02:02,959 will be a fullish tech project. So you I will 38 00:02:02,959 --> 00:02:05,799 be on Angler and the back and will be on 39 00:02:05,840 --> 00:02:08,199 a sp dot net code and we will use we 40 00:02:08,240 --> 00:02:12,159 will be integrating as your Cognitive services to h to 41 00:02:12,400 --> 00:02:16,599 create an OC stands for Optical Character recognition. So the 42 00:02:16,879 --> 00:02:18,840 what we will do that we will upload an image. 43 00:02:18,960 --> 00:02:21,879 The image will have some text and using as your 44 00:02:21,879 --> 00:02:24,280 community services, we will extract the text from the image. 45 00:02:24,360 --> 00:02:28,159 Speaker 1: So I've never personally used as your cognitive services. What 46 00:02:28,759 --> 00:02:29,319 are they? 47 00:02:29,639 --> 00:02:34,360 Speaker 3: As? It provides a list of cognitive services such as 48 00:02:35,159 --> 00:02:38,599 you can extract text from an image, you can translate 49 00:02:38,759 --> 00:02:42,360 from one language to another language, you can translate your 50 00:02:42,479 --> 00:02:45,159 speech to text. There there are a list of and 51 00:02:45,199 --> 00:02:48,639 they are very wide range of community services provided by Azure. 52 00:02:48,879 --> 00:02:51,599 So I'm using few of them. One of them in 53 00:02:51,759 --> 00:02:53,520 Angler in my application. 54 00:02:53,400 --> 00:02:58,039 Speaker 1: That sounds really awesome is so is it all free 55 00:02:58,120 --> 00:03:00,240 to use? Is it like a subscription plan? How do 56 00:03:00,280 --> 00:03:02,680 you get started with the Azure cognitive part? 57 00:03:03,080 --> 00:03:06,719 Speaker 3: So Aszure itself has a paid plant, but for the 58 00:03:06,759 --> 00:03:09,960 first one month, it's completely free. Where you got, if 59 00:03:10,000 --> 00:03:13,000 I'm not wrong, almost three hundred dollars to play around 60 00:03:13,080 --> 00:03:15,879 for first for one month and after that you can 61 00:03:16,199 --> 00:03:18,319 transfer it to pay as you go or other the 62 00:03:18,400 --> 00:03:23,280 other plants available. So yeah, and there are few services 63 00:03:23,280 --> 00:03:25,680 which are free for twelve months, and all of the 64 00:03:25,719 --> 00:03:27,840 list is avlable. I don't have the exact list with 65 00:03:27,879 --> 00:03:30,080 me now, but most of the list is available on 66 00:03:30,120 --> 00:03:31,439 the as your website. 67 00:03:31,719 --> 00:03:35,560 Speaker 1: So what got you like? Started on this ocr app? 68 00:03:35,800 --> 00:03:39,240 Speaker 3: So I was just playing around. See I've written a 69 00:03:39,240 --> 00:03:41,400 lot of article on Angler where I created flesh Teck 70 00:03:41,400 --> 00:03:45,319 application where I created some cloud operation. Then I created 71 00:03:45,360 --> 00:03:48,120 and I was playing with Cloud, so I thought of 72 00:03:48,120 --> 00:03:49,960 playing with cloud. So in Cloud, I first started with 73 00:03:50,039 --> 00:03:53,360 fire Base because five ways was free, so I created 74 00:03:53,360 --> 00:03:56,759 a few applications with fire Base. One is blogging application 75 00:03:57,080 --> 00:03:59,840 and another is a multiplayer Tic Tac Toe game application. 76 00:04:00,479 --> 00:04:05,039 Multi yeah, so this multiplayer tic tact game is super awesome. 77 00:04:05,120 --> 00:04:07,360 The thing is that that the usp of that application 78 00:04:07,479 --> 00:04:09,280 is that you can play with anyone in the world. 79 00:04:09,680 --> 00:04:11,280 If I want to play with you, I will send 80 00:04:11,319 --> 00:04:13,680 you a U r L. You play at your machine, 81 00:04:13,680 --> 00:04:15,280 I play at my machine and we can play in 82 00:04:15,360 --> 00:04:15,840 real time. 83 00:04:16,040 --> 00:04:18,360 Speaker 1: Okay, I have to find your GitHub, broke quick. 84 00:04:19,120 --> 00:04:21,480 Speaker 3: Yeah it is. It is in guitab. If it is, 85 00:04:21,560 --> 00:04:23,319 it is a level, it's it's it's free. 86 00:04:23,639 --> 00:04:24,040 Speaker 1: It's free. 87 00:04:24,040 --> 00:04:28,160 Speaker 3: Okay. But I was talking so after after fire Base, 88 00:04:29,040 --> 00:04:33,759 after fire Base, I thought of doing something to play 89 00:04:33,959 --> 00:04:36,759 play around something. So what I got into is that 90 00:04:36,800 --> 00:04:39,000 when I and I joined a new company called a 91 00:04:39,079 --> 00:04:42,000 DP in last year August, and there I got it 92 00:04:42,040 --> 00:04:44,879 as a subscription. So let's say, I said, okay, let's 93 00:04:44,879 --> 00:04:47,560 play play with it. Why why to waste it? So 94 00:04:47,600 --> 00:04:49,800 I was playing around something something, and then I came 95 00:04:49,839 --> 00:04:52,920 up with this few few applications. One of them is 96 00:04:52,959 --> 00:04:57,000 a multi language translator, which is similar to a Google translate. 97 00:04:57,639 --> 00:05:00,759 So there you have to create you have put your 98 00:05:00,800 --> 00:05:04,040 input language and it will translate in almost twenty six languages, 99 00:05:04,720 --> 00:05:08,920 so that is an translator. So after a translator translator, 100 00:05:08,959 --> 00:05:11,360 I came across I was going to a documentation and 101 00:05:11,480 --> 00:05:15,279 saw it that the ocr API from Zocognitive Services. I 102 00:05:15,319 --> 00:05:18,600 really liked it, so I created this application. OHR stands 103 00:05:18,600 --> 00:05:19,839 for Optical Character Recognition. 104 00:05:20,120 --> 00:05:23,959 Speaker 1: Oh my goodness. So do we want to tell us 105 00:05:23,959 --> 00:05:26,600 what you would like to walk through? First? You want 106 00:05:26,639 --> 00:05:29,240 to walk through using the application and what that looks like? 107 00:05:29,319 --> 00:05:31,720 Or do you want to walk through creating it and 108 00:05:31,800 --> 00:05:34,920 the pieces? Or you you tell me where where shall 109 00:05:34,959 --> 00:05:35,199 we go? 110 00:05:35,600 --> 00:05:39,120 Speaker 3: Maybe we can start with how to create it? So 111 00:05:39,240 --> 00:05:42,879 I have a I have written one blog post also 112 00:05:42,959 --> 00:05:45,399 which is published on my website as well as as 113 00:05:45,399 --> 00:05:47,759 well as it is published on free code Camp. 114 00:05:47,959 --> 00:05:48,600 Speaker 2: So we're going. 115 00:05:48,600 --> 00:05:48,920 Speaker 3: To have that. 116 00:05:49,040 --> 00:05:52,000 Speaker 1: Gethub link and the blog post and all your info 117 00:05:52,399 --> 00:05:55,120 linked in the show notes. Check it out if you're 118 00:05:55,160 --> 00:05:55,800 not driving. 119 00:05:56,920 --> 00:06:00,480 Speaker 3: Yeah. So yeah, the GitHub and in the article I 120 00:06:00,480 --> 00:06:03,120 I have clearly stared the by step process of how 121 00:06:03,160 --> 00:06:05,160 to create this application. But let me give you an 122 00:06:05,199 --> 00:06:09,639 overview of how to create this. So the first is 123 00:06:09,759 --> 00:06:14,000 there are two prerecredits, two separate prerecresiits. So one is 124 00:06:14,040 --> 00:06:16,519 for Angler, So if you are new to Angler, if 125 00:06:16,560 --> 00:06:18,920 you're not Angler developer and you're new to Angler, then 126 00:06:18,959 --> 00:06:21,800 you have to do all the precrecruise for Angler. One 127 00:06:21,800 --> 00:06:25,279 of them is Angler Cli no JS. Only two prerecrus 128 00:06:25,360 --> 00:06:28,800 for to to software you have to install, and then 129 00:06:28,839 --> 00:06:31,439 another one is since we are using asp dott code 130 00:06:31,480 --> 00:06:34,399 back end, so we have to finish the prerecreuse for 131 00:06:34,560 --> 00:06:38,360 dot net code also, So for that we need dot 132 00:06:38,399 --> 00:06:40,160 net core as DK three dot one which is the 133 00:06:40,240 --> 00:06:44,360 latest one, and we have to install Visa Studo twenty nineteen. 134 00:06:44,839 --> 00:06:47,959 Speaker 1: I really want to say I recently I've been like 135 00:06:48,240 --> 00:06:52,360 JavaScript all the way, and I've done a little bit 136 00:06:52,360 --> 00:06:55,920 of like Ruby and rails, but mostly it's like, hey, 137 00:06:55,959 --> 00:06:58,240 I'm like sticking to the front end. So I recently 138 00:06:58,560 --> 00:07:02,079 had a core at work who works with dot net 139 00:07:02,120 --> 00:07:04,279 and he was like, hey, let's spin up this app 140 00:07:04,319 --> 00:07:07,600 together on my machine. And I was like okay. And 141 00:07:07,680 --> 00:07:11,759 it wasn't as like I've I've downloaded, I've cloned down 142 00:07:11,800 --> 00:07:14,199 and like got started with NOE projects that were harder 143 00:07:14,439 --> 00:07:17,199 to get set up. So it's really not that difficult 144 00:07:17,199 --> 00:07:18,839 to get started with dot net. And so if you 145 00:07:18,959 --> 00:07:21,399 haven't and you want to try it. Just really it's 146 00:07:21,399 --> 00:07:23,000 not that scary, so anyway. 147 00:07:22,800 --> 00:07:26,040 Speaker 3: Yes, yes, it's it's very scary forward. It's simple. You 148 00:07:26,120 --> 00:07:29,120 just need to install with your story nineteen and the community. 149 00:07:29,120 --> 00:07:32,720 A DESA is completely free for the lifetime you will 150 00:07:32,800 --> 00:07:34,920 won't we charge any a single penny for that. We 151 00:07:35,079 --> 00:07:37,439 just to renting and dot net code as dot net 152 00:07:37,480 --> 00:07:39,240 code is also an open source so you can diet 153 00:07:39,240 --> 00:07:41,920 click it up dot net code d also, So after 154 00:07:41,959 --> 00:07:44,519 this installation is done, the third thing you required isn't 155 00:07:44,519 --> 00:07:47,079 as a subscription account. So if you don't have an 156 00:07:47,120 --> 00:07:49,560 Azo subscription account, you can create a free as a 157 00:07:49,600 --> 00:07:52,879 subscription account for one month and you may need a 158 00:07:52,920 --> 00:07:56,439 credit card for that and you won't we charged anything 159 00:07:56,519 --> 00:07:58,560 until you use that. But for first one month it's 160 00:07:58,560 --> 00:08:02,199 completely free. After it will be paid service. So after 161 00:08:02,240 --> 00:08:06,600 this prequidy is done, you have to create a Angler 162 00:08:06,639 --> 00:08:09,519 and SP dot net code project. So there is that 163 00:08:09,720 --> 00:08:12,959 there are few templates provided by Video Studio in dot 164 00:08:13,000 --> 00:08:17,560 net where they have already created a template application where 165 00:08:18,040 --> 00:08:19,839 all all the setup is done, where we have a 166 00:08:19,879 --> 00:08:21,639 back end of SP dot net co on the front 167 00:08:21,680 --> 00:08:23,439 end of Angler. So you have to create a template 168 00:08:23,480 --> 00:08:25,160 application and then you can. 169 00:08:25,560 --> 00:08:25,839 Speaker 2: You have to. 170 00:08:26,040 --> 00:08:27,759 Speaker 3: You can get started with the dot net code. The 171 00:08:27,800 --> 00:08:31,439 first step that we can do is to create a 172 00:08:31,480 --> 00:08:34,559 dot net code service which will call our as your 173 00:08:34,600 --> 00:08:36,799 A p I. So for that, the first step is 174 00:08:36,799 --> 00:08:38,879 to we have to go to Azure and then we 175 00:08:38,960 --> 00:08:41,399 have to create the cognitive service. So there there is 176 00:08:41,440 --> 00:08:44,279 something called az your portal there you have to go. 177 00:08:44,679 --> 00:08:46,960 So if you sign if you signed to as you 178 00:08:47,080 --> 00:08:50,279 you can go to portal Lotz dot com and there 179 00:08:50,480 --> 00:08:52,799 you have to create the cognitive service. So the steps 180 00:08:52,799 --> 00:08:55,799 are pretty simple and it is the steps are clearly 181 00:08:55,840 --> 00:08:59,480 mentioned the applications in the article. Also there you have 182 00:08:59,559 --> 00:09:02,440 to create something called computer vision. So computer vision is 183 00:09:02,480 --> 00:09:05,960 the name of our cognitive service that we have to create, 184 00:09:06,279 --> 00:09:10,320 and it's very simple. It's a form where you have 185 00:09:10,399 --> 00:09:13,600 to keep the name and location and some pricing tie 186 00:09:13,600 --> 00:09:15,559 and those basic details you have to furnish and will 187 00:09:15,600 --> 00:09:18,519 be created and then you will get a key, subscription 188 00:09:18,639 --> 00:09:22,240 key and the end point you are So the subscription 189 00:09:22,399 --> 00:09:24,840 key and the end point you are l will be 190 00:09:24,960 --> 00:09:27,960 unique for your own cognitive service and you have to 191 00:09:28,080 --> 00:09:31,559 use this to access your cognitive service from your dot 192 00:09:31,799 --> 00:09:35,399 code application. That is how the whole communication from your 193 00:09:35,519 --> 00:09:38,200 code to and as your cloud is going to work. 194 00:09:38,919 --> 00:09:42,240 So this is where the key and the endpoint you 195 00:09:42,320 --> 00:09:46,600 all comes into effect. So once your key is done generated, 196 00:09:46,639 --> 00:09:49,799 your endpoint you are generated. Now the things are pretty 197 00:09:49,840 --> 00:09:51,879 much a straightforward. So what you have to do is 198 00:09:51,919 --> 00:09:54,559 you have to write a service and in the service 199 00:09:55,000 --> 00:09:57,639 you have to make an actually bit call and you 200 00:09:57,720 --> 00:10:00,679 have to send your image data in form of bites 201 00:10:00,960 --> 00:10:03,279 to your as a cloud where that's to be called, 202 00:10:03,559 --> 00:10:06,639 and then you will get the return and all the 203 00:10:06,639 --> 00:10:09,600 work is done by your cognitive service. They will return 204 00:10:09,720 --> 00:10:12,639 you all the text from that image in form of 205 00:10:12,679 --> 00:10:15,120 a Jason. Now you got the Jason. Now it's up 206 00:10:15,159 --> 00:10:16,960 to you how you are to want to manipulate it. 207 00:10:17,480 --> 00:10:21,080 So in my case, I have done some manipulation. The 208 00:10:21,159 --> 00:10:23,759 reason for that is they will send Jason in a 209 00:10:24,159 --> 00:10:26,639 in a word format, so like they will send each 210 00:10:26,679 --> 00:10:28,879 word wise and they will send a lot of information 211 00:10:29,039 --> 00:10:31,879 like what is the coordinate of that word, if the 212 00:10:31,919 --> 00:10:34,360 word is a state or not it is rotated by 213 00:10:34,360 --> 00:10:36,320 some degrees. Is a lot of information. They said, I 214 00:10:36,360 --> 00:10:39,600 don't mind all the information. The requirement from my app 215 00:10:39,679 --> 00:10:42,679 is that if there's a text written over the image, 216 00:10:43,080 --> 00:10:46,080 I want to print that text on the simple textbox. 217 00:10:46,440 --> 00:10:49,759 And also the text is written in form of line, 218 00:10:50,159 --> 00:10:53,360 but the object is written Jason is returned where they 219 00:10:53,360 --> 00:10:57,279 have separated word wise. So I did some small manipulation 220 00:10:57,399 --> 00:10:59,960 where I am joining all the words to create a 221 00:11:00,919 --> 00:11:05,039 line by separation. So there's a small manipulation where I 222 00:11:05,120 --> 00:11:08,559 use a string builder to uh look through that Jason 223 00:11:08,639 --> 00:11:11,440 and fetch the ward and they create the sentence. And 224 00:11:11,480 --> 00:11:14,360 once you've got the sentence, you will also get the language. 225 00:11:15,000 --> 00:11:18,399 So the ocr A P I support I think twenty 226 00:11:18,440 --> 00:11:21,080 six languages. I am not sure about the exact count, 227 00:11:21,159 --> 00:11:23,759 but around twenty five to twenty six languages. So you 228 00:11:23,799 --> 00:11:28,440 can send, you can send upload the image in any 229 00:11:28,440 --> 00:11:30,679 of these twenty six languages and they will give you 230 00:11:30,759 --> 00:11:31,879 the result for that. 231 00:11:32,440 --> 00:11:35,879 Speaker 1: I'm just amazing. I'm watching the gifts on the bottom 232 00:11:35,919 --> 00:11:37,559 of your blog poster. 233 00:11:38,080 --> 00:11:44,039 Speaker 3: And it's amazing, like, yes, yes, that that gives. Yeah, 234 00:11:44,080 --> 00:11:49,039 so that gif is there. And so once once you 235 00:11:49,120 --> 00:11:53,279 create that application, was the application is uh? You know? Well, yeah, 236 00:11:53,360 --> 00:11:55,919 you got the you've got the Jason, and you've got 237 00:11:55,919 --> 00:11:59,960 the language also. So now the question is now there 238 00:12:00,080 --> 00:12:02,320 is a very interesting thing. So I will tell you 239 00:12:02,360 --> 00:12:05,279 what is the According to me, this is the best 240 00:12:05,279 --> 00:12:09,039 part of my article. So the language which they returned 241 00:12:09,080 --> 00:12:12,080 is in the form of code, for example Ian for English, 242 00:12:12,519 --> 00:12:16,039 fr for French, and something like that. But if I 243 00:12:16,080 --> 00:12:19,000 have to show to the user, I cannot show Ian 244 00:12:19,159 --> 00:12:22,279 or FR. That is not user friendly. You don't understand that. 245 00:12:22,559 --> 00:12:25,399 So I need to show full language English, French. So 246 00:12:25,440 --> 00:12:29,440 now there are two options. Either create There is a 247 00:12:29,480 --> 00:12:32,240 documentation on Microsoft website where you can see the list 248 00:12:32,279 --> 00:12:36,399 of all the languages which is supported by ocr API. 249 00:12:36,720 --> 00:12:39,440 So you have to create the You have to create 250 00:12:39,480 --> 00:12:42,879 a dictionary or a lookup table manually where you will 251 00:12:42,879 --> 00:12:46,919 map every language with their key. But that is not 252 00:12:47,039 --> 00:12:49,120 what programmers do. If I have to do work manually, 253 00:12:49,159 --> 00:12:51,039 I cannot be a programmer, right, So I have to 254 00:12:51,080 --> 00:12:55,639 do some modernization. So what I did is so I 255 00:12:55,679 --> 00:12:58,720 did a kind of hack. So there is another cognitive 256 00:12:58,759 --> 00:13:02,159 service that is called translate text. So as the name suggests, 257 00:13:02,200 --> 00:13:05,519 it translates texts from one language to another language. So 258 00:13:05,639 --> 00:13:09,919 Microsoft has created a public API where they expose the 259 00:13:10,039 --> 00:13:13,399 list of all the languages which is supported by translate 260 00:13:13,440 --> 00:13:17,000 Text API, and the list of languages which is supported 261 00:13:17,000 --> 00:13:20,320 by ocr API is a subset of list of language 262 00:13:20,320 --> 00:13:23,159 supported by Translate Text API. So I make a call 263 00:13:23,279 --> 00:13:27,200 to Translate Text API endpoint. I get all the lists, 264 00:13:27,399 --> 00:13:30,519 populate it in a dictionary, and my work is done. 265 00:13:30,840 --> 00:13:34,399 I set all my manual work and now everything is automation. 266 00:13:34,679 --> 00:13:36,639 So if you see in the article, I have clearly 267 00:13:36,679 --> 00:13:39,200 mentioned if you go, there's a section called why do 268 00:13:39,279 --> 00:13:43,440 we need to fetch the list of supported language? There's 269 00:13:43,519 --> 00:13:46,440 a sandy Yeah, there are small paragraphs. So there I 270 00:13:46,480 --> 00:13:49,240 have mentioned clearly that why I am calling because people 271 00:13:49,240 --> 00:13:52,799 will get confused that if you're working with an ocr API, 272 00:13:53,120 --> 00:13:55,679 why you are calling a Translate text api end point. 273 00:13:55,879 --> 00:13:58,120 So this is the reason. I just need to fetch 274 00:13:58,200 --> 00:14:01,320 the list of language and make it more user friendly application. 275 00:14:01,879 --> 00:14:04,039 So from this I am creating a look up table 276 00:14:04,080 --> 00:14:06,679 basically a dictionary. And when I am getting a language 277 00:14:06,720 --> 00:14:09,039 code like Ian I am getting, I am displaying the 278 00:14:09,120 --> 00:14:11,720 value as English on the UI. If I'm getting far 279 00:14:11,799 --> 00:14:13,720 for French, I am displaying the name is French on 280 00:14:13,759 --> 00:14:16,639 the UI. So this makes my language more user friendly. 281 00:14:18,120 --> 00:14:20,840 So I also like to add one more thing. So 282 00:14:21,639 --> 00:14:24,759 on this particular thing only I spent almost two days 283 00:14:25,559 --> 00:14:30,279 because I want I thought that let's show the code only. 284 00:14:30,559 --> 00:14:32,120 But then I thought that code want to be more 285 00:14:32,200 --> 00:14:36,000 user friendly, so make it something more user friendly so 286 00:14:36,039 --> 00:14:39,159 that people can relate to it. So that is why 287 00:14:39,279 --> 00:14:40,879 I created this particular hack. 288 00:14:41,399 --> 00:14:43,519 Speaker 1: I love it. Is it a hack to. 289 00:14:43,519 --> 00:14:52,200 Speaker 3: Be it's not a hack, but it's something different than 290 00:14:52,240 --> 00:14:53,320 the normal workflow. 291 00:14:53,720 --> 00:14:53,919 Speaker 1: Yeah. 292 00:14:54,480 --> 00:14:56,960 Speaker 3: And and and in the client side, if you see, 293 00:14:57,360 --> 00:15:02,279 it's a uh plain simple UI for angler. So I 294 00:15:02,320 --> 00:15:04,799 have a service. I am calling the endpoint and the 295 00:15:04,879 --> 00:15:07,480 thing is that I am uploading the IMAH. So there 296 00:15:07,519 --> 00:15:10,679 is a uh there's an option to upload the image 297 00:15:10,679 --> 00:15:13,559 and then show an image preview. So if you see 298 00:15:14,200 --> 00:15:17,759 to show the image preview, calling and I am uploading 299 00:15:17,759 --> 00:15:21,000 the IMAH and I am showing the max file size 300 00:15:21,039 --> 00:15:23,759 of four m b. Yeah, so there is a limitation. Also, 301 00:15:23,799 --> 00:15:26,279 I forget to mention that there is a limitation of 302 00:15:26,320 --> 00:15:28,759 O c R A p I that the maximum file 303 00:15:28,799 --> 00:15:31,399 size can be four mbs only. So I don't know 304 00:15:31,399 --> 00:15:34,000 what is logic for this limitation, but trently, this is 305 00:15:34,039 --> 00:15:36,279 a limitation. So that's why I have put the maximum 306 00:15:36,320 --> 00:15:40,519 five sizes four mbs. And then once the image uploaded, 307 00:15:41,039 --> 00:15:43,720 I will get that uploaded image and in a form 308 00:15:43,720 --> 00:15:47,000 of byte, and I am sending viable call to my 309 00:15:47,639 --> 00:15:49,759 back end, and then the back end is sending me 310 00:15:49,759 --> 00:15:52,159 a string data the text and which I'm displaying on 311 00:15:52,159 --> 00:15:56,159 the UI. So this is how my application is working 312 00:15:56,240 --> 00:15:59,240 end to end. And I'm using bootsteff for some styling. 313 00:15:59,759 --> 00:16:02,120 And that's how you get to the end of the 314 00:16:02,200 --> 00:16:04,840 article where you can see that of some gift which 315 00:16:05,039 --> 00:16:05,720 you are a fan of. 316 00:16:05,840 --> 00:16:12,960 Speaker 1: Now, oh my goodness, I am. I'm actually looking through 317 00:16:13,000 --> 00:16:16,480 your GitHub codes right now. I'm trying to find the 318 00:16:16,600 --> 00:16:20,240 point that you're calling the the vision service or the 319 00:16:20,879 --> 00:16:23,600 to find a list of languages language support for computing. 320 00:16:23,639 --> 00:16:25,759 Speaker 3: Yeah, so I will tell you you have to go 321 00:16:25,919 --> 00:16:31,799 to ocr controller inside the controllers folder, and the and 322 00:16:31,879 --> 00:16:34,120 the last method is get available languages method. 323 00:16:34,399 --> 00:16:37,840 Speaker 1: So how long did you said that? The the UCR 324 00:16:37,960 --> 00:16:41,240 portion where you're translating basically from like fr to French 325 00:16:41,960 --> 00:16:43,840 took you two days? How long did the whole thing 326 00:16:44,559 --> 00:16:45,559 take to accomplish? 327 00:16:46,080 --> 00:16:50,320 Speaker 3: So the whole application, see the multiple parts, So the 328 00:16:50,320 --> 00:16:54,039 whole application, I will say along five days for five days, 329 00:16:54,080 --> 00:16:56,960 I'm not sure the days. Yeah, but yeah, working part time, 330 00:16:57,000 --> 00:16:57,799 not completely. 331 00:16:58,240 --> 00:17:02,000 Speaker 1: You're like, I didn't pay basically is what you're saying 332 00:17:02,039 --> 00:17:02,240 to me. 333 00:17:03,039 --> 00:17:09,200 Speaker 3: Yeah, no, no, it's a working part time. Basically it 334 00:17:09,200 --> 00:17:11,480 means like two three hours a day. So I will 335 00:17:11,519 --> 00:17:14,920 say fifteen to twenty hours to create everything and two 336 00:17:15,000 --> 00:17:17,680 days especially for that translation from to create that look 337 00:17:17,720 --> 00:17:19,839 up dictionary, because I have to think of a logic 338 00:17:19,920 --> 00:17:22,000 that what should I do in that case at one 339 00:17:22,039 --> 00:17:25,920 point of at one point I thought to create everything manually, 340 00:17:26,079 --> 00:17:27,960 and I think that there is no program between me 341 00:17:28,039 --> 00:17:31,359 and an a lazy person like we should be. We 342 00:17:31,400 --> 00:17:33,440 are developed. We should do some smart solution. We should 343 00:17:33,480 --> 00:17:35,799 give some smart solution. So that's why I come up 344 00:17:35,799 --> 00:17:40,160 with that particle logic. So that's how this method come 345 00:17:40,240 --> 00:17:44,079 into existence. So one more thing I would like to add. 346 00:17:44,240 --> 00:17:46,039 So here you can see I have created a few 347 00:17:46,119 --> 00:17:49,559 models also, so these models will allow me to bind 348 00:17:49,599 --> 00:17:52,319 to my Jason data addictally. So the OCA API is 349 00:17:52,359 --> 00:17:56,000 returning data in a format of adjacent and then when 350 00:17:56,039 --> 00:18:00,319 I decalize the Jason using our in our code dot 351 00:18:00,400 --> 00:18:02,759 net code, then I need a class or a model 352 00:18:02,799 --> 00:18:05,000 to bind it to directly. So that is why I 353 00:18:05,039 --> 00:18:09,799 have created a few models to store the values. So 354 00:18:09,920 --> 00:18:12,000 that is coming from the JON. So here you can 355 00:18:12,039 --> 00:18:16,400 see we have a language model will give the name 356 00:18:16,400 --> 00:18:19,039 of the language, the native name. That directly that there 357 00:18:19,079 --> 00:18:22,039 are few things are there which are coming from the 358 00:18:22,160 --> 00:18:25,880 Jason And maybe at the end I can I can 359 00:18:25,920 --> 00:18:28,279 share few relevant details where you can find the JSON 360 00:18:28,359 --> 00:18:32,200 structure and maybe the AZ your cognitive service socioor API 361 00:18:32,319 --> 00:18:35,680 official documentation where you can see that structure and step 362 00:18:35,680 --> 00:18:36,920 by step will be more helpful. 363 00:18:37,160 --> 00:18:40,839 Speaker 1: Yes, I haven't even touched the dot net side. I'm scared, 364 00:18:41,240 --> 00:18:43,720 like walking through your angular code, I'm like, oh no, 365 00:18:44,559 --> 00:18:47,000 well it's on the back. So what walking through? What 366 00:18:48,000 --> 00:18:51,160 everything that like the dot net is handling, it's obviously handling. 367 00:18:51,519 --> 00:18:53,960 Speaker 3: Yes, yeah, you can say the heavy lifting is done 368 00:18:54,000 --> 00:18:59,079 by the dot net and angler is just for just 369 00:18:59,640 --> 00:19:02,400 to show, like you can suggest for UI, just for 370 00:19:02,440 --> 00:19:05,400 make the app beautiful look and feel. Yeah. 371 00:19:05,519 --> 00:19:07,599 Speaker 4: Are you doing any sort of authorization with that net 372 00:19:07,680 --> 00:19:11,680 or anything like that or is this just the father No, so. 373 00:19:12,079 --> 00:19:15,279 Speaker 3: There is so. Initially I told that when you when 374 00:19:15,319 --> 00:19:18,079 you create the API, you will get a key, a 375 00:19:18,079 --> 00:19:21,480 PI subscription and the end points for this subscription key 376 00:19:21,559 --> 00:19:25,359 is the my authoriation. So that's that should be kept 377 00:19:25,400 --> 00:19:26,960 hidden or it should be used privately. 378 00:19:27,440 --> 00:19:28,960 Speaker 2: Yeah, it's a it's a really cool app. 379 00:19:29,000 --> 00:19:29,279 Speaker 3: Thanks you. 380 00:19:29,640 --> 00:19:32,799 Speaker 4: It's always annoying to have to deal with paper anyways, 381 00:19:32,920 --> 00:19:34,839 So you know, just you can whip one of these 382 00:19:34,880 --> 00:19:35,480 up pretty quick. 383 00:19:35,519 --> 00:19:36,319 Speaker 2: It's awesome. 384 00:19:36,400 --> 00:19:40,359 Speaker 3: Yeah so yeah, so yeah. So adding on the same note, 385 00:19:40,559 --> 00:19:44,160 so now as you have two different kinds of APIs. 386 00:19:44,559 --> 00:19:47,079 One is for optical Character Reader, which I am using, 387 00:19:47,279 --> 00:19:50,720 which recognizes only the printed text. It will not recognize 388 00:19:50,759 --> 00:19:53,359 the handwritten text. Now there is another ap I called 389 00:19:53,400 --> 00:19:58,160 read API, which is beneficial for large document or handwritten text. 390 00:19:58,240 --> 00:20:01,559 Let's say you have multi pages which you want took 391 00:20:01,559 --> 00:20:03,240 a handleton page and which you want to convert to 392 00:20:03,640 --> 00:20:05,640 a word. Then you can use a red PA, which 393 00:20:05,640 --> 00:20:08,000 is a separate APA from this, and which which works 394 00:20:08,119 --> 00:20:09,720 very good with the handleton text. 395 00:20:09,839 --> 00:20:15,559 Speaker 1: I mean, like I'm thinking maybe not my handwriting, like 396 00:20:16,119 --> 00:20:18,480 someone who can actually write. 397 00:20:18,720 --> 00:20:20,519 Speaker 2: You can train the models, you know. 398 00:20:21,440 --> 00:20:25,400 Speaker 1: Oh yeah, oh man, it's rough. Bob my husband who's 399 00:20:25,440 --> 00:20:28,799 known me for like ten years, he still like struggles 400 00:20:30,000 --> 00:20:31,799 because it changes daily. 401 00:20:31,960 --> 00:20:40,880 Speaker 3: So yeah, dynamic handwriting, Oh my goodness. So that was 402 00:20:40,960 --> 00:20:45,000 for the application. I really enjoyed this creating this because 403 00:20:45,039 --> 00:20:47,599 it was a lot of tricks and a lot of 404 00:20:47,640 --> 00:20:49,880 things we have to do. It was a great experience 405 00:20:49,960 --> 00:20:52,839 for me. And then I write this article. I said, 406 00:20:52,880 --> 00:20:55,559 let's say have this knowledge with everyone write this article. 407 00:20:56,000 --> 00:20:58,960 Speaker 1: I'm just amazed because I I'm on your get up 408 00:20:59,000 --> 00:21:02,599 looking at all your applications. Do you just get a 409 00:21:02,640 --> 00:21:05,559 hanker in You're like, hey, I want to like blogging 410 00:21:05,599 --> 00:21:11,279 app with Angular, cloud fire Store. Yes, you're just like, hey. 411 00:21:11,759 --> 00:21:16,680 Speaker 3: So say this blogging So this blogging app with Angler 412 00:21:16,680 --> 00:21:19,519 and fire Store has a long story attached to it. 413 00:21:20,200 --> 00:21:24,160 So yeah, so the story is that this is this 414 00:21:24,240 --> 00:21:28,319 application is my playground. Playground means if I want to 415 00:21:29,160 --> 00:21:31,720 you want to learn something in Angler, I use this application. 416 00:21:32,240 --> 00:21:35,279 And there is another application if you see have you 417 00:21:35,319 --> 00:21:41,440 seen the bookcart? Yeah, so for bookcart, I have pinged 418 00:21:41,440 --> 00:21:43,079 you in the chat. Also you can look at that. 419 00:21:43,240 --> 00:21:48,279 So book cut is a kind of complete page complete, 420 00:21:48,680 --> 00:21:51,920 what you say, shopping cut application. So there is a 421 00:21:52,359 --> 00:21:55,200 online e cart here in India called flip card, So 422 00:21:55,319 --> 00:21:57,680 I just I just stole the name from there. I 423 00:21:57,680 --> 00:22:02,319 put a book cut. So this is a bookshop as 424 00:22:02,319 --> 00:22:03,960 you can see it. And it's the pretty basic application. 425 00:22:04,000 --> 00:22:07,200 I'm using Angle, matarials, dot net Core, but complete into 426 00:22:07,200 --> 00:22:11,400 an application and it has authoriation, authentication, and there are 427 00:22:11,400 --> 00:22:13,920 a lot of other things also, so you can place 428 00:22:14,000 --> 00:22:18,319 the order, you can upload the images, you can see 429 00:22:18,359 --> 00:22:21,920 the preview of images, logging a registation, and we have 430 00:22:22,519 --> 00:22:26,119 temperativen form reactive forms. So whatever. I so these two 431 00:22:26,119 --> 00:22:30,119 applications blogging application, book cut application is my playground. If 432 00:22:30,279 --> 00:22:32,240 I have to learn something, I put it here. 433 00:22:32,440 --> 00:22:36,079 Speaker 1: So here so like keeps evolving and growing as you do. 434 00:22:36,640 --> 00:22:40,759 Speaker 3: Yes, exactly, yeah, exactly, So right now in a book cut, 435 00:22:40,839 --> 00:22:43,839 I'm planning to implement NGRX because I'm learning NGRX since 436 00:22:43,920 --> 00:22:46,319 last few days, few months basically, so I want to 437 00:22:46,359 --> 00:22:48,839 implement JRX over there so it might grow. 438 00:22:49,839 --> 00:22:53,359 Speaker 1: So what's the do you plan on having like a 439 00:22:53,519 --> 00:22:57,400 split of like this version within GRX, this version without 440 00:22:57,559 --> 00:22:58,640 or you just this is. 441 00:22:59,119 --> 00:23:03,799 Speaker 3: Just upgrade upgrade. It's a demo application, it's and it's 442 00:23:03,839 --> 00:23:07,119 already on GitHub freely available, so if anybody wants to 443 00:23:07,160 --> 00:23:09,640 show the previous version, they can already go to previous 444 00:23:09,640 --> 00:23:10,440 commits and see that. 445 00:23:10,680 --> 00:23:13,200 Speaker 1: I can't wait. I'm totally I'm going to start following 446 00:23:13,240 --> 00:23:13,880 you and people. 447 00:23:13,920 --> 00:23:17,680 Speaker 3: Now that's awesome, man, that that would be very awesome. 448 00:23:19,279 --> 00:23:21,319 Speaker 1: So before we get too much top topic. I think 449 00:23:21,359 --> 00:23:22,920 you said you had a couple of things you wanted 450 00:23:22,960 --> 00:23:26,240 to mention or did you already touch on them for 451 00:23:26,880 --> 00:23:30,000 back to the original application with OCR So if you 452 00:23:30,079 --> 00:23:30,319 go to. 453 00:23:30,359 --> 00:23:32,920 Speaker 3: The original application, I think I have covered most of 454 00:23:33,000 --> 00:23:36,279 the part and I would have shown it demo, but 455 00:23:36,440 --> 00:23:40,240 I think I cannot. Yeah, yeah, so that I would, 456 00:23:40,480 --> 00:23:44,960 and unfortunately I have not deployed it anywhere. Otherwise people 457 00:23:45,039 --> 00:23:47,119 could have played around. But there's some issue with the 458 00:23:47,200 --> 00:23:50,799 deployment in my as your application since the company provided 459 00:23:50,839 --> 00:23:53,119 and my company provider, so there's some limitation over there, 460 00:23:53,359 --> 00:23:55,319 so I could not be able to deploy it. But 461 00:23:55,799 --> 00:23:59,799 if you follow the steps message the application, or even 462 00:23:59,799 --> 00:24:03,119 if you just create a PI key and the endpoint 463 00:24:03,400 --> 00:24:06,119 clone my repository, put your key and run to run. 464 00:24:06,519 --> 00:24:09,519 So yeah, yeah, yeah, it's a guarantee you will not 465 00:24:09,599 --> 00:24:11,039 face any issue. It's a guarantee. 466 00:24:13,279 --> 00:24:16,039 Speaker 1: That is some big talking here. 467 00:24:17,279 --> 00:24:20,519 Speaker 2: Yes, yes, it's you will not have an issue. 468 00:24:20,599 --> 00:24:21,480 Speaker 1: I love that so much. 469 00:24:21,599 --> 00:24:23,880 Speaker 3: Yes you will. It's a guarantee I am taking. If 470 00:24:23,920 --> 00:24:25,839 you have an issue, you can post public on your 471 00:24:25,880 --> 00:24:32,279 tutor that your your app is wrong. It's a guarantee 472 00:24:33,240 --> 00:24:34,359 basically on your. 473 00:24:34,400 --> 00:24:37,519 Speaker 2: End so. 474 00:24:39,359 --> 00:24:42,880 Speaker 3: This is try and tested. So and I would say 475 00:24:42,920 --> 00:24:46,119 that as your cognitive service is awesome, so you will 476 00:24:46,359 --> 00:24:50,119 you will see some difference from your normal app. So 477 00:24:50,240 --> 00:24:52,119 I have written a lot of articles, if you see, 478 00:24:52,119 --> 00:24:54,519 I am writing for almost last three years and I 479 00:24:54,599 --> 00:24:57,440 have written a lot of articles, more than fifty five 480 00:24:57,519 --> 00:25:00,319 to sixty articles. I have written do a lot of 481 00:25:00,359 --> 00:25:04,160 different kinds of applications. But this using cognitive service is 482 00:25:04,200 --> 00:25:08,440 something different because it makes your app smart. You app 483 00:25:08,519 --> 00:25:11,960 become a smart like and it looks cool. So that that, yeah, 484 00:25:11,960 --> 00:25:14,480 it looks cool that you are doing something. You're doing 485 00:25:14,559 --> 00:25:17,799 something great. The other applications also, I am not saying 486 00:25:17,920 --> 00:25:20,680 bad about other applications like if I'm written about forms 487 00:25:21,119 --> 00:25:24,440 and then data uploading, creud operations and gr X, they're 488 00:25:24,440 --> 00:25:26,759 all great. But this is something different. 489 00:25:27,079 --> 00:25:29,279 Speaker 1: No, it is, and I I love it that you 490 00:25:29,359 --> 00:25:31,400 were just like, hey, they offered this a p I 491 00:25:31,720 --> 00:25:34,799 I need to use it, yes, And and they are. 492 00:25:35,000 --> 00:25:38,319 Speaker 3: There are a lot of different APIs, like so they 493 00:25:38,359 --> 00:25:44,640 have something called language APIs and they have Q and 494 00:25:44,720 --> 00:25:47,319 a maker. So in the ASU there's something called Q 495 00:25:47,440 --> 00:25:50,319 and a maker. So there you can set up Q 496 00:25:50,480 --> 00:25:54,200 and A for your website or something like that. Then 497 00:25:54,599 --> 00:25:57,720 text analytics analytics. So in the text analytics you can 498 00:25:57,759 --> 00:26:00,519 analyze the text what are the text for the keywords 499 00:26:00,559 --> 00:26:04,720 and entities and all. And then you have in the 500 00:26:04,799 --> 00:26:07,200 in the vision uh in the face recognition. The face 501 00:26:07,240 --> 00:26:10,119 recognition is one of the very great API where you 502 00:26:10,160 --> 00:26:13,480 can upload an image and it will recognize the face 503 00:26:13,559 --> 00:26:16,759 the location of the face, and then you can it 504 00:26:16,799 --> 00:26:18,680 will show a box around that it will look like 505 00:26:18,759 --> 00:26:21,839 a sci fi movie, so that that looks awesome. Yeah. 506 00:26:22,400 --> 00:26:27,519 So and then you have vision a p I form recognizer, 507 00:26:27,880 --> 00:26:30,160 so you you can upload a form. You can extract 508 00:26:30,200 --> 00:26:33,200 text from the form. So those a lot of API 509 00:26:33,319 --> 00:26:35,799 is provided. So I will provide a list, I will 510 00:26:35,799 --> 00:26:38,880 provide the link, can put in the notes and people 511 00:26:38,960 --> 00:26:41,279 can go through it and see that there is an 512 00:26:41,359 --> 00:26:45,640 extensive document provided by Microsoft and and and and the 513 00:26:46,119 --> 00:26:48,640 best part about this is this is all going on 514 00:26:48,799 --> 00:26:50,839 back end. So all the a p I you you 515 00:26:51,119 --> 00:26:54,079 so that I would say that three te architecture one 516 00:26:54,160 --> 00:26:56,880 is on the cloud where which do all the heavy lifting. 517 00:26:57,160 --> 00:26:59,000 You create the a p I get the key and 518 00:26:59,160 --> 00:27:01,880 then you have a middlewere part of the thing. So 519 00:27:02,079 --> 00:27:05,279 where like services in my case it is ESP dot 520 00:27:05,359 --> 00:27:08,160 net code and the UI. You can use anything. Your 521 00:27:08,200 --> 00:27:10,920 free to use any UI. So I am using Angler 522 00:27:11,000 --> 00:27:13,480 and Blazer. So I have few applications on Blazer also 523 00:27:13,599 --> 00:27:16,359 and Angler also, so I am working Palel on both 524 00:27:16,400 --> 00:27:18,279 of them. You can use other also, you can use Plain, 525 00:27:18,359 --> 00:27:21,119 Javaz view, you can use React, whatever you want to use. 526 00:27:21,319 --> 00:27:23,880 Speaker 1: So I saw, I saw you wrote a book on Blazer. 527 00:27:24,240 --> 00:27:26,519 Speaker 3: Yeah, and the funny part is that is the first 528 00:27:26,640 --> 00:27:28,240 ever book in the world on Blazer. 529 00:27:29,279 --> 00:27:33,160 Speaker 1: Oh my, well it didn't like just drop like officially. 530 00:27:33,559 --> 00:27:36,319 Speaker 3: It was dropped officially, but when I wrote the book, 531 00:27:36,440 --> 00:27:37,920 it was still in preview. 532 00:27:38,160 --> 00:27:41,880 Speaker 1: Nice. That's awesome. 533 00:27:42,720 --> 00:27:44,480 Speaker 3: What is that? Yes? 534 00:27:44,680 --> 00:27:45,480 Speaker 1: On Amazon? 535 00:27:45,680 --> 00:27:49,119 Speaker 3: What is that on? Yeah, it's on Amazon, so yeah. 536 00:27:49,000 --> 00:27:51,440 Speaker 1: The front door of course it's on Amazon. 537 00:27:52,000 --> 00:27:55,839 Speaker 3: Yeah. And recently I have published another book on sha 538 00:27:56,599 --> 00:28:00,480 where I have co authored with Raphael and Marius were 539 00:28:00,519 --> 00:28:04,039 also Microsoft MVPs. So this is published recent seat. It 540 00:28:04,039 --> 00:28:06,880 was a complete Sea Sharp guide from beginners to advanced level. 541 00:28:07,119 --> 00:28:10,720 Speaker 1: That is awesome. I actually have a friend and coworker 542 00:28:10,799 --> 00:28:13,759 who is an advocate for Blazer here at kend of U. 543 00:28:13,799 --> 00:28:15,359 I might have took you two up because that's. 544 00:28:15,559 --> 00:28:20,599 Speaker 3: Yeah, yeah, yeah, sure, sure, Actually I am more into 545 00:28:20,680 --> 00:28:25,079 the UI. That's why I pick Blazer easily and so earlier. 546 00:28:25,119 --> 00:28:27,200 I used to work as a dot net developer almost 547 00:28:27,240 --> 00:28:29,119 when I started my career. The dot net developed almost 548 00:28:29,160 --> 00:28:32,839 six years back. And Blazer uses sea sharp as a language, 549 00:28:33,039 --> 00:28:36,319 so it was natural to me. And then I moved 550 00:28:36,319 --> 00:28:41,160 to Angler because the demand in the market. It's simple. Yeah, 551 00:28:41,640 --> 00:28:44,119 Blazer is still in a development phase, so that is fine. 552 00:28:44,119 --> 00:28:45,920 We had let's not go discuss what the Blazer. But 553 00:28:46,319 --> 00:28:51,359 Angler is awesome. Yeah, so I Angler gives me food. 554 00:28:51,359 --> 00:28:52,119 That's why it's awesome. 555 00:28:53,480 --> 00:28:55,359 Speaker 1: How long ago did you start using Angular? 556 00:28:55,839 --> 00:28:58,640 Speaker 3: Almost three years? Little less than three years? Yeah, I 557 00:28:58,720 --> 00:28:59,720 started from Angler four. 558 00:29:00,000 --> 00:29:03,359 Speaker 1: Okay, oh that's nice. You didn't have the one that 559 00:29:03,440 --> 00:29:11,519 to swap. Well, this has been such a fun show 560 00:29:11,640 --> 00:29:14,839 and I really am amazed. If you write a book next, 561 00:29:14,920 --> 00:29:17,240 could it please be about how I do so much 562 00:29:17,279 --> 00:29:20,039 with my life and how you can stop wasting yours 563 00:29:20,119 --> 00:29:22,880 like that? I think it's the title needs work, but 564 00:29:23,200 --> 00:29:24,039 I think. 565 00:29:27,240 --> 00:29:31,640 Speaker 2: Yeah, but no, is there. 566 00:29:31,640 --> 00:29:35,559 Speaker 1: Anything outside of ocr app that you want to talk 567 00:29:35,640 --> 00:29:36,480 about before we get to. 568 00:29:36,519 --> 00:29:39,039 Speaker 3: Picks outside the If you if you look into the 569 00:29:39,039 --> 00:29:42,880 same cognitive services, I have created a translate text cognitive 570 00:29:42,880 --> 00:29:46,759 service also, so there's another So there's another link I 571 00:29:46,839 --> 00:29:48,960 can share you. I am not sure if it is 572 00:29:49,039 --> 00:29:51,799 published on a free code camp, but it is published 573 00:29:51,839 --> 00:29:56,119 on my website or not my website in the medium 574 00:29:56,319 --> 00:29:59,960 in the front medium you know Ango in the website. 575 00:30:00,279 --> 00:30:03,839 Angler in Depth is there on medium, right, So yeah, 576 00:30:04,079 --> 00:30:06,880 there is a publication medium that is called Angler in Depth. 577 00:30:07,200 --> 00:30:09,680 So I have created a I have written an article 578 00:30:09,759 --> 00:30:13,279 or that how to create a multi language translator using 579 00:30:13,319 --> 00:30:16,319 Angler and as your cognitive service. So it's a it's 580 00:30:16,400 --> 00:30:20,279 similar to Google Translate. And if if you I have 581 00:30:20,440 --> 00:30:22,279 bring you the link in the chat, if you open 582 00:30:22,319 --> 00:30:24,359 and again go to bottom, you can see that awesome 583 00:30:24,400 --> 00:30:27,839 gift and there so so there you can see that 584 00:30:28,039 --> 00:30:31,079 you can write. You can translate from any language language 585 00:30:32,160 --> 00:30:35,240 I think almost twenty five twenty six language, sixty language 586 00:30:35,279 --> 00:30:40,119 ORRY sixty languages supported by translated API, so you can 587 00:30:40,200 --> 00:30:43,359 translate from sixty languages to and fro to and fro 588 00:30:43,480 --> 00:30:47,240 from sixty languages. So again, the architecture and the structure 589 00:30:47,279 --> 00:30:50,079 of this app is same to that of ocr app. 590 00:30:50,440 --> 00:30:53,440 Everything is same. I created an API, rite the middle 591 00:30:53,519 --> 00:30:55,960 layer and then put a UI to make the app 592 00:30:55,960 --> 00:30:59,279 beautiful and I'm passing. I'm calling the API through service calls. 593 00:30:59,599 --> 00:31:03,119 These are too, which I have explored till now. I'm 594 00:31:03,160 --> 00:31:05,960 planning to explore the Fierce API next because that looks 595 00:31:06,000 --> 00:31:06,440 cool to me. 596 00:31:06,839 --> 00:31:10,079 Speaker 4: Yeah, I saw the face can detect emotion, which is 597 00:31:10,200 --> 00:31:16,119 kind of cool. Yeah, like if you're angry, yeah, anger, contempt, 598 00:31:16,759 --> 00:31:20,599 discuss fear, happiness, neutral sadness, and surprise. 599 00:31:21,200 --> 00:31:23,519 Speaker 2: I don't think gives you like a rating on each one. 600 00:31:23,400 --> 00:31:25,880 Speaker 1: Because I know humans who can't detect those. 601 00:31:26,200 --> 00:31:29,000 Speaker 2: I was going to say contempt and anger. That's like 602 00:31:29,400 --> 00:31:35,400 legs similar. I think I could use that day today. 603 00:31:35,599 --> 00:31:39,319 I mean, I know both are probably someone's. Yeah. 604 00:31:39,400 --> 00:31:42,960 Speaker 4: Anyways, so that's cool. That's definitely a it'd be fun 605 00:31:43,000 --> 00:31:44,319 to play around with for sure. 606 00:31:44,519 --> 00:31:47,000 Speaker 3: As though as awesome, like if you play on the 607 00:31:47,079 --> 00:31:48,799 quality service it is, it is great. 608 00:31:49,240 --> 00:31:51,480 Speaker 1: I'm making sure these links make it in the show. 609 00:31:52,160 --> 00:31:54,799 Speaker 2: I got the face one awesome. 610 00:31:55,480 --> 00:31:58,319 Speaker 1: Perfect. Well, thank you so much for coming on the 611 00:31:58,400 --> 00:32:04,799 show today. And again, what is your Twitter handles slash 612 00:32:05,000 --> 00:32:08,160 GitHub so people can find your user name and follow you. 613 00:32:08,440 --> 00:32:13,000 Speaker 3: Okay, so my Twitter handle is Ankie Shearma under scot 614 00:32:13,119 --> 00:32:17,119 zero zeo seven and my GitHub is unki sarma hyphen 615 00:32:17,240 --> 00:32:20,799 zu seven. So the reason Twitter does not contain hyphen 616 00:32:20,960 --> 00:32:23,039 is because it doesn't allow highun so. 617 00:32:25,440 --> 00:32:28,000 Speaker 1: Worse, you have like a user name and then it's 618 00:32:28,079 --> 00:32:32,319 like nope, yes. 619 00:32:33,799 --> 00:32:36,000 Speaker 3: Yeah so this this is? Uh, this is. And also 620 00:32:36,039 --> 00:32:39,359 I have a blog, personal blog Nki Shelma blogs dot com. 621 00:32:39,559 --> 00:32:43,599 So there I write continuously, and there is a free 622 00:32:43,759 --> 00:32:46,960 ebook I have published, so I can I can share 623 00:32:47,000 --> 00:32:50,599 you the link. Also, I will just mention a brief 624 00:32:50,640 --> 00:32:53,240 description about the app. So you just talked about that 625 00:32:53,359 --> 00:32:56,759 blogging application, right, So I have written a free ebook. 626 00:32:56,759 --> 00:32:59,640 It's almost hundred pages where I have explained how to 627 00:33:00,160 --> 00:33:04,240 create this blogging application using Angler and firebas from scratch. 628 00:33:04,920 --> 00:33:07,680 So this book is just a by step guide where 629 00:33:07,720 --> 00:33:10,079 you can learn how to use Firebase with an Angler application. 630 00:33:10,599 --> 00:33:13,440 Speaker 1: Oh I love that you said your GD Are you 631 00:33:13,839 --> 00:33:15,440 both fire based and Angular? No? 632 00:33:15,559 --> 00:33:16,200 Speaker 3: Only Angler? 633 00:33:16,519 --> 00:33:21,759 Speaker 1: Okay, I mean we can fix that. We need to 634 00:33:22,079 --> 00:33:23,880 talk to the fire Based team because you've got like, 635 00:33:24,119 --> 00:33:26,359 I don't know, twenty demos using Firebase. 636 00:33:26,599 --> 00:33:28,559 Speaker 3: Yeah, I would love that. 637 00:33:30,960 --> 00:33:34,960 Speaker 1: So okay, I think we are ready for picks, although 638 00:33:35,000 --> 00:33:38,079 I'm pickless today. So Brooks, hopefully you can pick up 639 00:33:38,519 --> 00:33:43,160 Jeez where I am totally dropping said ball. I was. 640 00:33:44,000 --> 00:33:47,039 Speaker 4: I'm kind of pickless, but I just wanted to stand 641 00:33:47,079 --> 00:33:49,240 on my soapbox for a second and say, if you're 642 00:33:49,279 --> 00:33:53,839 wearing a mask, cover your nose and your mouth, because 643 00:33:53,839 --> 00:33:57,200 if you don't cover your nose, one, you look weird 644 00:33:57,240 --> 00:33:59,519 as all get out, Like your nose looks like ten 645 00:33:59,559 --> 00:34:05,359 times and two, it's not really doing anything. Last week's 646 00:34:05,400 --> 00:34:08,320 pick for me was wearing crocs with socks, So like 647 00:34:08,519 --> 00:34:11,079 me saying, you look weird. 648 00:34:12,320 --> 00:34:14,320 Speaker 2: Your nose sticking out, that's something. 649 00:34:15,000 --> 00:34:18,800 Speaker 1: Yeah, it gets me when I'm like driving and I 650 00:34:18,920 --> 00:34:23,719 see like other people driving alone wearing masks. 651 00:34:23,880 --> 00:34:28,159 Speaker 2: That's weird too, That's weird. That's creepy. Guys. You can 652 00:34:28,239 --> 00:34:30,679 breathe now, this is you're in the car, right. 653 00:34:30,760 --> 00:34:35,280 Speaker 1: I'm like, maybe they're just so comfortable they just don't 654 00:34:35,760 --> 00:34:37,760 want to take it off. I don't know. I just 655 00:34:37,840 --> 00:34:39,000 think it's bizarre. 656 00:34:41,760 --> 00:34:45,559 Speaker 2: That's my pick, covering your face and nose with a mask. 657 00:34:46,320 --> 00:34:49,360 Speaker 3: Yeah, do you use what is what the mosk is for? 658 00:34:49,880 --> 00:34:58,360 Speaker 1: I know? Okay, so yes, do you have any picks? 659 00:34:58,360 --> 00:34:59,920 They don't have to be techrelated, they can be. 660 00:35:01,519 --> 00:35:04,599 Speaker 3: I have something which I talked a lot often about 661 00:35:05,039 --> 00:35:08,639 and I I uh ask a lot of people also 662 00:35:08,760 --> 00:35:11,239 like you guys are also community contributor and not only 663 00:35:11,360 --> 00:35:16,360 you everyone. So what I say is that teach. That's it. 664 00:35:17,199 --> 00:35:19,440 So how you can teach. So let's say you know something, 665 00:35:19,679 --> 00:35:22,440 it doesn't matter what you know. You know something, you 666 00:35:22,599 --> 00:35:25,199 teach to your junior. So if you are a developer, 667 00:35:25,360 --> 00:35:27,599 teach your junior about development. If you're a tester, you 668 00:35:27,639 --> 00:35:30,280 teach your test testing. You know your testing. If you 669 00:35:30,320 --> 00:35:33,559 are marketing guy, if you're a salesperson, whatever, you not 670 00:35:33,719 --> 00:35:36,400 teach your juniors. The reason for I'm the reason I 671 00:35:36,480 --> 00:35:39,440 am saying this is that you can learn more from 672 00:35:39,519 --> 00:35:43,119 your peers than from your schoolar colleges. And this is 673 00:35:43,239 --> 00:35:45,920 not only in this is mostly in my country, but 674 00:35:46,000 --> 00:35:48,400 I think this holds too everywhere in the world. So 675 00:35:48,639 --> 00:35:50,880 I just want to say to everyone, just teach, splait 676 00:35:50,960 --> 00:35:53,679 the knowledge. But that is one of my motive behind 677 00:35:53,760 --> 00:35:56,400 doing all this community work. So like, spread the knowledge, 678 00:35:56,480 --> 00:35:59,519 whatever you know, whatever you know, just teacher, that is 679 00:35:59,519 --> 00:36:00,320 what I'm saying. Teach. 680 00:36:00,840 --> 00:36:02,199 Speaker 1: That's beautiful. I love it. 681 00:36:02,960 --> 00:36:03,480 Speaker 2: That's great. 682 00:36:03,679 --> 00:36:06,960 Speaker 1: Thank you, Thank you so much for coming on this 683 00:36:07,039 --> 00:36:10,599 show today. You were a absolute wonderful guest. 684 00:36:11,199 --> 00:36:14,320 Speaker 3: Thank you, thank you. I would love to thank you 685 00:36:14,400 --> 00:36:17,480 guys also for inviting me. And this was a great session. 686 00:36:17,679 --> 00:36:21,079 I like talking to Like I talked through an article 687 00:36:21,159 --> 00:36:23,159 without sharing anything, without showing anything. 688 00:36:23,639 --> 00:36:27,360 Speaker 1: I know, it's very weird. It's hard sometimes because people 689 00:36:27,519 --> 00:36:30,039 are like and I show this code, and I'm like, 690 00:36:30,159 --> 00:36:33,599 well could but no one would see it. So it's 691 00:36:33,679 --> 00:36:37,840 always really interesting to see people teach through code concepts 692 00:36:37,960 --> 00:36:44,280 or angular you know, without visuals. So oh awesome. Well, 693 00:36:44,360 --> 00:36:47,039 thank you so much. Everyone has a marvelous day and 694 00:36:47,199 --> 00:36:48,360 we'll see you on the next one. 695 00:36:48,960 --> 00:36:51,880 Speaker 3: Yeah, thank you, thank you, thank you. Luke By