Nihal jain

So, basically, I am a graduating person and completed my graduation from University. And, uh, usually, I start working as a development developer. And, uh, I was working in, uh, Utica Private Limited at that time. And I switched my company. I was working in, uh, they put so where I got opportunity to work on Android. And also I'm holding the experience of Android. I completed my training from, uh, Hyderabad, and, uh, there's a institute. Name is. So that, uh, in the same company, I switched my domain from Android Development to the. So where I found the Shopify app, And from that day to till now, I'm working in Shopify developer for this computer 14 working on it. And, uh, currently, I'm working in a suture. And here is a product based brand, and, uh, we are selling, uh, men's, women's selection products. And, uh, if we are talking to the sorters, the suture is a clothing brand, which is totally based on Switzerland. And we are having a back office in Bangalore, and we are manufacturing a product from is in, uh, Tamil Nadu, so where we are having a factory. So we we are manufacturing in India and handling office from the Bangalore, but we are selling in Switzerland. So this is, uh, about my Shopify journey. Before this, I'm working in the service agency. So in the service business, I almost complete the 11th project in a year. And, uh, that experience, I'm the one who's holding my experience to pass on to the product companies. So this is about me and my social journey still is going on. And, uh, recently, I just complete one more project on a headless development where I was working on a storefront API and a new API. So that, uh, we are having a front end in the next years. And, uh, we just be able to private app with that. We are getting all the data of the schools, like the customer, a smart channel. That's all the data. We're pulling in a form of the APIs, and we are showing them in, uh, name. So right now, I was working on that.

Explain the process of integrating a third party JavaScript in Azure Piping while loading conflict with the system script. Okay. So integrating a third party library in a JavaScript, we are having a 2 approaches. 1st, we can use with the help of the CDN. 2nd, we can, uh, add on the JavaScript, uh, you know, open format. If you talk about that font, if you want to open the font, we can just upload the font, then I'll do the work file and get offline already the file and upload any software back in. But if you want to add on the CDN also a bootstrap, so like this, we are having a catalog or a slider CDN Right? We are displacing on the bottom of the screen. So the bottom of the theme dot liquid file. So we'll be arriving a CDN file so that we can easily use the JavaScript without encrypting other JavaScript which we are having a theme. Also, if you don't the CSS that we are using are important and, uh, and the the particular property which we are using.

So for making a text call in a Shopify theme, we are using it for the part API. Like, uh, if anyone the users wants to add on a cross sell and upsell things in a card. For that, we are using in the card property. These are concerned that not the duplicate product must be added in a card. If I'm attaching a 1 product, then another products. So we have to take care of it. And the sensitive information somehow, like the, uh, pricing of the particular variant or the user's login and all, So it depend on the customer sorry. It totally depend on the client that they want the user login or not. So if the user is logged in, so the basic information we are taking, the user is their phone number or mail ID. And mail ID is the primary part in the Shopify. So these are the sensitive, uh, information that we have to take care in the time the agents call. And, uh, this is the thing we are using.

To minimize the bundle side and improve the load down of the website, we have to take care of the, uh, speed of dimension of the website. So we have to take care of the 5, 6 norms in our website, like how many numbers of sections we are using on our homepage so that, uh, it must be as for the Shopify standard, We can use max 8 to 9 section on home page. And, uh, we have to take care how many sliders we are using on our home page. Like, on the slider, test to be the slider, AV sliders. Also, we are presenting that, uh, lookbook section as well. So as minimum sliders we are all using in a home kit, that this, uh, website speed also get optimized. And, uh, we are using 3 or 4 sliders to be able to take care of who, like, we are using async or the 4. So that the loading speed of the website must be depending on the section on which the user is on. It's not composite. We have to load the entire page. So for that, I am using a loading. Uh, for that, I am using a lazy loader either, or I can go with the async and defer approach. And with more time to increase the speed, we have to optimize the image size. Like, if I'm using a image of more than a 10 and 20 MB, then also it will definitely slow down the speed of the website. And, uh, if I'm using a mobile phone, so it's totally depending on our mobile cellular network, which we are using it. If you are talking to the Wi Fi, so it will increase that, uh, Internet speed. So we have to take care of the all the things. And other than this, uh, the bundle size that take care that how many product we are adding in a particular bundle. Also, to improve the speed, there's a we have to take care of the DOM size JavaScript. So for that, we have to optimize a particular DOM or the particular section on which we are focusing. And, uh, we have to take care of the 4 way vital so that, uh, the report will not get failed. Also, we have to if we have to pass it forward right now, So website ID must be less than a 4 second. So then we have to pass this report.

Okay. Step, you have to take care, uh, at the time of when you have to convert the certificate. Static destination is a template in dynamic. It should be by template. First of all, we can create the entire file as it did that we want. Initially, we will initialize the CSS file first. Then after we are, uh, writing down the HTML body, then after the last time, I'm adding a JavaScript file. And in that, in the bottom, I am adding a schema. Under the schema, I am adding a preset. So, uh, for each and every preset, I am adding a blocks and column. If you talk about, I need the image picker. So in particular section where I am implementing that image picker in a Shopify, that I am placing that under a div a div, I am just passing the value that a image or the sorry. The section dot the blocks dot image picker, and then I end up calling that image picker in my schema section so that I can make each and everything dynamic. Also, uh, I have to if I have to add on a text as well, so I'm using a heading test. Also, I have to give the property of the particular section. Like, is it a text format or a speech format? So for making all the things dynamic, I have to take care of this, uh, prototype, and I have to give a value that's what they are. And all the values must be unique. We cannot repeat the naming of the value same as for the label section. So, like, I'm using a 3 image because I am using a image 1, I n g 1, I n g 2, I n g 3. That differentiate the image picker from the all the images.

