Skilled Web Developer with 3+ years of experience in creating robust web applications using a
diverse skill set including HTML5, CSS3, JavaScript, React, TypeScript, Rest APIs, and more. I have
a proven track record of improving user engagement through responsive design and optimized
performance. I am adept at collaborating with UI/UX designers to enhance user experience and
have a history of delivering high-quality solutions on time. My commitment to continuous learning
ensures that I stay updated with industry advancements, making me an asset to any team.
Senior Web Developer
Tecnotree CorporationIntern
M/s Nuberg Engineering LimitedHTML5
CSS3
React
TypeScript
Rest APIs
Redux
Material-UI
API
Could you help me understand more about the background by giving you a brief introduction of yourself? Oh, yes. So myself, I am a, like, front end developer in the, uh, technology corporation, and I had worked I'm working as a front end developer Uh, front end developer majorly on the front end part and also works on the, like, uh, backend project also by using the Node. Js. And, uh, my, uh, my current domain is, like, on the React framework part. I used to work on the JavaScript React framework and, uh, Redux applications and, uh, integration of the old RESTful APIs and also works on the, like, uh, c press, uh, c press and the GraphQL APIs integration as well. And, uh, also had worked on the, uh, building of the robust application, and, uh, and that decreases, like, a page load time of the application. And also, uh, and also worked on the, like, more on the, uh, JavaScript component, uh, and use the, uh, reusable component in each of my features and the bugs which I had worked on. And, also, I'm great at the, like, coding and debugging skills. Like, we used to get defects and bugs, which, like, which on the complex, easy, and the moderate level. And with that understanding, we used to debug it accordingly, how much is the complexity of the defects. And, uh, by this, we can get more graphs on the coding and the debugging part. And, uh, like, uh, our daily our daily, uh, task is to get like, in the weekly scrum, we used to get, like, 2 weekly features per week per scrum, and the scrum over continues for the 2 weeks. And, uh, like, we like, I mostly logged logged on the features, like, component features, which includes, like, um, telecommunication communication domain, which involves, like, uh, like, uh, VAS, like, how we can change over one plan from another plan, how we can put our SIM, how what are the plan charges which one can SIM can provide, and, uh, like, what are the benefits of the plan which we can get, and what are the new plans which are coming for the particular SIM. And I worked for the, like, MTN SIM, which is Africa based, uh, Africa based MTN SIM, which is a very popular SIM. And, uh, we used to, like, work on the like, uh, we we have worked on the like, many of the API integrations, which has increased, uh, increased the page load page, like, uh, runtime, and we can get our, like by the minimum integration of the APIs, we can we can we can make our application we had made our application very robust. And in a very limited time time framework, we can, uh, our page can load very quickly. So so this is my brief introduction of myself regarding my work. And even I had done my, uh, uh, tent from the, like, ICC board and which is which has from the various chemistry, math background. And the 12th, I have done from the, like, math background only from Gurnani School with the percentage of 88.60. And I had done my engineering from the Jharna Institute, which which comes under the Vishishore Technical University, And I had scored 7.42 s g p CGPA in my overall engineering. So, yeah, so this is my, uh, brief introduction about myself.
And if a potential botanist in a lead application where comments are on a tech. Unnecessary and how you might prevent them. Like, for the Redux, for the Redux component, we can, we can tell that, like, there are 2 types of components we'll be using. 1 Stop class component. 1 is a, functional component. So so for the Redux application, if you want to update like, suppose the data has to be updated in a particular, like, table or table or particular the UI card or anything. So we get refreshed data from the Redux, and Redux will, and we be calling the, that meaningful APIs to get the recall of the data, and we'll be updating it in the updating it in the, UI or in the table or in the cards wherever you want to, like, so in the sometimes, and sometimes, like, Redux Redux data are sometimes, like, unnecessary. The the APIs are called to fetch the data from the So we can avoid it by, like, using the conferenced mount in the, like, component mount or in the component update. So what will happen in the component mount once on only when the page loads, or when we refresh the page, so that that time only we'll be calling the, Redux, and we'll be fetching all the data And and secondly, we can call by, like, when we are updating any fields or getting any cards in the fields or updating the table. So we can, so we can call at that time by using the updated update. And, we can, fetch the data from them. So by this, we can can avoid unnecessary calling from the RedLINK application and unnecessary inputting more load on the APIs. On the 10.02.
How would you approach lazy loading? Confluence in React to improve the initial load time. So for the lazy loading, uh, for the lazy loading components, we can, uh, like, use the, uh, you can use this concept of the parent and child component. And so we'll not be keeping all the props, and we'll be con not calling all the function or the, uh, update APIs from from the, like, child component only. The parent's component will be handling all those, uh, in in in part of the child component, and we can use the prop type components to avoid the unnecessary unnecessary loading of the props and the states variables and updating of the and unnecessary updating of the state variable also. So we can use this, uh, approach, like, financial component for, uh, reducing the, uh, for for reducing the, uh, for improving the initial load time. And it it works on the concept on the that when the when the, like, a parent component loads. Uh, so with that, uh, once, uh, that child has to be also load with that parent component, and we'll be avoiding all the necessities, uh, updating and mounting of the data. So which will, uh, which will which will approach, like, a a lazy loading, like, components, like, uh, like, class components and functional components. Maybe, uh, mostly, we'll be using the functional components. Like, it will it has a more, uh, like, more prop type in the state when the handling of the prop based components and the state variable components are, like, uh, very fast in the functional component. So by this approach, we can, uh, improve the initial load time of the application.
Explain your operate approach to managing global state in React application without using it. Management library. Yes. We can use the global state in the React application. Like, we can for this, we don't require any, uh, external state management already. We can use the use state. Uh, now you you use state variable, which, uh, like, we cannot, uh, means what we can do, we can put, uh, the our variable in the this dot state, and we can, uh, with that variable with the with the state variable, we can, uh, we can use it globally at any part of the of our application of our code, and we can, uh, we can manage to update, like, everywhere where we want to update, uh, like, update the particular state variable. And simply, we have to, uh, give the this stored state, and we have to put into the into the function. And we can manage the states with the particular state with the particular distort state. And, uh, with the this approach, we can, uh, we can use our global state, uh, through all our, uh, board, uh, whether using the functional component or the class component. And this will avoid, uh, using the external, uh, management library, which is the, like, used state library. And with that, we can, uh, we can easily manage, uh, updating of the state variables. And, uh, we can use the state variable in our code accordingly.
Could you outline a strategy to manage state in the last field application? Could you outline a strategy to manage stating the large scale React application without Redux? Yes. We can, uh, we can manage without Redux as well. Uh, like, we what we need to do, like, for that particular, uh, with the help of the Redux application, we can store our data, and we can use our data all over our application, all over our code in any of the components. But without using the Redux application, we can one way is to that, we can call the particular API where we want where we want to all the fetch the data. And with that particular API, calling all the the the response data, we can use it we can use it in the particular cards of where we want to use the data, and we can we can show the data in the UI. So, uh, this is a way. Like, we can, uh, we can, uh, we cannot use Redux. And but there is one, uh, the drawback of that is that we need to call the API again and again, which will which will increase the, like, page load time, and, uh, we should not be calling the APIs. Instead of that, we use the Redux to store the large amount of data anywhere, and we can and the and the data will be kept, like, all over the time when, uh, if it it will only be changed, like, when we'll be updating or, like, some or something, the data changing with the Redux. So that time only we can update the Redux or else the data will be stored permanently in Redux, and we can use it at anytime or anywhere. So I think, uh, using the React application with the Redux is the best way.
Imagine you need to maintain a stable application state while implementing asynchronous actions. How would you proceed using reduction agents? Yeah. So we can, uh, we can manage to we can manage to make it a stable application state. We can, uh, we we can use a function, a a sync function where we can, uh, call over multiple APIs. And that API is by calling that APIs, we can perform many other functions, like fetching the data from the APIs and storing the and storing the response of that and re returning the response from the particular asynchronous functions. And, uh, this will be, uh, this as soon as function, the main benefit of that is that is it it it won't be called, like, multiple times only when the it it will only be called when the when the applicate when the, like, APS will not have given the response. So then it it will call the signal function. Otherwise, it won't be calling the necessary asynchronous functions, like, while in the React application. So this can, like, with the use of asynchronous functions, we can we can reduce, like, calling the multiple calling the APIs multiple times to, like, uh, reduce the, uh, page load time of each of the application. And, uh, as in our synchronous actions has so many, uh, like, personal action functions has so many, uh, use case. Uh, like, we can we can call our props and the state variable also inside that. And the functions and and we can give the condition, and only the function will be called, like, when the, uh, like, when the particular, uh, button has to be pressed or when some actions has to be happened from the UI. So with this, uh, a single function, we can, uh, perform, and we can perform this as well.
Need for some company. Please identify and explain the issue with the base account as being used inside set, demo, callback. Okay. So what does a use effect will do when the company when the company will will mount? They here, they have written 1 state variable, which is a set counter. So when the company will get mount, this set, uh, the timer will be the timer will be set for 1,000 milliseconds. And in that timer, in in the in the 1,000 milliseconds of frame, we'll be setting the count with with plus 1. Like, if suppose the account is is gonna starting with the initial value as a 0, so each each 1,000 millisecond will be will be increasing the count value 2 +1. So next time when when the when the counter will will be get when the user fed will be get called will be the counter will become 1, and that will be returning the counter variable. And similarly, uh, so each time when the page loads, we'll be calling the counter for the 1,000, and this this will be run for 1,000 milliseconds. Yeah. So this is a, uh, conclusion inside the, uh, conclusion of this counter component function.
Someone just called somebody for setting up a Redux function and reducer. Redux action reducer can spot an issue with the action payload? And if so, how much this affect the application setup is? Yes. Here, uh, the one issue can be found in the action payload. Content. Item content. Like, the issue here, I can found is that in the, um, in the, like, in the payload of the actions we are submitting as in, like, we are giving only the item content, but here in the reducer, like, we are, uh, we are updating the state as well, and we are sent when we are, of course, sending the action, um, with the, uh, payload payload and, uh, action payload item as well. So I think this is a issue which I can found in this.
How do you ensure good quality code and maintain everyone currently working with Git feature branches in a team. Yeah. We can ensure the good quality good quality code by giving the like, in the in the grid, we have the features to review the code. And and the code reviews has been done by the senior developers, and they can give the reviews. And we can, uh, we can work on that feedback, and we can we can we can write a good quote. And, uh, while while while we are merging the code, we should run the word ESLint and the ESLint errors, which will ensures that repetition of code or repetition of the function or repetition of the any conditional statements, which, uh, ESLint will, uh, will show in the in the Git Git driver only. And with that, uh, it it will show as an issue or as in bug, so we can resolve there in the Git only. And, uh, one one more good quality code features is to, like, uh, work on the sonar issues. Sonar issues which can, uh, which can we which Git can tell you that it has, uh, sonar, uh, sonar issues, and it it can tell the particular functions or where the scenario is existing. And we can fix that scenario issues, and we can with this, we can maintain our, like, very good quality code. And with this good quality code, we can we can pass the we can we can pass this over good quality code through the, uh, with the build in the Jenkins. And the Jenkins can test, like, uh, build is a build is compatible with for the application or not. It will test the SONAR and ASLINT error as well. So with that, we can we if if the code will get passed through the both the gates, both the SONAR and the ASN case, so, uh, with that with with that, we can see that the application has a good quality code.
Mentioned advanced JavaScript computer improved their coding practices and provide the, uh, example. Uh, like, I had worked on the for the advanced concept. I had worked on the, like, uh, mostly on the, uh, like, material UI components and also on the RGSF, uh, component, card component, uh, RGSF registry as well. So these are the, like, very advanced JavaScript concept. And, uh, with the help of this, uh, RGSF component and the and the, like, RJF with RGSF registry, we can we can maintain our, uh, like, data from the schema. And one example I can provide that I had worked on one particular cards, uh, and particular cards, which is, like, dynamically from the, like, schema based. Like, we are writing the all those fields dependent dependencies and the properties of that particular card or the particular table from the schema. And in the in the in the UI, in the, like, front end part, we call that particular, uh, schema, uh, UI schema, and we can fetch all the data. And with that particular data, we can we can show the particular card or, uh, particular card or the particular table in the UI. So in this what the RGSF card will do, our g s RGSF component, what it will do, so it will, like, call the particular APS APS for the particular data, which is, uh, particular API API call, which is which will be doing it from the schema piece. And that and that, although responses, the r g s will help in the, like, uh, mapping the fields with the particular response of the particular API. So with this, uh, so with this, we can make our card very robust and dynamic. And if you want to make any changes in the future for the particular card, we can directly make chain make change make change in the schema. So with that particular thing, we can our agents of company will handle accordingly. So no no need to always change the code with the with the, like, schema based applications of the account.
Uh, have you used Ajax in the connection with React to optimize, uh, user experience? Uh, no. I have not used, uh, HX with the React, um, application. So I won't be able to answer this question because I need to go through that with particular like, for the, uh, for for giving the answer to this question.