Software Engineer Product Development
Harman Connected ServicesAssociate Engineer Product Development
Harman Connected ServicesIntern
Harman Connected ServicesJavascript
Java
Angular
SVN
SonarQube
REST API
PostgreSQL
Node.js
MongoDB
Jenkins
Docker
HTML, CSS and JavaScript
Bootstrap
Yes. My name is Abhinav Sathute, and, uh, I have done my bachelor's in computer science, then master's in computer science. Uh, from there, I got elected as an intern in Armand Connected Services. So after 10 months of internship, I have continued in the same company, uh, as an employee. So I have total around 5.11 years of experience. Uh, in, like, Around 6 years of experience, I have worked, uh, on, uh, Angular. And, uh, like, uh, I I have about 4.5 years of experience in Angular. And, uh, few years, I have worked on, uh, Java as well. Yeah. That's the my, uh, technology stack, uh, in my
Yeah. So, uh, for code review process, uh, we are following, uh, SonarQ. So first, there will be, so now link install in the ID, then, uh, we are performing the, uh, code reviews on uh, also not queue, uh, on the server. And then, uh, before, like, uh, committing, we are having a manual code review session, uh, and that's it. And for unit testing, uh, for unit testing, we are using Jasmine and Karma framework uh, in which we are testing the services in which, uh, we are testing API responses and uh, how it is handled in the code and component testing and then and then, uh, component testing will like this. And, uh, yeah. Thank you.
Yeah. So, uh, for consistency, I'll use the same libraries for On the project, like, uh, like, Bootstrap, I will I will, uh, do the configuration in the, uh, app model dot ts. There, uh, I will, uh, so there will be, like, header and a sidebar that will be common for every page, and Only internal things will be different, like, uh, so I will create few, uh, components like buttons and, Uh, which will be, like, cards, which will be reusable in every component and every, uh, HTML template. So I'll use the same things in every HTML template, uh, with the, like, uh, different colors and all. So that Today, I'll, uh, maintain a consistent UI across all of the browsers. Okay.
Uh
So for the, uh, backend integration, We we, uh, I'll use the, uh, HTTP client with the REST APIs. And, uh, using observable, I'll manage that. I can manage that very well-being using pipes and all. So, uh, it will be faster to transform data and, uh, to get it. And, also, if there is a WebSocket, then also, uh, I'll use the Uh, with that, uh, I'll able to, uh, get the stream of data. And, Yeah. I'll provide the, uh, exact JSON format which I needed to the back end too. And, uh, if there is a slight change in the JSON format, then I can, uh
Yeah. If for, like, the state is, uh, changed and then also UI is not getting updated. Uh, first, I'll check the I'll use the console and the, uh, network and Inspect elements tab from the browser using browser development tools. There I will check if, uh, there is any, uh, issue or something. So, uh, if there is not issue, then I'll, uh, look into the code. Uh, like, uh, if the state is changing, then why it is not updating in the
Yeah. And here I can see the observable is subscribed, But, uh, it is not unsubscribed. Okay? So, uh, we need to, Scribe the observable, uh, printing, uh, cubes of, uh, the, uh, observable is completed. So I'll suggest to unsubscribe the subsurface available value changes on the, uh
Okay. So here, uh, in the template, we are, uh, printing the message, using string interpolation. And, uh, like, uh, we have, uh, provided the style URL as a style sheet app component of CSS. And in the component, we have, uh, defined a string and, uh, like, n g on in it. So n g on in it will get triggered, and that a big component, uh, we get, uh, initiated. So, uh, on load of that, On the initialization of that component, engine will get executed. So this start message equal to hello. So Uh, we are using string interpolation for the message to show in the, uh, UI. So, uh, this is this will be like Uh, open paid data winding from, uh, component to view. So this will be a bit reflected in the, uh, template.
Yeah. So in, uh, Angular, uh, we have the complete architecture is Ready? Okay. So in React, just, uh, we are dependent, uh, I'm dependent on other other libraries I need to use with the React. Instead of that in angular, uh, I have used the RX Chase and the NJRX. Okay. And, Uh, it I also, basically, NJX is dependent on the, like, uh, not dependent, but it's the implementation of this, uh, redux So in Angular, we have observables and, uh, promises as well. So and Component models. That structure is already defined in Angular. So that's why, like, Angular is, uh, We have, like, a we had a problem with the, uh, large dataset, uh, to managing states and all. So we have included NGRX in the project. So that way, we have, uh, solved the complex problem of, uh, our Angular application, uh
So, like, the code reusability, uh, reusability is when we create up components, like, uh, like, we have to maintain a a color, shape, and, uh, styling part of any component. Like, uh, for example, uh, any widgets like cards or buttons, uh, or links, like sidebar and uh, Nava, like that. So those will be, uh, we already we'll already create those things and will uh, where we use those components in, uh, whenever we need, uh, that button and, uh, widgets or cards. Uh, so by that, we'll, uh, and, uh, also, like, uh, we'll use those components, uh, in every page. Uh, so by that way, we can use them for, like, services also. Uh, there are for 1 API request is required on 1st page and second page uh, on different pages and, like, on different different components then we'll use the same service. Okay. Uh, so that way we can reuse the code for the service as well as component. So that's uh, the benefit of using Angular and to block JS frameworks.