How do you approach setting up for catching strategies for the Shopify store phone that tells the performance with up to date content. So for approach for setting the catching strategies, like, I'm, uh, using the, Okay. I'm the help of JavaScript, I am using the caches and cookies of the browser so that it will help me out to auto fill all the information in our payment page, uh, where we are having a checkout. Also, we are having option to add on the shipping address so that it will help us to auto fill all the information. Also, if I'm having a browser catches a access so that I can take care of all the things, like, if a user is logged into our website, So you guys don't have to type their password in. Also, I am having a a data of the parts, whatever they are doing, I have to put in their cart. So for that, I'm using gadget. And with the storefront API, I have to take care of all the things that we are giving input from the user and as well. For that, I'm using the graph query so that I can take an input, like, if your user is adding that product in a car. So I have to show them this content. So that is a run time process that we have to take care of it. That I'm using that for balancing the performance with the upload. So whatever the offer I'm running on a website on announcement bar anywhere so that I can tackle the user. And also that the catches and cookies, I will take care of the IP address of the particular user so that how much, uh, things that the the user how he's doing through the entire website. I will take care of that, and I have to show them all. So, also, for that, uh, that abandoned cart things will help me out to find it out the user, uh, purchasing which products or not. And if, uh, he's not purchasing, he's just hiding in a cart so that I will retarget that user again from the mail or any of the social media on video for media actions.

With the JavaScript code, we enforce what we it's supposed to be a bit that card from the team is being on the page. But card comedy is not updated. What is the shape? The reason that card quantity is not increasing because we are not selecting a variant as well. Only here, we are selecting only the selector whatever we are having on the product because in this product, we are also having a variant. So that we have to call the variant as well. So once the variant is selected with the card quantity, so that variant one will also increase. So that the card one will work. Otherwise, it's a error. It will should have it will throw the item.

You forget to add on the column after the button over. I'm adding the hover property. I have to, uh, add on the 2 columns so that the hover property will go through. We have to add on the on hover effect. Also, for me to add on, I enter file with the hover tag. So if I'm adding the dot button, uh, dot a or anchor, we have to add on in the hover.

What a flow you do. Take to integrate a headless CMS with the Shopify team while maintaining SEO and performance. The code, they have to take care of the time, the headless element. First of all, I have to take care of the which headless are which we are going to, uh, select it. Like, right now, I was working on one project. We are we are having a headless approach for the Next. Js project. So they are having entire team on Next. Js. But for a back end, I'm using the Shopify. So I'm take care of the all the products in the Shopify backend so that we can easily manage the SEO part or the other pages section that we are taking from the Next. Js. And, uh, the CMS which we're using, that is totally dependent on that input. I mean, for the SEO performance, for the number of pages, we have to use the Google console for that if we are having the team in not in a Shopify, but in a other platform. Or we are hosting on the other platform so that we could take care of the Google console. Google search console will help us out to integrate the all the pages with the different different navigation file. Also, we have to take care of the keywords and the time which are listed on a Google ranking. So that it will work fine. And, uh, accessing accessing the data, so we are using a storefront API.

You organize the product information on a softwares to to maximize the SEO and the user engagement. So I will take care of for example, if I'm having a headphone basic number I'm giving. I'm selling a headphone on a website. So I will take care of the basic norms, the primary things that the user is focusing on. So I will divide into the small small keyboards that the main thing we we're focusing on a headphone thing, like, uh, how much weight of the headphone, look and feel of the headphones, And, uh, what is the specialty we are having, like, noise cancellations, sound quality, uh, number of hours we are running it without charging, compatibility with all the devices that we have to take care of. We are not putting all the things under our description. At the main keyword, we are pointing out below the price tag. And, also, the basic approach we are taking from the competitors, like, how they are showing their product details, how they are showing the content, and also we have to take care, like, what is our target audience. So as for the audience, we have to write down the content. It's not about, like, if we are having a sense, the audience are writing a content must take care of the audience which we're having on the website. As for the audience, we're writing a content and also we have to take care of the keywords which we are having here. High rated keyword, we have to purchase it and integrate with the content itself. So that, uh, SEO points also gain increases and engagement we have

The static sections, performance, the Shopify team that, uh, we have to take care of it, like, uh, the page optimization. What is the name of that page? Particular page, we have to take care of it. We have to mention an SEO part in the shopping page. Under that, we are having SEO listing. So that we are using a proper breakdown to show that page or not. Also, it doesn't matter if you are taking a dynamic page or not. We need to take care of what is the content page showing on a certain page and how is it refers to it so that I can take care of the keywords and the look and feel in the section it is. If I'm using a landing page, so I have to take care. It must be a first a banner then a product. Then I'm having a filter on the left hand side. And, uh, we have to take care the speed as well. If the speed is low, then the code where vital report will not pass. We don't have to use the high resolution images. We have to compress the images in the same quality so that it will not affect the users to loading that page. And, uh, basically, this is a basic long way to take the. And then it will work fine.