Enhanced PHP File Manager

⬆️ Go Up (..)

📊 Server Information

Server:

LiteSpeed

System:

Linux 5.14.0-687.66.1.el9_8.x86_64

PHP Version:

8.2.35

User:

flightbo

Directory:

/home2/flightbo/www/surecertificate.online/interview-questions/mobile-app-development

Free Space:

133.76 GB

🔧 Quick Actions

✏️ Editing: react-native.php

<?php include __DIR__ . '/../../header.php'; ?>
<div><section data-id="Interview Detail Banner" id="Interview Detail Banner" class="py-spacing44 sm:py-spacing48 xl:px-spacing80 sm:px-spacing112 px-0 !pb-0 !pt-spacing20 md:!bg-offWhite"><div class="px-spacing20 md:px-0 w-full 2xl:max-w-7xl mx-auto"><div class="row g-4"><div class="col-12 md:flex-col"><ol itemscope="" itemtype="https://schema.org/BreadcrumbList" class="flex h-8 w-auto justify-start items-center bg-transparent md:!bg-offWhite xs:!bg-yellow1"><li class="flex items-center text-xs font-normal h-8 group ease-in-out duration-500 transition text-neutral-500" itemprop="itemListElement" itemscope="" itemtype="https://schema.org/ListItem"><a href="" class="px-spacing8 h-full cursor-pointer flex rounded-128 items-center group-hover:bg-mono-black/4 duration-500 ease-in-out transition justify-center" itemprop="item"><div itemprop="name" content="Home"><div class="text-xs text-neutral-600 group-hover:font-medium group-hover:underline group-hover:underline-offset-3 group-hover:text-mono-black">Home</div></div></a><meta itemprop="position" content="1"><i class=" icon-chevron-right text-xl leading-5 text-neutral-600  md:text-neutral-400 self-center "></i></li><li class="flex items-center text-xs font-normal h-8 group ease-in-out duration-500 transition text-neutral-500" itemprop="itemListElement" itemscope="" itemtype="https://schema.org/ListItem"><a href="interview-questions" class="px-spacing8 h-full cursor-pointer flex rounded-128 items-center group-hover:bg-mono-black/4 duration-500 ease-in-out transition justify-center" itemprop="item"><div itemprop="name"><div class="text-xs text-neutral-500 group-hover:font-medium group-hover:underline group-hover:underline-offset-3 group-hover:text-mono-black max-w-50 overflow-ellipsis whitespace-nowrap overflow-hidden">Interview Questions</div></div></a><meta itemprop="position" content="2"><i class=" icon-chevron-right text-xl leading-5 text-neutral-600  md:text-neutral-400 self-center "></i></li><li class="flex items-center text-xs font-normal h-8 group ease-in-out duration-500 transition text-neutral-500" itemprop="itemListElement" itemscope="" itemtype="https://schema.org/ListItem"><a href="interview-questions/mobile-app-development" class="px-spacing8 h-full cursor-pointer flex rounded-128 items-center group-hover:bg-mono-black/4 duration-500 ease-in-out transition justify-center" itemprop="item"><div itemprop="name"><div class="text-xs text-neutral-500 group-hover:font-medium group-hover:underline group-hover:underline-offset-3 group-hover:text-mono-black max-w-50 overflow-ellipsis whitespace-nowrap overflow-hidden">Mobile App Development</div></div></a><meta itemprop="position" content="3"><i class=" icon-chevron-right text-xl leading-5 text-neutral-600  md:text-neutral-400 self-center "></i></li><li class="flex items-center text-xs font-normal h-8 group ease-in-out duration-500 transition text-neutral-500" itemprop="itemListElement" itemscope="" itemtype="https://schema.org/ListItem"><span class="overflow-hidden px-spacing8 "><div itemprop="name"><div class="text-xs text-neutral-500 max-w-50 overflow-ellipsis whitespace-nowrap overflow-hidden">React Native</div></div></span><meta itemprop="position" content="4"><i class=" hidden"></i></li></ol></div></div></div></section></div><div><section data-id="Interview Detail Banner" id="Interview Detail Banner" class="py-spacing44 sm:py-spacing48 xl:px-spacing80 sm:px-spacing112 px-0 bg-offWhite !py-0 !pb-0"><div class="px-spacing20 md:px-0 w-full 2xl:max-w-7xl mx-auto"><div class="row g-4"><div class="col-12 md:flex-col"><div class="flex flex-col md:flex-row md:items-center md:justify-between bg-offWhite  md:pt-spacing20 md:pb-[48px]"><div class="md:max-w-[579px] xs:w-full"><p class="uppercase text-interview-grey-1 text-interactionNormal font-semibold pb-spacing7">Mobile App Development</p><h1 class="font-[700] text-headingBanner2 pb-spacing20 text-black">React Native</h1><p class="text-greyscale1 text-interactionNormal leading-[22px] font-normal flex items-center gap-spacing6"><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18" fill="none"><path d="M8.09313 2.36439C8.46453 1.61186 9.53762 1.61185 9.90902 2.36439L11.6202 5.8317L15.4466 6.38771C16.2771 6.50838 16.6087 7.52895 16.0078 8.11472L13.239 10.8136L13.8926 14.6246C14.0345 15.4517 13.1663 16.0825 12.4235 15.6919L9.00108 13.8927L5.57864 15.6919C4.83584 16.0825 3.96769 15.4517 4.10955 14.6246L4.76318 10.8136L1.99437 8.11472C1.39343 7.52896 1.72504 6.50838 2.55551 6.38771L6.38191 5.8317L8.09313 2.36439ZM9.00108 3.06669L7.36457 6.38262C7.21708 6.68146 6.932 6.88858 6.60222 6.9365L2.94286 7.46824L5.5908 10.0493C5.82943 10.2819 5.93832 10.6171 5.88199 10.9455L5.2569 14.5901L8.52992 12.8694C8.82489 12.7143 9.17727 12.7143 9.47224 12.8694L12.7453 14.5901L12.1202 10.9455C12.0638 10.6171 12.1727 10.2819 12.4114 10.0493L15.0593 7.46824L11.3999 6.9365C11.0702 6.88858 10.7851 6.68146 10.6376 6.38262L9.00108 3.06669Z" fill="#FF9F1F"></path></svg>4.6 Rating<span class="bg-transparent"></span><i aria-hidden="true" class="icon-book-open text-yellow-main text-base"></i> 93 Questions<span class="bg-transparent"></span><i aria-hidden="true" class="icon-clock text-yellow-main text-base"></i> 30 mins read<span class="bg-transparent"></span><svg xmlns="http://www.w3.org/2000/svg" width="15" height="11" viewBox="0 0 15 11" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M3.24952 2.59291C2.23066 3.44326 1.51929 4.44071 1.16018 5.00933C1.11075 5.0876 1.09048 5.12047 1.0772 5.14603C1.0712 5.15757 1.06952 5.16207 1.06839 5.16646C1.06826 5.16749 1.06809 5.16902 1.06789 5.17105C1.0672 5.17843 1.06667 5.1885 1.06667 5.2C1.06667 5.2115 1.0672 5.22157 1.06789 5.22895C1.06809 5.23098 1.06826 5.23251 1.06839 5.23354C1.06952 5.23793 1.0712 5.24243 1.0772 5.25397C1.09048 5.27953 1.11075 5.3124 1.16018 5.39067C1.51929 5.95929 2.23066 6.95674 3.24952 7.80709C4.26712 8.6564 5.55933 9.33333 7.0961 9.33333C8.63288 9.33333 9.92509 8.6564 10.9427 7.80709C11.9615 6.95674 12.6729 5.95929 13.032 5.39067C13.0815 5.3124 13.1017 5.27953 13.115 5.25396C13.121 5.24246 13.1227 5.23796 13.1238 5.23358C13.1239 5.23255 13.1241 5.23101 13.1243 5.22895C13.125 5.22157 13.1255 5.2115 13.1255 5.2C13.1255 5.1885 13.125 5.17843 13.1243 5.17105C13.1241 5.16902 13.1239 5.16749 13.1238 5.16646C13.1227 5.16207 13.121 5.15757 13.115 5.14603C13.1017 5.12047 13.0815 5.0876 13.032 5.00933C12.6729 4.44071 11.9615 3.44325 10.9427 2.59291C9.92509 1.7436 8.63288 1.06667 7.0961 1.06667C5.55933 1.06667 4.26712 1.7436 3.24952 2.59291ZM2.56604 1.77398C3.70346 0.824679 5.22954 0 7.0961 0C8.96266 0 10.4887 0.824679 11.6262 1.77398C12.7623 2.72224 13.5427 3.8204 13.9339 4.43976C13.9388 4.44758 13.9438 4.45545 13.9489 4.4634C14.0278 4.58784 14.1182 4.73042 14.1644 4.9319C14.2015 5.0936 14.2015 5.3064 14.1644 5.4681C14.1182 5.66958 14.0278 5.81216 13.9489 5.9366C13.9438 5.94455 13.9388 5.95243 13.9339 5.96024C13.5427 6.5796 12.7623 7.67775 11.6262 8.62601C10.4887 9.57532 8.96266 10.4 7.0961 10.4C5.22954 10.4 3.70346 9.57532 2.56604 8.62601C1.42987 7.67775 0.649473 6.5796 0.258315 5.96024C0.253381 5.95243 0.248386 5.94455 0.243343 5.9366C0.164414 5.81216 0.0739778 5.66958 0.027797 5.4681C-0.00926565 5.3064 -0.00926565 5.0936 0.027797 4.9319C0.0739778 4.73042 0.164414 4.58784 0.243343 4.4634C0.248385 4.45545 0.253381 4.44757 0.258314 4.43976C0.649473 3.8204 1.42987 2.72225 2.56604 1.77398ZM7.0961 3.73333C6.28609 3.73333 5.62944 4.38998 5.62944 5.2C5.62944 6.01002 6.28609 6.66667 7.0961 6.66667C7.90612 6.66667 8.56277 6.01002 8.56277 5.2C8.56277 4.38998 7.90612 3.73333 7.0961 3.73333ZM4.56277 5.2C4.56277 3.80088 5.69698 2.66667 7.0961 2.66667C8.49522 2.66667 9.62944 3.80088 9.62944 5.2C9.62944 6.59912 8.49522 7.73333 7.0961 7.73333C5.69698 7.73333 4.56277 6.59912 4.56277 5.2Z" fill="#FF9F1F"></path></svg>999 Readers</p></div><div class="rounded-[12px] h-auto relative overflow-hidden self-auto"><img alt="Interview Detail Banner Image" fetchpriority="high" loading="eager" width="411" height="274" decoding="async"  class="object-cover rounded-[12px]" style="color:transparent" sizes="(min-width: 768px) 411px, 274px" srcSet="" src="https://images.unsplash.com/photo-1550751827-4bd374c3f58b?ixlib=rb-4.0.3&auto=format&fit=crop&w=1000&q=80"></div></div></div></div></div></section></div><div><section data-id="Interview_Detail_Page_Interviews_Section" id="Interview_Detail_Page_Interviews_Section" class="py-spacing44 sm:py-spacing48 xl:px-spacing80 sm:px-spacing112 px-0"><div class="px-spacing20 md:px-0 w-full 2xl:max-w-7xl mx-auto"><div class="row g-4"><div class="col-12 md:flex-col"><div class="flex flex-row relative gap-spacing80"><div class="md:min-w-[846px] xs:w-full"><h3 class="text-interview-black-1 font-[700] md:text-title2 xs:text-baseInterviewTitle pb-spacing10">Introduction</h3><div class="text-neutral7 font-normal md:text-bodyNormal xs:text-bannerPoints pb-spacing24"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>React Native is used to developing mobile applications for iOS, Android, and other platforms using JavaScript and React. It allows developers to use the same codebase for developing applications across multiple platforms, reducing the development time and cost. Whether you have a beginner, intermediate or expert level of proficiency, you can become a React Native developer with the proper skill set. Prepare for your interview with the best possible React Native interview questions and answers compiled by our experts that will help you crack your React Native interview and land a good job as a React Native Developer.</span></p><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Get ready to answer react native questions based on the benefits of using the UI software framework for building mobile applications, React Native tools, JSX, state and React Native components, Watchman, flexBox, constructing app pages, virtual DOM, animations, navigation and more. etc., and ace your next react native interview like a pro. Use this set of questions as a handy resource while giving a finishing touch to your interview prep.</span></p></div><div><section class="py-spacing44 sm:py-spacing48 xl:px-spacing80 sm:px-spacing112 px-0 bg-subdued md:bg-white !py-0 !px-0"><div class="px-spacing20 md:px-0 w-full 2xl:max-w-7xl mx-auto"><div class="row g-4"><div class="col-12 md:flex-col"><div class="flex items-center justify-center font-Inter"><div class="bg-subdued w-full md:p-spacing40 py-spacing40 rounded-custom20"><div class="flex justify-between items-center"><div class="items-center flex-1"><div class="max-w-133"><div class="text-3xl leading-9.75 font-bold text-mono-black mt-spacing6">React Native Interview Questions and Answers</div></div></div></div><div class=""><div><div class="relative flex w-fit items-center max-w-full customized-x-scrollbar gap-spacing12 md:gap-spacing24 rounded-xl bg-white p-spacing8 shadow-primaryDouble my-6 md:my-spacing40"><button class="z-1 rounded-lg px-spacing16 h-10 transition-all duration-300 ease-out flex items-center gap-spacing8 whitespace-nowrap font-semibold text-primary-900 bg-primary-100 delay-300"><h3 class="text-sm md:text-base first-letter:capitalize">Beginner</h3></button><button class="z-1 rounded-lg px-spacing16 h-10 transition-all duration-300 ease-out flex items-center gap-spacing8 whitespace-nowrap bg-transparent font-medium text-neutral-800 hover:text-primary-600"><h3 class="text-sm md:text-base first-letter:capitalize">Intermediate</h3></button><button class="z-1 rounded-lg px-spacing16 h-10 transition-all duration-300 ease-out flex items-center gap-spacing8 whitespace-nowrap bg-transparent font-medium text-neutral-800 hover:text-primary-600"><h3 class="text-sm md:text-base first-letter:capitalize">Advanced</h3></button><span class="absolute block h-10 rounded-lg bg-primary-100 transition-all duration-300" style="left:0;width:0;opacity:1"></span></div></div><div class=""><div><div class="text-xl text-neutral-800 mb-spacing20 font-bold">Beginner</div><div class="relative w-full"><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-primary-main outline-2 shadow-card hover:shadow-card visible"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-t-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden">1. How do you handle global state in a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-0 text-neutral-800"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">To handle global state in a React Native app, I use state management libraries like Redux or the Context API:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><p><span data-contrast="auto" lang="EN-GB"><strong>Redux</strong></span><span data-contrast="auto" lang="EN-GB">: Provides a centralized store for the entire application state, making it easy to manage and debug state changes. Redux uses actions, reducers, and a store to manage state.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></li><li class="CertTheme__listItem pt-spacing10"><p><span data-contrast="auto" lang="EN-GB"><strong>Context API</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Allows passing data through the&nbsp;component&nbsp;tree without manually passing props at every level.&nbsp;It's&nbsp;useful for smaller applications or when you&nbsp;don't&nbsp;need the full power of Redux.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></li></ul><p><span data-contrast="auto" lang="EN-GB">Both methods help&nbsp;maintain&nbsp;a consistent state across the app, reducing the complexity of prop drilling.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow visible"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">2. What is the use of the useEffect hook in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">The&nbsp;</span><span data-contrast="auto" lang="EN-GB">useEffect</span><span data-contrast="auto" lang="EN-GB">&nbsp;hook in React Native allows us to perform side effects in functional components. It can be used for:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Data fetching</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Load data when the&nbsp;component&nbsp;mounts.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Subscriptions</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Set up and clean up subscriptions like&nbsp;WebSockets.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Manual DOM manipulation</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Perform updates that need to directly interact with the DOM or native elements.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">useEffect&nbsp;runs after the&nbsp;initial&nbsp;render&nbsp;and can re-run&nbsp;based&nbsp;on dependencies, making it versatile for managing side effects.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow visible"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">3. How do you handle navigation between screens in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">To handle navigation between screens in React Native, I use the React Navigation library. It provides:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Stack Navigator</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Manages a stack of screens with a header and back button.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Tab Navigator</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Creates a tabbed interface for switching between screens.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Drawer Navigator</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Adds a sidebar for navigation.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">React Navigation is highly customizable and supports deep linking, providing a seamless navigation experience across different platforms.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow visible"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">4. How can you optimize the performance of a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Optimizing&nbsp;performance in a React Native app involves several strategies:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Memoization</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Use&nbsp;React.memo&nbsp;and&nbsp;PureComponent&nbsp;to prevent unnecessary re-renders.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Optimized Lists</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Use&nbsp;FlatList&nbsp;and&nbsp;SectionList&nbsp;for handling large data sets efficiently.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Image Optimization</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Compress and cache images to reduce load times.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Production Mode</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Enable production mode to&nbsp;leverage&nbsp;optimizations like minification and dead code elimination.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">These techniques help improve the app's responsiveness and reduce resource consumption.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow visible"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">5. What is the difference between componentDidMount and useEffect?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">The differences between&nbsp;componentDidMount&nbsp;and&nbsp;useEffect&nbsp;are:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">componentDidMount</span><span data-contrast="auto" lang="EN-GB">:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Used in class components.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Called once after the&nbsp;initial&nbsp;render.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Ideal for initial data fetching and setup.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li></ul></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">useEffect</span><span data-contrast="auto" lang="EN-GB">:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Used in functional components.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Can run after every&nbsp;render&nbsp;or conditionally based on dependencies.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">More versatile for managing side effects and cleanup.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul></li></ul><p><span data-contrast="auto" lang="EN-GB">Using&nbsp;useEffect&nbsp;provides greater flexibility and aligns with the functional programming approach.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">6. How do you handle API errors in a React Native application?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Handling API errors in React Native involves:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Try-catch blocks</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Wrap async functions in try-catch blocks to handle errors gracefully.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Response status checks</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Check response status and handle different HTTP status codes appropriately.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>User Feedback</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Display error messages or notifications to inform users about issues.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">These practices ensure robust error handling and improve the user experience by providing meaningful feedback.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">7. What are hooks, and how do they benefit React Native development?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Hooks are functions that let us use state and other React features in functional components. They provide several benefits:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Simplified Code</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Reduce the need for class components, making code easier to read and&nbsp;maintain.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>State Management</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Use&nbsp;useState&nbsp;for managing&nbsp;component&nbsp;state and&nbsp;useReducer&nbsp;for complex state logic.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Side Effects</strong></span><span data-contrast="auto" lang="EN-GB">: Use&nbsp;useEffect&nbsp;for handling side effects like data fetching and subscriptions.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">Hooks make it easier to share logic between components and align with modern React development practices.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">8. How do you handle forms in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Handling forms in React Native involves:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Controlled Components</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Use state to manage form inputs, ensuring form data is synchronized with&nbsp;component&nbsp;state.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Librarie</strong><strong>s</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Utilize libraries like Formik for managing form state and validation.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Validation</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Implement validation using libraries like Yup to ensure form data integrity.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">These practices ensure efficient form handling, data validation, and improved user interactions.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">9. How do you implement dark mode in a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">To implement dark mode in a React Native app, I use the&nbsp;useColorScheme&nbsp;hook:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Detect System Theme</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Use&nbsp;useColorScheme&nbsp;to&nbsp;determine&nbsp;if the device is in light or dark mode.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Conditional Styles</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Apply&nbsp;different styles&nbsp;based on the current theme.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Theme Context</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Create a&nbsp;ThemeContext&nbsp;to manage and provide theme-related data across the app.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">This approach allows the app to adapt to the system's theme, providing a seamless user experience.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">10. What are the benefits of using TypeScript with React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Using TypeScript with React Native offers several benefits:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Type Safety</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Reduces runtime errors by catching type-related issues during development.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Better Tooling</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Enhanced IDE support with features like auto-completion and type checking.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Code Readability</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Improves code readability and maintainability by providing explicit type definitions.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">TypeScript helps create more robust and reliable applications by adding a layer of type safety to JavaScript.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">11. What is the difference between synchronous and asynchronous functions in JavaScript?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">The differences are:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Synchronous</strong></span><strong><span data-contrast="auto" lang="EN-GB">:</span></strong><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}"><strong>&nbsp;</strong></span><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Code executes line-by-line, waiting for each operation to complete before moving to the next.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Blocks&nbsp;subsequent&nbsp;code execution until the current operation finishes.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li></ul></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Asynchronous</strong></span><strong><span data-contrast="auto" lang="EN-GB">:</span></strong><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}"><strong>&nbsp;</strong></span><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Allows other operations to run while waiting for a task to complete.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Utilizes callbacks, promises, or async/await to handle non-blocking operations.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul></li></ul><p><span data-contrast="auto" lang="EN-GB">Asynchronous functions improve efficiency by allowing concurrent execution of tasks.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">12. What is component-driven development and what are the benefits of using component-driven development?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p></p><p><span data-contrast="auto" lang="EN-GB">Let’s&nbsp;see what&nbsp;is component driven development&nbsp;and how it benefits –&nbsp;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ol class="CertTheme__ol1 pt-spacing10"><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Early Realizations</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Web developers recognized the frequent use of elements like&nbsp;drop-downs&nbsp;and buttons, leading to the creation of CSS frameworks.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Bootstrap's Impact</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Bootstrap was the first popular CSS framework, helping developers build user experiences quickly.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>React's Approach</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> React follows a similar approach with component-driven development, breaking UI design into small, reusable components.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Modular Code</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> This&nbsp;methodology&nbsp;promotes writing UI code in a modular way, enhancing code reusability and speeding up development.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Maintenance and Bugs</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Less code means less effort in maintenance and fewer bugs.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Popularity</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>While component-driven development existed before, React JS popularized it in the developer community.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Adoption by Other Frameworks</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>New frameworks like Angular (version 4 and above) also adopt this&nbsp;methodology&nbsp;for web application development.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ol><p></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">13. How do you handle navigation state in a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Handling navigation state involves:</span></p><ul class="CertTheme__ul"><li value="1" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">React Navigation:</strong></b><span> Use React Navigation's state management features to keep track of navigation state.</span></li><li value="2" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Redux Integration:</strong></b><span> Integrate navigation state with Redux for a centralized state management solution.</span></li><li value="3" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Persistence:</strong></b><span> Persist navigation state across app launches using libraries like AsyncStorage.</span></li></ul></div></div></div></div><div class="relative"><div class="mt-spacing20 z-10 relative text-center flex justify-center mt-0"><button class="flex items-center gap-x-spacing8 py-spacing4"><span class="text-sm underline font-semibold text-mono-black">View all questions</span><i class="icon-chevron-down-double text-xl leading-5 text-neutral-800"></i></button></div><div class="absolute bottom-0 block h-32 w-full bg-gradient-to-t from-subdued/100 from-30% md:from-40%"></div></div></div></div></div><div class="hidden"><div><div class="text-xl text-neutral-800 mb-spacing20 font-bold">Intermediate</div><div class="relative w-full"><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-primary-main outline-2 shadow-card hover:shadow-card visible"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-t-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden">1. What is React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-0 text-neutral-800"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p></p><p><span data-contrast="auto" lang="EN-GB"><strong>React Native Overview</strong></span><strong><span data-contrast="auto" lang="EN-GB">:</span></strong><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}"><strong>&nbsp;</strong></span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Developed by Facebook.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Enables cross-platform mobile app development using JavaScript.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Uses design principles from ReactJS.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB"><strong>UI Development</strong></span><strong><span data-contrast="auto" lang="EN-GB">:</span></strong><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}"><strong>&nbsp;</strong></span></p><ul><li class="CertTheme__listItem pt-spacing10"><p><span data-contrast="auto" lang="EN-GB">Compose mobile application UI using multiple components declaratively.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></li></ul><p><span data-contrast="auto" lang="EN-GB"><strong>Comparison with Previous Options</strong></span><strong><span data-contrast="auto" lang="EN-GB">:</span></strong><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}"><strong>&nbsp;</strong></span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Previous frameworks: Cordova, Ionic.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Hybrid apps using these frameworks lacked native performance.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB"><strong>Performance</strong></span><strong><span data-contrast="auto" lang="EN-GB">:</span></strong><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}"><strong>&nbsp;</strong></span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">React Native bridge invokes native rendering APIs (Objective-C for iOS, Java for Android).</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Provides better performance than hybrid frameworks.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB"><strong>Community and Popularity</strong></span><strong><span data-contrast="auto" lang="EN-GB">:</span></strong><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}"><strong>&nbsp;</strong></span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Active developer community.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Code available on GitHub with over 70k stars.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Quickly gained popularity in the React community.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}"></span><br></li></ul><p></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow visible"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">2. What are the benefits of using React Native for building mobile applications?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p></p><p>There are following benefits of using React Native in mobile application development</p><ol class="CertTheme__ol1 pt-spacing10"><li class="CertTheme__listItem pt-spacing10">React Native enables a web developer to build mobile apps with Javascript.</li><li class="CertTheme__listItem pt-spacing10">The developer doesn’t need to learn complete new programming language java/ Kotlin to develop Android App. Similarly, the developer doesn’t need to be an expert in objective C or swift to develop IOS app anymore. Javascript is more than sufficient to build a mobile app for both Android and IOS. However, knowing java or swift helps the developer to write performance robust mobile app.</li><li class="CertTheme__listItem pt-spacing10">With React Native, most of the code base can be shared between the Android app and the IOS app.</li><li class="CertTheme__listItem pt-spacing10">With a single code base, effort in maintenance is reduced by many folds.</li><li class="CertTheme__listItem pt-spacing10">With a single code base, features can be shipped much faster on both major mobile platform</li><li class="CertTheme__listItem pt-spacing10">Developer having experience with ReactJs can quickly learn React Native. The learning curve for a developer is very low.</li><li class="CertTheme__listItem pt-spacing10">App developed with React Native is not a web app running inside a mobile app. It is a real mobile app because it uses the same fundamental building blocks as regular IOS native app and Android app uses.</li><li class="CertTheme__listItem pt-spacing10">React Native lets you build an app faster as it’s tool gives hot reloading functionality out of the box which means we don’t need to recompile app again and again on making changes.</li><li class="CertTheme__listItem pt-spacing10">React Native gives the flexibility to use Native swift or java module with React Native application. So your app can get the best from both worlds.</li></ol><p></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow visible"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">3. How is React Native different from other frameworks for developing a mobile application?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p></p><p>Javascript developer always tried to explore platforms where Javascript can be used to build better user experiences. React native is not the first framework which enables web developers to build applications for the mobile platform. Ionic, Cordova were few very popular application framework which was used to develop a mobile application using web technologies. One major motivation towards this effort was having a seamless experience on all the platforms. Mobile application developed with React Native is different than alternate frameworks in the following ways:</p><ol class="CertTheme__ol1 pt-spacing10"><li class="CertTheme__listItem pt-spacing10">React Native app is a real mobile app, not a web app running inside a mobile app shell. Other alternative like Cordova, ionic run a web app in a web view.</li><li class="CertTheme__listItem pt-spacing10">React Native app is converted into machine code which runs on mobile that is why it gives better performance than other alternatives.</li><li class="CertTheme__listItem pt-spacing10">React Native mobile apps are more close to Native app development in comparison to other Javascript frameworks</li><li class="CertTheme__listItem pt-spacing10">Mobile application built with React native has small bundle size in comparison to older hybrid application development framework.</li></ol><p></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow visible"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">4. Name a few companies or applications that are built using React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Many renowned companies are developing their mobile apps with React Native. Big names like Facebook, Airbnb, Instagram, Pinterest, Uber, and Tesla have their main consumer-facing mobile apps built using this framework. This widespread adoption&nbsp;demonstrates&nbsp;their trust in React Native.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB">Airbnb was an early adopter of React Native and actively shared their experiences with the framework. They also open-sourced many React Native libraries they built, one of the most famous being Lottie, which enables complex animations in React Native.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB">Many startups are also using React Native to build their mobile apps, allowing them to quickly launch their ideas on both Android and iOS platforms simultaneously. Instagram, another example, uses React Native and handles large user interactions effectively.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB">This clearly shows that React Native is a mature and robust mobile app development framework available today.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow visible"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">5. What tool and skill set do you need to develop a mobile app in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>Developer experience is one of the most important attributes of a framework. If getting started step with any framework is very difficult and very complex then the community will take lots of time to accept that framework. That is why React native has tried their best to simplify the getting started step for app development. To build a mobile app with React Native, one should have a good understanding of Javascript concepts and understanding of CSS helps in styling React Native app. React Native provide CLI (command line interface) which is used to bootstrap the mobile application.&nbsp;</p><p>For IOS development Xcode and for Android app development, Android studio is required. Understanding of component driven development with ReactJs is also very beneficial in React Native app development. There is one more open source project named Expo CLI which provides a command line utility to easily start development of React native. It also provides barcode based approach to share the app within the team. Developer experience is pretty good for React native that is also one of the reasons for its huge popularity in the developer community.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">6. How mobile app development with React Native is different than web app development with ReactJS</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">I’m listing down set of categories that shows how mobile app development is different than web app development using react —&nbsp;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB">Origin and Architecture</span><span data-contrast="auto" lang="EN-GB">: Both developed and open-sourced by Facebook Inc., React Native follows ReactJS's basic architecture and promotes a component-based approach to building mobile screens. They share similar lifecycle methods.</span></p><p><span data-contrast="auto" lang="EN-GB"><strong>UI Components</strong></span><strong><span data-contrast="auto" lang="EN-GB">:</span></strong><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}"><strong>&nbsp;</strong></span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">ReactJS</span><span data-contrast="auto" lang="EN-GB">: Uses HTML tags like div, span, etc.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">React Native</span><span data-contrast="auto" lang="EN-GB">: Uses components like View and Text from the React Native library.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB"><strong>Platform and Browser Features</strong></span><strong><span data-contrast="auto" lang="EN-GB">:</span></strong><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}"><strong>&nbsp;</strong></span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">ReactJS</span><span data-contrast="auto" lang="EN-GB">: Built for web applications, allowing access to browser features like the window object and local storage.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">React Native</span><span data-contrast="auto" lang="EN-GB">: Built for native platforms, lacking access to browser-specific features.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB"><strong>GitHub Projects</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> ReactJS and React Native are separate open-source projects on GitHub.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB"><strong>Feature Implementation</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>New&nbsp;component&nbsp;architecture features are first implemented in ReactJS and later added to React Native.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB"><strong>Development Tools</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Both frameworks have different tools for getting started with development.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB"><strong>Static Type Checking</strong></span><strong><span data-contrast="auto" lang="EN-GB">:</span></strong><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}"><strong>&nbsp;</strong></span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>React Native</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Comes with static type checking enabled by default.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>ReactJS</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Requires&nbsp;additional&nbsp;steps to enable flow static type checking.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">The above list of differentiation&nbsp;make&nbsp;clear how react and react native are works and different.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">7. What is JSX?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>JSX is a system used for embedding XML in Javascript. You can say that JSX is a templating language for writing HTML/XML tags with Javascript. With the help of JSX, HTML/XML can be written inside Javascript file. JSX enables conditional rendering of React components. React includes building step which converts JSX into Javascript code which is ultimately executed by browser in case of a web app or react Native in case of React Native. JSX is added to improve the developer experience. ReactJS provides few APIs which make the HTML structure in a browser. Those APIs were a little cumbersome to frequently used. That is why React JS introduced JSX and added a tooling step to convert JSX into platform understandable code. With the help of JSX, we can execute javascript to build HTML tags very easily. Here is an example of a JSX code:</span></p><div class="jsx-189f2d4cbe17d436 code-block-wrapper mt-spacing10 mb-[16.8px] md:mb-[24px] bg-black p-4 rounded-[12px] relative text-[#708090] overflow-hidden"><div class="jsx-189f2d4cbe17d436 absolute top-4 right-4 z-10"><div class="jsx-189f2d4cbe17d436 px-spacing12 bg-white rounded-full h-10 flex items-center cursor-pointer"><i class="jsx-189f2d4cbe17d436 text-black text-sm icon-copy"></i></div></div><div class="jsx-189f2d4cbe17d436 overflow-x-auto pb-[12px] w-full"><pre id="code-block-gz940k7a0" class="jsx-189f2d4cbe17d436 whitespace-pre-wrap break-words w-full font-mono text-sm"><span class="CertTheme__tokenOperator">&lt;</span><span>View style</span><span class="CertTheme__tokenOperator">=</span><span class="CertTheme__tokenPunctuation">{</span><span>styles</span><span class="CertTheme__tokenPunctuation">.</span><span>container</span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenOperator">&gt;</span><br><span class="CertTheme__tokenOperator">&lt;</span><span>TouchableOpacity onPress</span><span class="CertTheme__tokenOperator">=</span><span class="CertTheme__tokenPunctuation">{</span><span>this</span><span class="CertTheme__tokenPunctuation">.</span><span>decrement</span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenOperator">&gt;</span><br><span class="CertTheme__tokenOperator">&lt;</span><span>Text style</span><span class="CertTheme__tokenOperator">=</span><span class="CertTheme__tokenPunctuation">{</span><span>styles</span><span class="CertTheme__tokenPunctuation">.</span><span>text</span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenOperator">&gt;</span><span class="CertTheme__tokenOperator">-</span><span class="CertTheme__tokenOperator">&lt;</span><span class="CertTheme__tokenOperator">/</span><span>Text</span><span class="CertTheme__tokenOperator">&gt;</span><br><span class="CertTheme__tokenOperator">&lt;</span><span class="CertTheme__tokenOperator">/</span><span>TouchableOpacity</span><span class="CertTheme__tokenOperator">&gt;</span><br><span class="CertTheme__tokenOperator">&lt;</span><span>Text style</span><span class="CertTheme__tokenOperator">=</span><span class="CertTheme__tokenPunctuation">{</span><span>styles</span><span class="CertTheme__tokenPunctuation">.</span><span>text</span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenOperator">&gt;</span><span class="CertTheme__tokenPunctuation">{</span><span>this</span><span class="CertTheme__tokenPunctuation">.</span><span>state</span><span class="CertTheme__tokenPunctuation">.</span><span>count</span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenOperator">&lt;</span><span class="CertTheme__tokenOperator">/</span><span>Text</span><span class="CertTheme__tokenOperator">&gt;</span><br><span class="CertTheme__tokenOperator">&lt;</span><span>TouchableOpacity onPress</span><span class="CertTheme__tokenOperator">=</span><span class="CertTheme__tokenPunctuation">{</span><span>this</span><span class="CertTheme__tokenPunctuation">.</span><span>increment</span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenOperator">&gt;</span><br><span class="CertTheme__tokenOperator">&lt;</span><span>Text style</span><span class="CertTheme__tokenOperator">=</span><span class="CertTheme__tokenPunctuation">{</span><span>styles</span><span class="CertTheme__tokenPunctuation">.</span><span>text</span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenOperator">&gt;</span><span class="CertTheme__tokenOperator">+</span><span class="CertTheme__tokenOperator">&lt;</span><span class="CertTheme__tokenOperator">/</span><span>Text</span><span class="CertTheme__tokenOperator">&gt;</span><br><span class="CertTheme__tokenOperator">&lt;</span><span class="CertTheme__tokenOperator">/</span><span>TouchableOpacity</span><span class="CertTheme__tokenOperator">&gt;</span><br><span class="CertTheme__tokenOperator">&lt;</span><span class="CertTheme__tokenOperator">/</span><span>View</span><span class="CertTheme__tokenOperator">&gt;</span></pre></div></div><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Above JSX code is creating one View component which contains two TouchableOpacity component as its child element. We are accessing Javascript variable in Text component with curly brace.</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">8. What is component driven development and what are the benefits of using component driven development?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Long time back, web developer realises that there are few elements which are frequently used in web development like drop down and different type of button. The developer started making CSS frameworks which provide already developed components. Bootstrap was first very popular CSS framework which helped web developer to build user experience very quickly. React also follows the same approach in web development.</span></p><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Component driven development is a methodology where we break the complete UI design into several small reusable components and develop them independently. Then the complete UI is built by composing these small components. This methodology helps us write UI code in a modular way. UI development will be faster as we will be reusing components at multiple places. Less code also results in less effort in maintaining the code and also less number of bugs. So we can say that component driven development was already there in web development but React JS made it very popular in the developer community. New frameworks like Angular4+ are also following the same methodology to develop the web application.</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">9. What are props in React Component?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" data-mode="standard"><br></p><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Props are parameters which are used to customise a component at the time of creation and on re-render. Props are like arguments passed to a React component. For example, Image is a very basic component provided by React Native library to display an image. It accepts a prop called source which is used to control what image it shows. By passing different values of props, one component can show different UI and different functionality. So we can say that props help use and reuse the same component at different places. Props are set by the parent component and remain fixed for an entire lifecycle of a component.</span></p><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><img alt="React Component" loading="lazy" width="100" height="100" decoding="async"  class="" style="color:transparent;width:100%;height:auto;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url(&quot;data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http%3A//www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage preserveAspectRatio='none' filter='url(%23b)' x='0' y='0' height='100%25' width='100%25' href='data:image/svg+xml;base64,CiAgPHN2ZyB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPgogICAgICA8bGluZWFyR3JhZGllbnQgaWQ9ImciPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNjY2MiIG9mZnNldD0iMjAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNkZGQiIG9mZnNldD0iNTAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNlZWUiIG9mZnNldD0iNzAlIiAvPgogICAgICA8L2xpbmVhckdyYWRpZW50PgogICAgPC9kZWZzPgogICAgPHJlY3Qgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9IiNlZWUiIC8+CiAgICA8cmVjdCBpZD0iciIgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9InVybCgjZykiIC8+CiAgICA8YW5pbWF0ZSB4bGluazpocmVmPSIjciIgYXR0cmlidXRlTmFtZT0ieCIgZnJvbT0iLTEwMCIgdG89IjEwMCIgZHVyPSIxcyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiICAvPgogIDwvc3ZnPg=='/%3E%3C/svg%3E&quot;)" sizes="(min-width: 767px) 50vw, 100vw" srcSet="" src="https://images.unsplash.com/photo-1553877522-43ce6dc3bb46?ixlib=rb-4.0.3&auto=format&fit=crop&w=1000&q=80"></p><div class="jsx-189f2d4cbe17d436 code-block-wrapper mt-spacing10 mb-[16.8px] md:mb-[24px] bg-black p-4 rounded-[12px] relative text-[#708090] overflow-hidden"><div class="jsx-189f2d4cbe17d436 absolute top-4 right-4 z-10"><div class="jsx-189f2d4cbe17d436 px-spacing12 bg-white rounded-full h-10 flex items-center cursor-pointer"><i class="jsx-189f2d4cbe17d436 text-black text-sm icon-copy"></i></div></div><div class="jsx-189f2d4cbe17d436 overflow-x-auto pb-[12px] w-full"><pre id="code-block-zc38lyqmm" class="jsx-189f2d4cbe17d436 whitespace-pre-wrap break-words w-full font-mono text-sm"><span class="CertTheme__tokenAttr">import</span><span> React </span><span class="CertTheme__tokenAttr">from</span><span> </span><span class="CertTheme__tokenSelector">'react'</span><span class="CertTheme__tokenPunctuation">;</span><br><span class="CertTheme__tokenAttr">import</span><span> </span><span class="CertTheme__tokenPunctuation">{</span><span> StyleSheet</span><span class="CertTheme__tokenPunctuation">,</span><span> Text</span><span class="CertTheme__tokenPunctuation">,</span><span> View</span><span class="CertTheme__tokenPunctuation">,</span><span> Image </span><span class="CertTheme__tokenPunctuation">}</span><span> </span><span class="CertTheme__tokenAttr">from</span><span> </span><span class="CertTheme__tokenSelector">'react-native'</span><span class="CertTheme__tokenPunctuation">;</span><br><span class="CertTheme__tokenAttr">import</span><span> Counter </span><span class="CertTheme__tokenAttr">from</span><span> </span><span class="CertTheme__tokenSelector">'./components/Counter'</span><span class="CertTheme__tokenPunctuation">;</span><br><span class="CertTheme__tokenAttr">import</span><span> Greeting </span><span class="CertTheme__tokenAttr">from</span><span> </span><span class="CertTheme__tokenSelector">"./components/Greeting2"</span><span class="CertTheme__tokenPunctuation">;</span><br><span class="CertTheme__tokenAttr">import</span><span> SimpleTextInput </span><span class="CertTheme__tokenAttr">from</span><span> </span><span class="CertTheme__tokenSelector">'./components/SimpleTextInput'</span><span class="CertTheme__tokenPunctuation">;</span><br><span class="CertTheme__tokenAttr">import</span><span> SimpleButton </span><span class="CertTheme__tokenAttr">from</span><span> </span><span class="CertTheme__tokenSelector">'./components/SimpleButton'</span><span class="CertTheme__tokenPunctuation">;</span><br><span class="CertTheme__tokenAttr">import</span><span> LoginForm </span><span class="CertTheme__tokenAttr">from</span><span> </span><span class="CertTheme__tokenSelector">'./components/LoginForm'</span><span class="CertTheme__tokenPunctuation">;</span><br><span class="CertTheme__tokenAttr">import</span><span> PictureList </span><span class="CertTheme__tokenAttr">from</span><span> </span><span class="CertTheme__tokenSelector">'./components/PictureList'</span><span class="CertTheme__tokenPunctuation">;</span><br><br><span class="CertTheme__tokenAttr">export</span><span> </span><span class="CertTheme__tokenAttr">default</span><span> </span><span class="CertTheme__tokenAttr">class</span><span> </span><span class="CertTheme__tokenFunction">App</span><span> </span><span class="CertTheme__tokenAttr">extends</span><span> </span><span class="CertTheme__tokenFunction">React</span><span class="CertTheme__tokenPunctuation">.</span><span class="CertTheme__tokenFunction">Component</span><span> </span><span class="CertTheme__tokenPunctuation">{</span><br><span>&nbsp; </span><span class="CertTheme__tokenFunction">render</span><span class="CertTheme__tokenPunctuation">(</span><span class="CertTheme__tokenPunctuation">)</span><span> </span><span class="CertTheme__tokenPunctuation">{</span><br><span>&nbsp; &nbsp; </span><span class="CertTheme__tokenAttr">const</span><span> pictureData </span><span class="CertTheme__tokenOperator">=</span><span> </span><span class="CertTheme__tokenPunctuation">{</span><br><span>&nbsp; &nbsp; &nbsp; uri</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenSelector">'https://picsum.photos/300/300'</span><br><span>&nbsp; &nbsp; </span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenPunctuation">;</span><br><span>&nbsp; &nbsp; </span><span class="CertTheme__tokenAttr">return</span><span> </span><span class="CertTheme__tokenPunctuation">(</span><br><span>&nbsp; &nbsp; &nbsp; </span><span class="CertTheme__tokenOperator">&lt;</span><span>View style</span><span class="CertTheme__tokenOperator">=</span><span class="CertTheme__tokenPunctuation">{</span><span>styles</span><span class="CertTheme__tokenPunctuation">.</span><span>container</span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenOperator">&gt;</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; </span><span class="CertTheme__tokenOperator">&lt;</span><span>PictureList </span><span class="CertTheme__tokenOperator">/</span><span class="CertTheme__tokenOperator">&gt;</span><br><span>&nbsp; &nbsp; &nbsp; </span><span class="CertTheme__tokenOperator">&lt;</span><span class="CertTheme__tokenOperator">/</span><span>View</span><span class="CertTheme__tokenOperator">&gt;</span><br><span>&nbsp; &nbsp; </span><span class="CertTheme__tokenPunctuation">)</span><span class="CertTheme__tokenPunctuation">;</span><br><span>&nbsp; </span><span class="CertTheme__tokenPunctuation">}</span><br><span class="CertTheme__tokenPunctuation">}</span><br><br><span class="CertTheme__tokenAttr">const</span><span> styles </span><span class="CertTheme__tokenOperator">=</span><span> StyleSheet</span><span class="CertTheme__tokenPunctuation">.</span><span class="CertTheme__tokenFunction">create</span><span class="CertTheme__tokenPunctuation">(</span><span class="CertTheme__tokenPunctuation">{</span><br><span>&nbsp; container</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenPunctuation">{</span><br><span>&nbsp; &nbsp; flex</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenProperty">1</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; &nbsp; backgroundColor</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenSelector">'#f5fcff'</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; &nbsp; alignItems</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenSelector">'center'</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; &nbsp; justifyContent</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenSelector">'center'</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; </span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; image</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenPunctuation">{</span><br><span>&nbsp; &nbsp; margin</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenProperty">5</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; &nbsp; borderRadius</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenProperty">5</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; &nbsp; width</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenProperty">300</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; &nbsp; height</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenProperty">300</span><br><span>&nbsp; </span><span class="CertTheme__tokenPunctuation">}</span><br><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenPunctuation">)</span><span class="CertTheme__tokenPunctuation">;</span></pre></div></div><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><br></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">10. What is state in the React component?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>State is another way apart from props by which we can modify a React component. React component’s state value changes in the life cycle of component, unlike props. We should not directly change state value of react component. React framework gives the setState method by which state of a component should be changed.</p><p><img alt="React framework" loading="lazy" width="100" height="100" decoding="async"  class="fr-fic fr-dib" style="color:transparent;width:100%;height:auto;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url(&quot;data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http%3A//www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage preserveAspectRatio='none' filter='url(%23b)' x='0' y='0' height='100%25' width='100%25' href='data:image/svg+xml;base64,CiAgPHN2ZyB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPgogICAgICA8bGluZWFyR3JhZGllbnQgaWQ9ImciPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNjY2MiIG9mZnNldD0iMjAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNkZGQiIG9mZnNldD0iNTAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNlZWUiIG9mZnNldD0iNzAlIiAvPgogICAgICA8L2xpbmVhckdyYWRpZW50PgogICAgPC9kZWZzPgogICAgPHJlY3Qgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9IiNlZWUiIC8+CiAgICA8cmVjdCBpZD0iciIgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9InVybCgjZykiIC8+CiAgICA8YW5pbWF0ZSB4bGluazpocmVmPSIjciIgYXR0cmlidXRlTmFtZT0ieCIgZnJvbT0iLTEwMCIgdG89IjEwMCIgZHVyPSIxcyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiICAvPgogIDwvc3ZnPg=='/%3E%3C/svg%3E&quot;)" sizes="(min-width: 767px) 50vw, 100vw" srcSet="" src="https://images.unsplash.com/photo-1517245386807-bb43f82c33c4?ixlib=rb-4.0.3&auto=format&fit=crop&w=1000&q=80"></p><div class="jsx-189f2d4cbe17d436 code-block-wrapper mt-spacing10 mb-[16.8px] md:mb-[24px] bg-black p-4 rounded-[12px] relative text-[#708090] overflow-hidden"><div class="jsx-189f2d4cbe17d436 absolute top-4 right-4 z-10"><div class="jsx-189f2d4cbe17d436 px-spacing12 bg-white rounded-full h-10 flex items-center cursor-pointer"><i class="jsx-189f2d4cbe17d436 text-black text-sm icon-copy"></i></div></div><div class="jsx-189f2d4cbe17d436 overflow-x-auto pb-[12px] w-full"><pre id="code-block-lqt9a22t7" class="jsx-189f2d4cbe17d436 whitespace-pre-wrap break-words w-full font-mono text-sm">import React from 'react';
import { View, Text, StyleSheet, TouchableOpacity } from 'react-native';

class Counter extends React.Component {
&nbsp; &nbsp; state = { count: 0 };
&nbsp; &nbsp; increment = () =&gt; this.setState({count: this.state.count + 1});
&nbsp; &nbsp; decrement = () =&gt; this.setState({count: this.state.count - 1});
&nbsp; &nbsp; render() {
&nbsp; &nbsp; &nbsp; &nbsp; return (
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;View style={styles.container}&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;TouchableOpacity onPress={this.decrement}&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;Text style={styles.text}&gt;-&lt;/Text&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;/TouchableOpacity&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;Text style={styles.text}&gt;{this.state.count}&lt;/Text&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;TouchableOpacity onPress={this.increment}&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;Text style={styles.text}&gt;+&lt;/Text&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;/TouchableOpacity&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;/View&gt;
&nbsp; &nbsp; &nbsp; &nbsp; );
&nbsp; &nbsp; }
};
const styles = StyleSheet.create({
&nbsp; &nbsp; container: {
&nbsp; &nbsp; &nbsp; &nbsp; flexDirection: 'row',
&nbsp; &nbsp; &nbsp; &nbsp; borderRadius: 5,
&nbsp; &nbsp; &nbsp; &nbsp; borderWidth: 1,
&nbsp; &nbsp; &nbsp; &nbsp; borderColor: '#1a91b8',
&nbsp; &nbsp; &nbsp; &nbsp; padding: 5,
&nbsp; &nbsp; &nbsp; &nbsp; backgroundColor: '#eaf7fd'
&nbsp; &nbsp; },
&nbsp; &nbsp; text: {
&nbsp; &nbsp; &nbsp; &nbsp; color: '#015169',
&nbsp; &nbsp; &nbsp; &nbsp; fontWeight: 'bold',
&nbsp; &nbsp; &nbsp; &nbsp; fontSize: 20,
&nbsp; &nbsp; &nbsp; &nbsp; padding: 15
&nbsp; &nbsp; }
});
export default Counter;</pre></div></div><p>Above code is an implementation of a counter component. This component has a state count whose value is changed by clicking on the plus (+) and minus (-) button. As the state count of this component is changing the number displayed on UI is also changing. Whenever we create any component in React, first we divide the screen in the component then decide what state a component should have. The beauty of this component is that it is an independent component and can be used anywhere in the application. That is how we make several fully functional component in React to build the complete application.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">11. How do you start the React Native app development?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p></p><p>Starting a project from scratch is always a little bit harder that is why there are some tooling available which we can use to bootstrap a React Native project.</p><ul><li class="CertTheme__listItem pt-spacing10">Using react-native-cli (<a href="https://www.npmjs.com/package/react-native-cli" rel="nofollow" target="_blank">https://www.npmjs.com/package/react-native-cli</a>)<ul><li class="CertTheme__listItem pt-spacing10">react-native-cli created a pure react native application as it doesn’t hide any piece of code in the generated project. You can see ios and android folder in a directory structure. Although, you don’t need to modify anything inside generated ios and android folder, They are required to run React native application successfully on the device.</li></ul></li><li class="CertTheme__listItem pt-spacing10">Using expo-cli (<a href="https://www.npmjs.com/package/expo-cli" rel="nofollow" target="_blank">https://www.npmjs.com/package/expo-cli</a>)<ul><li class="CertTheme__listItem pt-spacing10">Expo-Cli is a third party tooling which provides base files and easy setup steps to start React Native app development. It also provides barcode based steps to share the app with other team members. The downside of bootstrapping React native app with expo cli is the size of the basic app is considerably big as expo cli includes few expo based libraries with the app.</li></ul></li></ul><p></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">12. Why do you need to install watchman software when setting up a development environment for React Native on MacOS?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB"><strong>Introduction</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Watchman is an open-source project developed by Facebook that monitors files and tracks changes.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB"><strong>Functionality</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:&nbsp;</strong>It can trigger actions based on file changes.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB"><strong>Hot Reloading in React Native</strong></span><strong><span data-contrast="auto" lang="EN-GB">:</span></strong><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}"><strong>&nbsp;</strong></span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Watchman powers the hot reloading feature in React Native.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Hot reloading allows developers to see changes&nbsp;immediately&nbsp;without recompiling the entire project.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">This feature speeds up development compared to traditional native mobile application development, which requires manual recompilation.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB"><strong>Automation</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> When a developer makes changes in a React Native project file, Watchman detects the changes and triggers an automatic build, reflecting updates without manual intervention.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB"><strong>Developer Benefits</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> The hot reloading feature makes React Native a developer-friendly framework, accelerating the development process.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB"><strong>Setup</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Installation of Watchman is included in the React Native environment setup instructions.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">13. How do you style your React Native component?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>Every React Native component like View, Text, Image etc… accepts a style prop which is an object of CSS rules. The only difference between CSS rules and CSS object used in React Native is key in CSS object has CSS rules in camelCase, for example, CSS rule background-colour will become backgroundColour in React Native. There are few restrictions over values of some CSS rules. But still, available CSS rules are enough to style a mobile app UI beautifully. React Native supports CSS flexbox to build UI layouts. We style our mobile screen like below snippet:</p><div class="jsx-189f2d4cbe17d436 code-block-wrapper mt-spacing10 mb-[16.8px] md:mb-[24px] bg-black p-4 rounded-[12px] relative text-[#708090] overflow-hidden"><div class="jsx-189f2d4cbe17d436 absolute top-4 right-4 z-10"><div class="jsx-189f2d4cbe17d436 px-spacing12 bg-white rounded-full h-10 flex items-center cursor-pointer"><i class="jsx-189f2d4cbe17d436 text-black text-sm icon-copy"></i></div></div><div class="jsx-189f2d4cbe17d436 overflow-x-auto pb-[12px] w-full"><pre id="code-block-p75zlftdb" class="jsx-189f2d4cbe17d436 whitespace-pre-wrap break-words w-full font-mono text-sm">const styles = StyleSheet.create({
&nbsp; &nbsp;container: {
&nbsp; &nbsp; &nbsp; &nbsp;flexDirection: 'row',
&nbsp; &nbsp; &nbsp; &nbsp;borderRadius: 5,
&nbsp; &nbsp; &nbsp; &nbsp;borderWidth: 1,
&nbsp; &nbsp; &nbsp; &nbsp;borderColor: '#1a91b8',
&nbsp; &nbsp; &nbsp; &nbsp;padding: 5,
&nbsp; &nbsp; &nbsp; &nbsp;backgroundColor: '#eaf7fd'
&nbsp; &nbsp;},
&nbsp; &nbsp;text: {
&nbsp; &nbsp; &nbsp; &nbsp;color: '#015169',
&nbsp; &nbsp; &nbsp; &nbsp;fontWeight: 'bold',
&nbsp; &nbsp; &nbsp; &nbsp;fontSize: 20,
&nbsp; &nbsp; &nbsp; &nbsp;padding: 15
&nbsp; &nbsp;}
});
Then we can use these style with View component like below:
&lt;View style={styles.container}&gt;&lt;/View&gt;</pre></div></div><p>Stylesheet object is provided by React native library which has the method “create”. It takes an argument of type object and this object is the collection of CSS rules. As you can see in the above example, font-size CSS property in the web becomes font size in React native and flex-direction becomes flexDirection. I hope you got the idea about styling in React native application development. You can find the complete code on <a href="https://gist.github.com/PavanKu/98f92103af84faaf540aa348cf1a1126" rel="nofollow" target="_blank">https://gist.github.com/PavanKu/98f92103af84faaf540aa348cf1a1126</a></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">14. How do you handle elements size in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>React native follows the box-model concept of CSS. The size of the element is calculated based on the size of content, padding, border, margin. The simplest way to set the size of an element is to set width and height CSS property for an element. All dimensions in React Native is unitless and represent density-independent pixels. By setting fixed height and width, the element will look exactly the same size on different screen sizes. But there is an instance where you want to give the width and height of an element in percentage.&nbsp;</p><p>Directly use of percentage is not supported in React native but React native does give a dimension module which can be used to give width in percentage. Dimension module gives the width and height of the mobile device. This information can be used to set the style of an element in runtime. Below is the example of how to use Dimension module from React native:</p><div class="jsx-189f2d4cbe17d436 code-block-wrapper mt-spacing10 mb-[16.8px] md:mb-[24px] bg-black p-4 rounded-[12px] relative text-[#708090] overflow-hidden"><div class="jsx-189f2d4cbe17d436 absolute top-4 right-4 z-10"><div class="jsx-189f2d4cbe17d436 px-spacing12 bg-white rounded-full h-10 flex items-center cursor-pointer"><i class="jsx-189f2d4cbe17d436 text-black text-sm icon-copy"></i></div></div><div class="jsx-189f2d4cbe17d436 overflow-x-auto pb-[12px] w-full"><pre id="code-block-wrq2l4k8e" class="jsx-189f2d4cbe17d436 whitespace-pre-wrap break-words w-full font-mono text-sm">Importing module from React Native:
import { Dimension } from ‘react-native’;
Figure out width and height of the device:
const deviceWidth = Dimension.get(“window”).width;
const deviceHeight = Dimension.get(“window”).height;
Calculate the style value:
Width: deviceWidth*&lt;percentageValue&gt;/100</pre></div></div><p>But the simplest way is by setting width and height CSS for an element.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">15. How CSS flexbox is used to layout a React Native UI</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">By default, the View&nbsp;component&nbsp;in React Native has its display property set to&nbsp;flex. Flex is a CSS property used to expand and shrink components dynamically based on available space. Setting&nbsp;flex: 1&nbsp;on a&nbsp;component&nbsp;makes it take up all the available space. If a parent element has&nbsp;flex: 1, its child elements will evenly distribute the available space among themselves.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB">The width of a child element can be adjusted by assigning it a higher&nbsp;flex&nbsp;value; the larger the value, the more space the&nbsp;component&nbsp;will take relative to its siblings. However, for a&nbsp;component&nbsp;to expand, its parent must have dimensions greater than zero. If the parent element's dimensions are not set, the flex property will not work, and the element will not be visible on the UI.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB">In addition to the&nbsp;flex&nbsp;property,&nbsp;align-items&nbsp;and&nbsp;justify-content&nbsp;CSS properties are also used to design mobile UIs in React Native.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">16. What are the differences between Flexbox in browser and Flexbox in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>CSS Flexbox is used to design a responsive layout easily without using float or position CSS property. Float and position values were used to build any type of UI which are not very easy. Flexbox is added in CSS3. Flexbox is designed to provide a consistent layout on different screen sizes. You will normally use a combination of flexDirection, alignItems, and justify-content to achieve the right layout.&nbsp;</p><p>There are few differences in default values of few flex based CSS properties between React Native and on the browser. The default value of flexDirection is a row in the web but in case of React native, its default value is a column. Also, flex parameter only supports a single number in React native. Flexbox alignItems has few more values like flex-start which start aligning element from start and opposite of this is flex-end which places the first child element at the end. Similar to alignItems, justifyContents also have values which behaves where much similar to flexbox behaviour in a web browser.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">17. How does justifyContent flexBox property work?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p></p><p>JustifyContent property aligns the flexible container's items when the items do not use all available space on the main axis. By default, the main axis is a vertical axis in case of React native. Which means justifyContent property aligns child elements of flex parent vertically in React native. &nbsp;We can use this property to layout elements in a flex container. JustifyContent supports the following values: flex-start|flex-end|centre|space-between|space-around|initial|inherit; It also apply some control over the alignment of items when they overflow the line. Let me explain JustifyContent’s values:</p><ul><li class="CertTheme__listItem pt-spacing10"><span style="color:rgb(0, 0, 0)"><strong>flex-start: </strong></span>this is the default value for justifyContent. It means that flex items will start from the top and evenly distributed vertically.</li><li class="CertTheme__listItem pt-spacing10"><span style="color:rgb(0, 0, 0)"><strong>Flex-end:</strong></span> this is just the opposite behaviour of flex-start. Elements start rendering from the bottom</li><li class="CertTheme__listItem pt-spacing10"><span style="color:rgb(0, 0, 0)"><strong>Center:</strong></span> Items will be placed in the middle</li><li class="CertTheme__listItem pt-spacing10"><span style="color:rgb(0, 0, 0)"><strong>Space-between: </strong></span>elements are evenly distributed along the main axis (vertical axis)</li><li class="CertTheme__listItem pt-spacing10"><span style="color:rgb(0, 0, 0)"><strong>Space-around: </strong></span>flex items will be evenly distributed with equal space around them</li></ul><p></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">18. How does alignItems flexBox property works?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p></p><p>You can think of alignItems as justifyContent behaviour for cross axis. Cross-axis in case if React native is the horizontal axis. CSS alignItems property sets the alignSelf value on all direct children as a group. In Flexbox, it controls the alignment of items on the cross axis. By default, the cross axis is a horizontal axis in case of React native. We can use this property to layout elements in the flex container. The alignItems property supports following values: stretch|center|flex-start|flex-end|baseline|initial|inherit; &nbsp;Let me explain alignItems values:</p><ul><li class="CertTheme__listItem pt-spacing10"><span style="color:rgb(0, 0, 0)"><strong>flex-start:</strong></span> this is the default value for alignItems. It means that flex items will start from the left and evenly distributed horizontally.</li><li class="CertTheme__listItem pt-spacing10"><span style="color:rgb(0, 0, 0)"><strong>Flex-end:</strong></span> this is just the opposite behaviour of flex-start. Elements start rendering from the right and go up to the left end.</li><li class="CertTheme__listItem pt-spacing10"><span style="color:rgb(0, 0, 0)"><strong>Center:</strong></span> Items will be placed in the middle</li><li class="CertTheme__listItem pt-spacing10"><span style="color:rgb(0, 0, 0)"><strong>Space-between: </strong></span>elements are evenly distributed along the cross axis (horizontal &nbsp;axis)</li><li class="CertTheme__listItem pt-spacing10"><span style="color:rgb(0, 0, 0)"><strong>Space-around: </strong></span>flex items will be evenly distributed with equal space around them</li></ul><p></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">19. How can we change the default behaviour of the main axis and cross axis of flexbox layout?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>By default, the main axis is the vertical axis and cross axis is the horizontal axis in React native. Since justifyContent and alignItems property works based on the main axis and cross axis, so justifyContent will align flex items vertically and alignItems will layout flex item horizontally. This default value of the main axis and cross axis can be changed by changing flexDirection property. If we set flexDirection to row in the flex container then the main axis will become horizontal axis and cross axis will become vertical axis.&nbsp;</p><p>On changing default behaviour via flexDirection CSS property, the behaviour of alignItems and justifyContent will also get switched. The Concept of flexDirection is also present on the web. Flexbox is implemented as a single direction layout technique and this direction is managed by flexDirection CSS property. Apart from row and column, the flexDirection property has two more values: row-reverse and column-reverse. As the name suggests, the direction will remain horizontal and vertical but the direction will get changed.</p><p>Transitions are an important feature of mobile devices. So, this is one of the most frequently asked React Native interview questions and answers for senior developer in recent times.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">20. What all CSS properties are not supported by React native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Though most of the CSS properties works in the same way in React native still there are few differences in CSS property values between a browser and React native:</span></p><ol class="CertTheme__ol1 pt-spacing10"><li value="1" class="CertTheme__listItem pt-spacing10"><span>Only two values of CSS property display (none, flex) is supported in React native. display none is used to hide an element.</span></li><li value="2" class="CertTheme__listItem pt-spacing10"><span>aspectRatio is non-CSS property supported by React Native. we can use aspect ratio to give a size to an element. if either width or height is specified along with aspect ratio then other parameters will be calculated and applied based on aspect ratio value</span></li><li value="3" class="CertTheme__listItem pt-spacing10"><span>marginHorizontal has the same effect as setting both marginLeft and marginRight. Similar to marginHorizontal, marginVertical has the same effect as setting both marginTop and marginBottom.</span></li><li value="4" class="CertTheme__listItem pt-spacing10"><span>The default value of the position in React native is relative instead of static. so absolute positioning is always just relative to the parent.</span></li></ol><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Apart from the above difference, most of the CSS properties work exactly the same as they work in a browser.</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">21. What are the ways to write react components?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>here are two ways of writing a react component</p><ul><li class="CertTheme__listItem pt-spacing10">Functional component<ul><li class="CertTheme__listItem pt-spacing10">It uses a simple function which returns the JSX</li></ul></li><li class="CertTheme__listItem pt-spacing10">Class-based component<ul><li class="CertTheme__listItem pt-spacing10">It used the class keyword introduced in ES6. it implements render lifecycle method which returns the JSX.</li></ul></li></ul><p>Example of functional component</p><p><img alt="Functional component" loading="lazy" width="100" height="100" decoding="async"  class="fr-fic fr-dib" style="color:transparent;width:100%;height:auto;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url(&quot;data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http%3A//www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage preserveAspectRatio='none' filter='url(%23b)' x='0' y='0' height='100%25' width='100%25' href='data:image/svg+xml;base64,CiAgPHN2ZyB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPgogICAgICA8bGluZWFyR3JhZGllbnQgaWQ9ImciPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNjY2MiIG9mZnNldD0iMjAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNkZGQiIG9mZnNldD0iNTAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNlZWUiIG9mZnNldD0iNzAlIiAvPgogICAgICA8L2xpbmVhckdyYWRpZW50PgogICAgPC9kZWZzPgogICAgPHJlY3Qgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9IiNlZWUiIC8+CiAgICA8cmVjdCBpZD0iciIgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9InVybCgjZykiIC8+CiAgICA8YW5pbWF0ZSB4bGluazpocmVmPSIjciIgYXR0cmlidXRlTmFtZT0ieCIgZnJvbT0iLTEwMCIgdG89IjEwMCIgZHVyPSIxcyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiICAvPgogIDwvc3ZnPg=='/%3E%3C/svg%3E&quot;)" sizes="(min-width: 767px) 50vw, 100vw" srcSet="" src="https://images.unsplash.com/photo-1516321318423-f06f85e504b3?ixlib=rb-4.0.3&auto=format&fit=crop&w=1000&q=80"></p><p dir="ltr">Example of class-based component</p><p dir="ltr"><img alt="Class-based component" loading="lazy" width="100" height="100" decoding="async"  class="fr-fic fr-dib" style="color:transparent;width:100%;height:auto;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url(&quot;data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http%3A//www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage preserveAspectRatio='none' filter='url(%23b)' x='0' y='0' height='100%25' width='100%25' href='data:image/svg+xml;base64,CiAgPHN2ZyB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPgogICAgICA8bGluZWFyR3JhZGllbnQgaWQ9ImciPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNjY2MiIG9mZnNldD0iMjAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNkZGQiIG9mZnNldD0iNTAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNlZWUiIG9mZnNldD0iNzAlIiAvPgogICAgICA8L2xpbmVhckdyYWRpZW50PgogICAgPC9kZWZzPgogICAgPHJlY3Qgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9IiNlZWUiIC8+CiAgICA8cmVjdCBpZD0iciIgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9InVybCgjZykiIC8+CiAgICA8YW5pbWF0ZSB4bGluazpocmVmPSIjciIgYXR0cmlidXRlTmFtZT0ieCIgZnJvbT0iLTEwMCIgdG89IjEwMCIgZHVyPSIxcyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiICAvPgogIDwvc3ZnPg=='/%3E%3C/svg%3E&quot;)" sizes="(min-width: 767px) 50vw, 100vw" srcSet="" src="https://images.unsplash.com/photo-1504868584819-f8e8b4ecca53?ixlib=rb-4.0.3&auto=format&fit=crop&w=1000&q=80"></p><div class="jsx-189f2d4cbe17d436 code-block-wrapper mt-spacing10 mb-[16.8px] md:mb-[24px] bg-black p-4 rounded-[12px] relative text-[#708090] overflow-hidden"><div class="jsx-189f2d4cbe17d436 absolute top-4 right-4 z-10"><div class="jsx-189f2d4cbe17d436 px-spacing12 bg-white rounded-full h-10 flex items-center cursor-pointer"><i class="jsx-189f2d4cbe17d436 text-black text-sm icon-copy"></i></div></div><div class="jsx-189f2d4cbe17d436 overflow-x-auto pb-[12px] w-full"><pre id="code-block-cwcir1zvo" class="jsx-189f2d4cbe17d436 whitespace-pre-wrap break-words w-full font-mono text-sm">/* Class based component */
import React, { Component } from 'react';
import { Text } from 'react-native';

export default class Greeting extends Component {
&nbsp; &nbsp; render() {
&nbsp; &nbsp; &nbsp; &nbsp; return (
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;Text&gt;Hello {this.props.name} !&lt;/Text&gt;
&nbsp; &nbsp; &nbsp; &nbsp; );
&nbsp; &nbsp; }
}

/* Functional component */
import React, { Component } from 'react';
import { Text } from 'react-native';

export default function Greeting(props) {
&nbsp; &nbsp; &nbsp; &nbsp; return (
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;Text&gt;Hello {props.name} !&lt;/Text&gt;
&nbsp; &nbsp; &nbsp; &nbsp; );
}</pre></div></div><p>cases are known as a presentational or dumb component. The functional component gets information via props from its parent component and renders the information. You can see that the functional component accepts props as an argument. ES6 arrow function also is used to define a functional component. The functional component doesn’t store any state and also doesn’t override any lifecycle method of React component. The class-based component has the ability to store state within the component and based on its state value behave differently. The latest version of React 16.8 has included a new feature called React hooks by which we can add state in a functional component.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">22. What is the difference between a functional component and a class-based component?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" data-mode="standard"><br></p><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Though we can implement in both functional and class-based way, there are few fundamental differences between the two of them:</span></p><ol class="CertTheme__ol1 pt-spacing10"><li value="1" class="CertTheme__listItem pt-spacing10"><span>Functional component can’t have stated ( before React hooks era ). It renders component only based on props passed. A class-based component can have a local state which can be helpful in building a bigger component</span></li><li value="2" class="CertTheme__listItem pt-spacing10"><span>Functional component access directly via props argument passed. In a class-based component, props are accessible via this.props.</span></li><li value="3" class="CertTheme__listItem pt-spacing10"><span>A class-based component is a more complex structure. It is an instance of a class derived from React. Component class. The class must implement a render() member function which returns a React component to be rendered</span></li><li value="4" class="CertTheme__listItem pt-spacing10"><span>The class-based component can also use lifecycle methods but functional component can’t use lifecycle methods.</span></li><li value="5" class="CertTheme__listItem pt-spacing10"><span>Functional components are a very light weighted component in comparison to class-based react component</span></li></ol><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><br></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">23. Give a quick overview of the life cycle of a React component?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" data-mode="standard"><br></p><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Below image summarise the lifecycle methods exposed by react component and the order in which lifecycle methods are being called by React.</span></p><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><img alt="life cycle of a React component" loading="lazy" width="100" height="100" decoding="async"  class="" style="color:transparent;width:100%;height:auto;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url(&quot;data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http%3A//www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage preserveAspectRatio='none' filter='url(%23b)' x='0' y='0' height='100%25' width='100%25' href='data:image/svg+xml;base64,CiAgPHN2ZyB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPgogICAgICA8bGluZWFyR3JhZGllbnQgaWQ9ImciPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNjY2MiIG9mZnNldD0iMjAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNkZGQiIG9mZnNldD0iNTAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNlZWUiIG9mZnNldD0iNzAlIiAvPgogICAgICA8L2xpbmVhckdyYWRpZW50PgogICAgPC9kZWZzPgogICAgPHJlY3Qgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9IiNlZWUiIC8+CiAgICA8cmVjdCBpZD0iciIgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9InVybCgjZykiIC8+CiAgICA8YW5pbWF0ZSB4bGluazpocmVmPSIjciIgYXR0cmlidXRlTmFtZT0ieCIgZnJvbT0iLTEwMCIgdG89IjEwMCIgZHVyPSIxcyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiICAvPgogIDwvc3ZnPg=='/%3E%3C/svg%3E&quot;)" sizes="(min-width: 767px) 50vw, 100vw" srcSet="" src="https://images.unsplash.com/photo-1531538398863-7fc8db5d8f63?ixlib=rb-4.0.3&auto=format&fit=crop&w=1000&q=80"></p><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>React 16 was a major release for ReactJS. With this version react has marked some of the lifecycle methods like componentWillRecieveProps, ComponentWillUpdate as deprecated. In a later release of React, the framework will be removing these methods. In place of deprecated methods, they added a few new lifecycle methods. The above picture shows the lifecycle method of a component. We can divide the lifecycle methods of the component into three categories.</span></p><ul class="CertTheme__ul"><li value="1" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Mounting:</strong></b><span> This includes the beginning phase of the component. The first constructor of the component gets invoked. Constructor receives props as an argument from the parent component. Constructor is the place where we define an initial state of a component. After constructor and before render, lifecycle method getDrivedStateFromProps is invoked, it returns the state object or null to avoid the render. Then Render method is invoked which renders the JSX. Then at the end, componentDidMount is invoked.</span></li><li value="2" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Updating:</strong></b><span> A component gets an update via a change in state or change in props. In both of these cases, the getDrivedStateFromProps method is invoked first where we get props and state as an argument and returns updated state. Then shouldComponentUpdate methods are invoked. If this method returns true then the only component gets the update otherwise component update is aborted. Then render method is called and after this getSnapshotBeforeUpdate is called. In the end, the componentDidUpdate method is called</span></li><li value="3" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Unmounting:</strong></b><span> componentWillUnmount lifecycle method is invoked before the unmounting of the component takes place.</span></li></ul><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><br></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">24. How do you create basic text input to React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>TextInput is provided by React native framework to implement simple text input control. Text input is one of the very basic controls of UI. Whether it is auto-complete, form, text input is a must used control in UI of application. TextInput component accepts placeholder value as props. When a user starts changing the text then the onChangeText event is triggered and when the user is done editing and hit return button, onSubmitEditing props will get invoked. TextInput component can be styled by setting style props to the component. Here is an example of the implementation of simple text input in React native:</span></p><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><img alt=" basic text input to React Native" loading="lazy" width="100" height="100" decoding="async"  class="" style="color:transparent;width:100%;height:auto;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url(&quot;data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http%3A//www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage preserveAspectRatio='none' filter='url(%23b)' x='0' y='0' height='100%25' width='100%25' href='data:image/svg+xml;base64,CiAgPHN2ZyB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPgogICAgICA8bGluZWFyR3JhZGllbnQgaWQ9ImciPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNjY2MiIG9mZnNldD0iMjAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNkZGQiIG9mZnNldD0iNTAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNlZWUiIG9mZnNldD0iNzAlIiAvPgogICAgICA8L2xpbmVhckdyYWRpZW50PgogICAgPC9kZWZzPgogICAgPHJlY3Qgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9IiNlZWUiIC8+CiAgICA8cmVjdCBpZD0iciIgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9InVybCgjZykiIC8+CiAgICA8YW5pbWF0ZSB4bGluazpocmVmPSIjciIgYXR0cmlidXRlTmFtZT0ieCIgZnJvbT0iLTEwMCIgdG89IjEwMCIgZHVyPSIxcyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiICAvPgogIDwvc3ZnPg=='/%3E%3C/svg%3E&quot;)" sizes="(min-width: 767px) 50vw, 100vw" srcSet="" src="https://images.unsplash.com/photo-1552664730-d307ca884978?ixlib=rb-4.0.3&auto=format&fit=crop&w=1000&q=80"></p><div class="jsx-189f2d4cbe17d436 code-block-wrapper mt-spacing10 mb-[16.8px] md:mb-[24px] bg-black p-4 rounded-[12px] relative text-[#708090] overflow-hidden"><div class="jsx-189f2d4cbe17d436 absolute top-4 right-4 z-10"><div class="jsx-189f2d4cbe17d436 px-spacing12 bg-white rounded-full h-10 flex items-center cursor-pointer"><i class="jsx-189f2d4cbe17d436 text-black text-sm icon-copy"></i></div></div><div class="jsx-189f2d4cbe17d436 overflow-x-auto pb-[12px] w-full"><pre id="code-block-4jx6q27kx" class="jsx-189f2d4cbe17d436 whitespace-pre-wrap break-words w-full font-mono text-sm"><span class="CertTheme__tokenAttr">import</span><span> React </span><span class="CertTheme__tokenAttr">from</span><span> </span><span class="CertTheme__tokenSelector">'react'</span><span class="CertTheme__tokenPunctuation">;</span><br><span class="CertTheme__tokenAttr">import</span><span> </span><span class="CertTheme__tokenPunctuation">{</span><span> View</span><span class="CertTheme__tokenPunctuation">,</span><span> Text</span><span class="CertTheme__tokenPunctuation">,</span><span> TextInput</span><span class="CertTheme__tokenPunctuation">,</span><span> StyleSheet </span><span class="CertTheme__tokenPunctuation">}</span><span> </span><span class="CertTheme__tokenAttr">from</span><span> </span><span class="CertTheme__tokenSelector">"react-native"</span><span class="CertTheme__tokenPunctuation">;</span><br><br><span class="CertTheme__tokenAttr">class</span><span> </span><span class="CertTheme__tokenFunction">SimpleTextInput</span><span> </span><span class="CertTheme__tokenAttr">extends</span><span> </span><span class="CertTheme__tokenFunction">React</span><span class="CertTheme__tokenPunctuation">.</span><span class="CertTheme__tokenFunction">Component</span><span> </span><span class="CertTheme__tokenPunctuation">{</span><br><span>&nbsp; &nbsp; </span><span class="CertTheme__tokenFunction">constructor</span><span class="CertTheme__tokenPunctuation">(</span><span>props</span><span class="CertTheme__tokenPunctuation">)</span><span> </span><span class="CertTheme__tokenPunctuation">{</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; </span><span class="CertTheme__tokenAttr">super</span><span class="CertTheme__tokenPunctuation">(</span><span>props</span><span class="CertTheme__tokenPunctuation">)</span><span class="CertTheme__tokenPunctuation">;</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; </span><span class="CertTheme__tokenAttr">this</span><span class="CertTheme__tokenPunctuation">.</span><span>state </span><span class="CertTheme__tokenOperator">=</span><span> </span><span class="CertTheme__tokenPunctuation">{</span><span> </span><span>text</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenSelector">''</span><span class="CertTheme__tokenPunctuation">,</span><span> </span><span>isSubmitted</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenProperty">false</span><span> </span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenPunctuation">;</span><br><span>&nbsp; &nbsp; </span><span class="CertTheme__tokenPunctuation">}</span><br><span>&nbsp; &nbsp; </span><span>handleChangeText</span><span> </span><span class="CertTheme__tokenOperator">=</span><span> </span><span class="CertTheme__tokenPunctuation">(</span><span>text</span><span class="CertTheme__tokenPunctuation">)</span><span> </span><span class="CertTheme__tokenOperator">=&gt;</span><span> </span><span class="CertTheme__tokenPunctuation">{</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; </span><span class="CertTheme__tokenAttr">this</span><span class="CertTheme__tokenPunctuation">.</span><span class="CertTheme__tokenFunction">setState</span><span class="CertTheme__tokenPunctuation">(</span><span class="CertTheme__tokenPunctuation">{</span><span> text</span><span class="CertTheme__tokenPunctuation">,</span><span> </span><span>isSubmitted</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenProperty">false</span><span> </span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenPunctuation">)</span><span class="CertTheme__tokenPunctuation">;</span><br><span>&nbsp; &nbsp; </span><span class="CertTheme__tokenPunctuation">}</span><br><span>&nbsp; &nbsp; </span><span>handleSubmitText</span><span> </span><span class="CertTheme__tokenOperator">=</span><span> </span><span class="CertTheme__tokenPunctuation">(</span><span class="CertTheme__tokenPunctuation">)</span><span> </span><span class="CertTheme__tokenOperator">=&gt;</span><span> </span><span class="CertTheme__tokenPunctuation">{</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; </span><span class="CertTheme__tokenAttr">this</span><span class="CertTheme__tokenPunctuation">.</span><span class="CertTheme__tokenFunction">setState</span><span class="CertTheme__tokenPunctuation">(</span><span class="CertTheme__tokenPunctuation">{</span><span> </span><span>isSubmitted</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenProperty">true</span><span> </span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenPunctuation">)</span><span class="CertTheme__tokenPunctuation">;</span><br><span>&nbsp; &nbsp; </span><span class="CertTheme__tokenPunctuation">}</span><br><span>&nbsp; &nbsp; </span><span class="CertTheme__tokenFunction">render</span><span class="CertTheme__tokenPunctuation">(</span><span class="CertTheme__tokenPunctuation">)</span><span> </span><span class="CertTheme__tokenPunctuation">{</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; </span><span class="CertTheme__tokenAttr">const</span><span> </span><span class="CertTheme__tokenPunctuation">{</span><span> text</span><span class="CertTheme__tokenPunctuation">,</span><span> isSubmitted </span><span class="CertTheme__tokenPunctuation">}</span><span> </span><span class="CertTheme__tokenOperator">=</span><span> </span><span class="CertTheme__tokenAttr">this</span><span class="CertTheme__tokenPunctuation">.</span><span>state</span><span class="CertTheme__tokenPunctuation">;</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; </span><span class="CertTheme__tokenAttr">return</span><span> </span><span class="CertTheme__tokenPunctuation">(</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </span><span class="CertTheme__tokenOperator">&lt;</span><span>View style</span><span class="CertTheme__tokenOperator">=</span><span class="CertTheme__tokenPunctuation">{</span><span>styles</span><span class="CertTheme__tokenPunctuation">.</span><span>container</span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenOperator">&gt;</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </span><span class="CertTheme__tokenOperator">&lt;</span><span>TextInput</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; style</span><span class="CertTheme__tokenOperator">=</span><span class="CertTheme__tokenPunctuation">{</span><span>styles</span><span class="CertTheme__tokenPunctuation">.</span><span>input</span><span class="CertTheme__tokenPunctuation">}</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; placeholder</span><span class="CertTheme__tokenOperator">=</span><span class="CertTheme__tokenPunctuation">{</span><span class="CertTheme__tokenSelector">'Type here...'</span><span class="CertTheme__tokenPunctuation">}</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; onChangeText</span><span class="CertTheme__tokenOperator">=</span><span class="CertTheme__tokenPunctuation">{</span><span class="CertTheme__tokenAttr">this</span><span class="CertTheme__tokenPunctuation">.</span><span>handleChangeText</span><span class="CertTheme__tokenPunctuation">}</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; onSubmitEditing</span><span class="CertTheme__tokenOperator">=</span><span class="CertTheme__tokenPunctuation">{</span><span class="CertTheme__tokenAttr">this</span><span class="CertTheme__tokenPunctuation">.</span><span>handleSubmitText</span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenOperator">/</span><span class="CertTheme__tokenOperator">&gt;</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </span><span class="CertTheme__tokenOperator">&lt;</span><span>Text style</span><span class="CertTheme__tokenOperator">=</span><span class="CertTheme__tokenPunctuation">{</span><span>styles</span><span class="CertTheme__tokenPunctuation">.</span><span>text</span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenOperator">&gt;</span><span class="CertTheme__tokenPunctuation">{</span><span>isSubmitted</span><span class="CertTheme__tokenOperator">?</span><span>`</span><span class="CertTheme__tokenSelector">User has typed: </span><span>${</span><span>text</span><span>}</span><span>`</span><span class="CertTheme__tokenOperator">:</span><span class="CertTheme__tokenSelector">'User is typing'</span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenOperator">&lt;</span><span class="CertTheme__tokenOperator">/</span><span>Text</span><span class="CertTheme__tokenOperator">&gt;</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </span><span class="CertTheme__tokenOperator">&lt;</span><span class="CertTheme__tokenOperator">/</span><span>View</span><span class="CertTheme__tokenOperator">&gt;</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; </span><span class="CertTheme__tokenPunctuation">)</span><span class="CertTheme__tokenPunctuation">;</span><br><span>&nbsp; &nbsp; </span><span class="CertTheme__tokenPunctuation">}</span><br><span class="CertTheme__tokenPunctuation">}</span><br><span class="CertTheme__tokenAttr">const</span><span> styles </span><span class="CertTheme__tokenOperator">=</span><span> StyleSheet</span><span class="CertTheme__tokenPunctuation">.</span><span class="CertTheme__tokenFunction">create</span><span class="CertTheme__tokenPunctuation">(</span><span class="CertTheme__tokenPunctuation">{</span><br><span>&nbsp; &nbsp; container</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenPunctuation">{</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; alignSelf</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenSelector">'stretch'</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; margin</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenProperty">10</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; padding</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenProperty">10</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; borderColor</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenSelector">'#ccc'</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; borderWidth</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenProperty">1</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; borderRadius</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenProperty">5</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; backgroundColor</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenSelector">'#eaf7fd'</span><br><span>&nbsp; &nbsp; </span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; &nbsp; text</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenPunctuation">{</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; fontSize</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenProperty">14</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; fontWeight</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenSelector">'bold'</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; color</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenSelector">'#015169'</span><br><span>&nbsp; &nbsp; </span><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenPunctuation">,</span><br><span>&nbsp; &nbsp; input</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenPunctuation">{</span><br><span>&nbsp; &nbsp; &nbsp; &nbsp; height</span><span class="CertTheme__tokenOperator">:</span><span> </span><span class="CertTheme__tokenProperty">40</span><br><span>&nbsp; &nbsp; </span><span class="CertTheme__tokenPunctuation">}</span><br><span class="CertTheme__tokenPunctuation">}</span><span class="CertTheme__tokenPunctuation">)</span><span class="CertTheme__tokenPunctuation">;</span><br><br><span class="CertTheme__tokenAttr">export</span><span> </span><span class="CertTheme__tokenAttr">default</span><span> SimpleTextInput</span><span class="CertTheme__tokenPunctuation">;</span></pre></div></div><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>In the above example: we have a TextInput component whose value is controlled by the state. Which means our TextInput in above example is a controlled component. Once the user starts typing we update the state with an onChangeText method. Once the user submits the value, we display the value user has typed in the text box.</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">25. How do you create a basic button in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>React native provides Button component which displays platform specific button. Following example shows how we create a platform-specific default button in React native. Platform-specific button means that the look and feel on a button will depend on whether the application is running on IOS or Android. Button component exposes two main props: title and onPress. Title props are used to display text on the button. onPress props is a callback which is invoked when the user presses the button. This is very much similar to the click event on a web browser. We can’t style the Button component provided by React native.</p><p><img alt="Basic button in React Native" loading="lazy" width="100" height="100" decoding="async"  class="fr-fic fr-dib" style="color:transparent;width:100%;height:auto;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url(&quot;data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http%3A//www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage preserveAspectRatio='none' filter='url(%23b)' x='0' y='0' height='100%25' width='100%25' href='data:image/svg+xml;base64,CiAgPHN2ZyB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPgogICAgICA8bGluZWFyR3JhZGllbnQgaWQ9ImciPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNjY2MiIG9mZnNldD0iMjAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNkZGQiIG9mZnNldD0iNTAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNlZWUiIG9mZnNldD0iNzAlIiAvPgogICAgICA8L2xpbmVhckdyYWRpZW50PgogICAgPC9kZWZzPgogICAgPHJlY3Qgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9IiNlZWUiIC8+CiAgICA8cmVjdCBpZD0iciIgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9InVybCgjZykiIC8+CiAgICA8YW5pbWF0ZSB4bGluazpocmVmPSIjciIgYXR0cmlidXRlTmFtZT0ieCIgZnJvbT0iLTEwMCIgdG89IjEwMCIgZHVyPSIxcyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiICAvPgogIDwvc3ZnPg=='/%3E%3C/svg%3E&quot;)" sizes="(min-width: 767px) 50vw, 100vw" srcSet="" src="https://images.unsplash.com/photo-1497215968147-3f36c5df5ed3?ixlib=rb-4.0.3&auto=format&fit=crop&w=1000&q=80"></p><div class="jsx-189f2d4cbe17d436 code-block-wrapper mt-spacing10 mb-[16.8px] md:mb-[24px] bg-black p-4 rounded-[12px] relative text-[#708090] overflow-hidden"><div class="jsx-189f2d4cbe17d436 absolute top-4 right-4 z-10"><div class="jsx-189f2d4cbe17d436 px-spacing12 bg-white rounded-full h-10 flex items-center cursor-pointer"><i class="jsx-189f2d4cbe17d436 text-black text-sm icon-copy"></i></div></div><div class="jsx-189f2d4cbe17d436 overflow-x-auto pb-[12px] w-full"><pre id="code-block-skf2t28jg" class="jsx-189f2d4cbe17d436 whitespace-pre-wrap break-words w-full font-mono text-sm">import React from 'react';
import { View, Alert, Button, StyleSheet } from "react-native";

const SimpleButton = (props) =&gt; {
&nbsp; &nbsp; return ( &lt;Button style={styles.button} onPress={() =&gt; Alert.alert("You pressed button")} title="Click Me"/&gt; );
};

const styles = StyleSheet.create({
&nbsp; &nbsp; button: {
&nbsp; &nbsp; &nbsp; &nbsp; padding: 5,
&nbsp; &nbsp; &nbsp; &nbsp; color: '#000'
&nbsp; &nbsp; }
});

export default SimpleButton;</pre></div></div><p>Above example will show platform specific alert when the user presses the button. Alert is the component provided by React native framework to show platform specific modal. As I mentioned above that we can’t style Button component of React native, we can try this by changing the text colour of a button or changing the padding via style props but it won’t change the appearance of the button.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">26. How do you handle offline functionality in a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Handling offline functionality involves:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Data Storage</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Use libraries like Redux Persist or&nbsp;AsyncStorage&nbsp;to store data locally.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Synchronization</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Sync local data with the server when the connection is restored.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Fallback UI</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Provide fallback UI elements to inform users about the offline status.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">These techniques ensure the app&nbsp;remains&nbsp;functional and provides a smooth user experience even without an internet connection.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">27. What is the purpose of code splitting, and how do you achieve it in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Code splitting improves performance by loading only the necessary code for the current screen. It can be achieved using:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Dynamic Imports</span><span data-contrast="auto" lang="EN-GB">: Load components or modules only when needed.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">React.lazy&nbsp;and Suspense</span><span data-contrast="auto" lang="EN-GB">: Split code and load it asynchronously, reducing the&nbsp;initial&nbsp;bundle size.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">Code splitting helps optimize load times and enhances the app's performance by avoiding unnecessary code loading.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">28. How do you ensure the security of a React Native application?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Ensuring security involves several practices:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Secure Storage</strong></span><span data-contrast="auto" lang="EN-GB">: Use secure storage solutions for sensitive data.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Input Validation</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong>&nbsp;Validate&nbsp;and sanitize all user inputs to prevent injection attacks.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Authentication and Authorization</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Implement robust authentication mechanisms and restrict access to authorized users.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Dependency Management</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Keep dependencies updated to avoid known vulnerabilities.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">These practices help protect the application from common security threats and ensure data integrity.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">29. How do you manage app state using Redux Thunk or Redux Saga?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Managing app state can be done using:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Redux Thunk</span><span data-contrast="auto" lang="EN-GB">:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Allows writing action creators that return a function instead of an action.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Suitable for simple asynchronous logic like API calls.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Redux Saga</span><span data-contrast="auto" lang="EN-GB">:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Uses generator functions to handle side effects more efficiently.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Ideal for complex asynchronous workflows, allowing better control over execution flow.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">Both tools enhance state management in large applications by handling asynchronous actions effectively.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">30. How do you handle real-time updates in a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Handling real-time updates involves:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>WebSockets</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong>&nbsp;Establish&nbsp;a WebSocket connection for continuous data flow.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Firebase</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Use Firebase for real-time database synchronization and updates.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Polling</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Implement polling for periodic data fetching.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">These methods ensure the app stays updated with the latest data, providing a dynamic user experience.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">31. What is the significance of keys in a component in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Keys in React Native are crucial for:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Identification</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Help React&nbsp;identify&nbsp;which items have changed, are added, or are removed.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Performance</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Improve performance by enabling efficient re-rendering of lists.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Order Management</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Ensure elements are correctly ordered and&nbsp;maintained&nbsp;during updates.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">Keys should be unique to ensure React can manage&nbsp;component&nbsp;updates accurately.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">32. How do you manage app state using Redux Thunk or Redux Saga?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Managing app state can be done using:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Redux Thunk</strong></span><span data-contrast="auto" lang="EN-GB">:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Allows writing action creators that return a function instead of an action.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Suitable for simple asynchronous logic like API calls.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li></ul></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Redux Saga</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong></span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Uses generator functions to handle side effects more efficiently.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Ideal for complex asynchronous workflows, allowing better control over execution flow.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul></li></ul><p><span data-contrast="auto" lang="EN-GB">Both tools enhance state management in large applications by handling asynchronous actions effectively.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">33. Can React Native be used for building applications for TV?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Yes, React Native can be used for building TV applications:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>React Native for TV</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Extends the core framework to support TV devices like Apple TV and Android TV.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>TV-specific Components</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Provides components and navigation patterns tailored for TV interfaces.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">While React Native supports TV app development, community support and documentation are still evolving.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">34. What are Native Modules, and how do you use them in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Native Modules allow integrating custom native code into a React Native app:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Custom Code</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Write native code in Java (Android) or Objective-C/Swift (iOS).</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>JavaScript Bridge</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Expose native functionalities to JavaScript through the bridge.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Integration</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Use NativeModules to access and utilize native modules in the React Native app.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">Native Modules provide flexibility to&nbsp;leverage&nbsp;platform-specific features and&nbsp;optimize&nbsp;performance.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">35. How do you integrate third-party libraries with React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Integrating third-party libraries involves:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Installation</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Use&nbsp;npm&nbsp;or yarn to install the library.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Linking</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Use react-native link or manually link the library if needed.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Configuration</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Follow the library's setup instructions for configuration and usage.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">These steps ensure the library is correctly integrated and functional within the React Native app.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">36. What is the state in the React component?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">The state is another way apart from props by which we can&nbsp;modify&nbsp;a React&nbsp;component. React component’s state value changes in the life cycle of the&nbsp;component, unlike props. We should not directly change the state value of the react&nbsp;component. React framework gives the&nbsp;setState&nbsp;method by which the state of a&nbsp;component&nbsp;should be changed.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p><div class="jsx-189f2d4cbe17d436 code-block-wrapper mt-spacing10 mb-[16.8px] md:mb-[24px] bg-black p-4 rounded-[12px] relative text-[#708090] overflow-hidden"><div class="jsx-189f2d4cbe17d436 absolute top-4 right-4 z-10"><div class="jsx-189f2d4cbe17d436 px-spacing12 bg-white rounded-full h-10 flex items-center cursor-pointer"><i class="jsx-189f2d4cbe17d436 text-black text-sm icon-copy"></i></div></div><div class="jsx-189f2d4cbe17d436 overflow-x-auto pb-[12px] w-full"><pre id="code-block-3ogqm6wzo" class="jsx-189f2d4cbe17d436 whitespace-pre-wrap break-words w-full font-mono text-sm"><span data-contrast="auto" lang="EN-GB">import React from 'react';</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">import&nbsp;{ View, Text,&nbsp;StyleSheet,&nbsp;TouchableOpacity&nbsp;} from 'react-native';</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">class Counter extends&nbsp;React.Component&nbsp;{</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; state =&nbsp;{ count:&nbsp;0 };</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; increment = () =&gt;&nbsp;this.setState({count:&nbsp;this.state.count&nbsp;+ 1});</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; decrement = () =&gt;&nbsp;this.setState({count:&nbsp;this.state.count&nbsp;- 1});</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp;&nbsp;render() {</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp; return (</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp; &nbsp; &lt;View style={styles.container}&gt;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp; &nbsp; &nbsp; &lt;TouchableOpacity&nbsp;onPress={this.decrement}&gt;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;Text style={styles.text}&gt;-&lt;/Text&gt;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp; &nbsp; &nbsp; &lt;/TouchableOpacity&gt;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp; &nbsp; &nbsp; &lt;Text style={styles.text}&gt;{this.state.count}&lt;/Text&gt;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp; &nbsp; &nbsp; &lt;TouchableOpacity&nbsp;onPress={this.increment}&gt;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;Text style={styles.text}&gt;+&lt;/Text&gt;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp; &nbsp; &nbsp; &lt;/TouchableOpacity&gt;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp; &nbsp; &lt;/View&gt;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp; );</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; }</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">};</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">const&nbsp;styles =&nbsp;StyleSheet.create({</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; container: {</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp;&nbsp;flexDirection: 'row',</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp;&nbsp;borderRadius: 5,</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp;&nbsp;borderWidth: 1,</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp;&nbsp;borderColor: '#1a91b8',</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp; padding: 5,</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp;&nbsp;backgroundColor: '#eaf7fd'</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; },</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; text: {</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp;&nbsp;color: '#015169',</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp;&nbsp;fontWeight: 'bold',</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp;&nbsp;fontSize: 20,</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; &nbsp; padding: 15</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">&nbsp; }</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">});</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-contrast="auto" lang="EN-GB">export default Counter;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span>
<span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></pre></div></div><p><span data-contrast="auto" lang="EN-GB">The above code is an implementation of a counter&nbsp;component. This&nbsp;component&nbsp;has a state count whose value is changed by clicking on the plus (+) and minus (-) buttons. As the state count of this&nbsp;component&nbsp;is changing the number displayed on UI is also changing. Whenever we create any&nbsp;component&nbsp;in React, first we divide the screen in the&nbsp;component&nbsp;and then decide what state a&nbsp;component&nbsp;should have. The beauty of this&nbsp;component&nbsp;is that it is an independent&nbsp;component&nbsp;and can be used anywhere in the application.&nbsp;That is how we make several fully functional components in React to build the complete application.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">37. How do you handle element size in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">React Native follows the box model concept of CSS, where the size of an element is&nbsp;determined&nbsp;by its content, padding, border, and margin. The simplest way to set an element's size is by specifying the&nbsp;width&nbsp;and&nbsp;height&nbsp;CSS properties. In React Native, all dimensions are unitless and represent density-independent pixels, ensuring consistent element sizes across different screen sizes when using fixed values.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB">However, if you need to set dimensions as a percentage, React Native does not directly support this. Instead, it provides the Dimensions module, which gives the width and height of the mobile device. This information can be used to dynamically set an element's style at runtime, allowing for responsive design by calculating percentage-based dimensions.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB">Below is an example of how to use the Dimension module from React native:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB">Importing module from React Native:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p><p data-ccp-border-between="0px none #000000" data-ccp-border-bottom="0px none #000000" data-ccp-padding-between="0px" data-ccp-padding-bottom="0px"><span data-contrast="auto" lang="EN-GB">import&nbsp;{ Dimension&nbsp;} from ‘react-native’;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB">Figure out the width and height of the device:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p><p data-ccp-border-between="0px none #000000" data-ccp-border-bottom="0px none #000000" data-ccp-padding-between="0px" data-ccp-padding-bottom="0px"><span data-contrast="auto" lang="EN-GB">const&nbsp;deviceWidth&nbsp;=&nbsp;Dimension.get(“window”).width;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span></p><p data-ccp-border-between="0px none #000000" data-ccp-border-bottom="0px none #000000" data-ccp-padding-between="0px" data-ccp-padding-bottom="0px"><span data-contrast="auto" lang="EN-GB">const&nbsp;deviceHeight&nbsp;=&nbsp;Dimension.get(“window”).height;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB">Calculate the style value:</span></p><p data-ccp-border-between="0px none #000000" data-ccp-border-bottom="0px none #000000" data-ccp-padding-between="0px" data-ccp-padding-bottom="0px"><span data-contrast="auto" lang="EN-GB">Width:&nbsp;deviceWidth*&lt;percentageValue&gt;/100</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB">But the simplest way is by setting width and height CSS for an element.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">38. What are the differences between Flexbox in the browser and Flexbox in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">CSS Flexbox is used to design responsive layouts easily, without relying on float or position CSS properties, which can be cumbersome. Introduced in CSS3, Flexbox ensures consistent layouts across different screen sizes.</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB">In React Native, you typically use a combination of&nbsp;flexDirection,&nbsp;alignItems, and&nbsp;justifyContent&nbsp;to achieve the desired layout. There are some differences in the default values of certain flex-based CSS properties between React Native and web browsers:</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>flexDirection:</strong> Defaults to row on the web, but to column in React Native.</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:0,&quot;335559739&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>flex</strong>: In React Native, the flex parameter supports only a single number.</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:0,&quot;335559739&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">Flexbox properties like&nbsp;alignItems&nbsp;and&nbsp;justifyContent&nbsp;help position elements:</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>alignItems:</strong> Values like flex-start align elements from the start, while flex-end places the first child element at the end.</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:0,&quot;335559739&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>justifyContent: </strong>Similar to&nbsp;alignItems, it positions elements along the main axis.</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:0,&quot;335559739&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">These properties allow for easy and flexible layout designs, ensuring responsive and adaptive UIs across different devices.</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">39. How does the justifyContent flexBox property work?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p></p><p><span data-contrast="auto" lang="EN-GB">JustifyContent&nbsp;property aligns the flexible container's items when the items do not use all available space on the main axis. By default, the main axis is vertical in the case of React native. This means&nbsp;justifyContent&nbsp;property aligns child elements of flex parent vertically in React native. We can use this property to layout elements in a flex container.&nbsp;JustifyContent&nbsp;supports the following values: flex-start|flex-end|centre|space-between|space-around|initial|inherit; It also applies some control over the&nbsp;alignment of items when they overflow the line. Let me explain&nbsp;JustifyContent’s&nbsp;values:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p><ol class="CertTheme__ol1 pt-spacing10"><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>flex-start:&nbsp;</strong>this is the default value for justifyContent. It means that flex items will start from the top and be evenly distributed vertically.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Flex-end:</strong> this is just the opposite behavior of flex-start. Elements start rendering from the bottom</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Center:</strong> Items will be placed in the middle</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Space-between: </strong>elements are evenly distributed along the main axis (vertical axis)</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Space-around: </strong>flex items will be evenly distributed with equal space around them</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li></ol><p></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">40. How does the alignItems flexBox property works?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>You can think of alignItems as justifyContent behaviour for cross-axis. Cross-axis in the case if React native is the horizontal axis. CSS alignItems property sets the alignSelf value on all direct children as a group. In Flexbox, it controls the alignment of items on the cross-axis. By default, the cross axis is horizontal in the case of React native. We can use this property to layout elements in the flex container. The alignItems property supports following values: stretch|center|flex-start|flex-end|baseline|initial|inherit; Let me explain align items values:</span></p><ol class="CertTheme__ol1 pt-spacing10"><li value="1" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">flex-start: </strong></b><span>this is the default value for alignItems. It means that flex items will start from the left and be evenly distributed horizontally.</span></li><li value="2" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Flex-end: </strong></b><span>this is just the opposite behavior of flex-start. Elements start rendering from the right and go up to the left end.</span></li><li value="3" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Center:</strong></b><span> Items will be placed in the middle</span></li><li value="4" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Space-between: </strong></b><span>elements are evenly distributed along the cross-axis (horizontal axis)</span></li><li value="5" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Space-around:</strong></b><span> flex items will be evenly distributed with equal space around them</span></li></ol><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><br></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">41. How can we change the default behavior of the main axis and cross axis of the flexbox layout?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">By default, the main axis is the vertical axis, and the cross axis is the horizontal axis in React native. Since justifyContent and alignItems properties work based on the main axis and cross axis, so justifyContent will align flex items vertically and alignItems will layout flex items horizontally.&nbsp;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB">This default value of the main axis and cross axis can be changed by changing the flexDirection property. If we set flexDirection to row in the flex container then the main axis will become the horizontal axis and the cross axis will become the vertical axis.&nbsp;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB">On changing the default behavior via the flexDirection CSS property, the behavior of alignItems and justifyContent will also get switched. The Concept of flex-direction is also present on the web. Flexbox is implemented as a single-direction layout technique and this direction is managed by the flexDirection CSS property. Apart from row and column, the flexDirection property has two more values: row-reverse and column-reverse. As the name suggests, the direction will remain horizontal and vertical but the direction will get changed.&nbsp;</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB">Transitions are an important feature of mobile devices. So, this is one of the most&nbsp;frequently&nbsp;asked React Native interview questions and answers for senior developers in recent times.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">42. How do you handle performance issues in a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Handling performance issues involves several strategies:</span></p><ul class="CertTheme__ul"><li value="1" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Optimize Images: </strong></b><span>Use appropriate formats and sizes, and consider using image caching.</span></li><li value="2" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Use FlatList and SectionList:</strong></b><span> For handling large lists efficiently.</span></li><li value="3" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Reduce Re-renders:</strong></b><span> Use React.memo, PureComponent, and avoid inline functions in render methods.</span></li><li value="4" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Optimize State Management:</strong></b><span> Use state management libraries like Redux or Context API to minimize unnecessary state updates.</span></li><li value="5" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Profiling:</strong></b><span> Use performance profiling tools to identify and address bottlenecks.</span></li></ul></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">43. How do you handle authentication in a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Handling authentication typically involves:</span></p><ul class="CertTheme__ul"><li value="1" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">OAuth:</strong></b><span> Use libraries like react-native-app-auth for OAuth-based authentication.</span></li><li value="2" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">JWT:</strong></b><span> Store JSON Web Tokens securely using AsyncStorage or SecureStore for secure sessions.</span></li><li value="3" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Backend Integration:</strong></b><span> Implement authentication logic on the backend and manage session states through APIs.</span></li></ul></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">44. What are some common debugging techniques in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Common debugging techniques include:</span></p><ul class="CertTheme__ul"><li value="1" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">React Native Debugger: </strong></b><span>A standalone app for debugging React Native apps.</span></li><li value="2" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Console Logging:</strong></b><span> Use console.log statements for quick debugging.</span></li><li value="3" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Remote Debugging:</strong></b><span> Use Chrome DevTools for inspecting network requests, debugging code, and profiling performance.</span></li><li value="4" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Error Boundaries:</strong></b><span> Implement error boundaries to catch and handle errors gracefully.</span></li></ul></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">45. How do you manage dependencies in a React Native project?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Managing dependencies involves:</span></p><ul class="CertTheme__ul"><li value="1" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Package Managers: </strong></b><span>Use npm or yarn to manage dependencies.</span></li><li value="2" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Versioning:</strong></b><span> Keep track of dependency versions in package.json.</span></li><li value="3" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Regular Updates:</strong></b><span> Regularly update dependencies to benefit from the latest features and security patches.</span></li><li value="4" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Peer Dependencies:</strong></b><span> Ensure peer dependencies are compatible to avoid version conflicts.</span></li></ul></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">46. How do you handle internationalization (i18n) in a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Handling internationalization involves:</span></p><ul class="CertTheme__ul"><li value="1" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Libraries: </strong></b><span>Use libraries like react-i18next or react-native-localize.</span></li><li value="2" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Translation Files: </strong></b><span>Store translations in JSON files or similar formats.</span></li><li value="3" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Locale Detection: </strong></b><span>Detect the user's locale using react-native-localize and load the corresponding translation files.</span></li><li value="4" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Dynamic Content:</strong></b><span> Ensure dynamic content like dates and currencies are formatted according to the locale.</span></li></ul></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">47. How do you test a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Testing a React Native app involves:</span></p><ul class="CertTheme__ul"><li value="1" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Unit Testing:</strong></b><span> Use Jest for unit testing components and logic.</span></li><li value="2" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Integration Testing:</strong></b><span> Use testing libraries like Enzyme or React Native Testing Library for integration tests.</span></li><li value="3" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">End-to-End Testing:</strong></b><span> Use tools like Detox for end-to-end testing to simulate real user interactions.</span></li></ul></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">48. What are some best practices for code organization in a React Native project?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Best practices include:</span></p><ul class="CertTheme__ul"><li value="1" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Modular Architecture: </strong></b><span>Organize code into modules based on features or functionality.</span></li><li value="2" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Folder Structure:</strong></b><span> Use a consistent folder structure, such as separating components, screens, and services.</span></li><li value="3" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Reusable Components: </strong></b><span>Create reusable components to avoid code duplication.</span></li><li value="4" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Clear Naming Conventions:</strong></b><span> Use clear and descriptive names for files and variables.</span></li></ul></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">49. How do you handle background tasks in a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Handling background tasks involves:</span></p><ul class="CertTheme__ul"><li value="1" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Background Fetch: </strong></b><span>Use the react-native-background-fetch library for periodic background tasks.</span></li><li value="2" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Background Timer: </strong></b><span>Use react-native-background-timer for scheduling tasks.</span></li><li value="3" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Push Notifications: </strong></b><span>Use push notifications to trigger background tasks.</span></li><li value="4" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Platform APIs: </strong></b><span>Utilize platform-specific APIs for handling background tasks efficiently.</span></li></ul></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">50. How do you handle file uploads in a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Handling file uploads involves:</span></p><ul class="CertTheme__ul"><li value="1" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">FormData:</strong></b><span> Use FormData to create a form and append files.</span></li><li value="2" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Fetch API: </strong></b><span>Use the Fetch API to send the FormData to the server.</span></li><li value="3" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">React Native Image Picker:</strong></b><span> Use the react-native-image-picker library to select files from the device.</span></li><li value="4" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Progress Tracking: </strong></b><span>Use libraries like react-native-fetch-blob to track upload progress.</span></li></ul></div></div></div></div><div class="relative"><div class="mt-spacing20 z-10 relative text-center flex justify-center mt-0"><button class="flex items-center gap-x-spacing8 py-spacing4"><span class="text-sm underline font-semibold text-mono-black">View all questions</span><i class="icon-chevron-down-double text-xl leading-5 text-neutral-800"></i></button></div><div class="absolute bottom-0 block h-32 w-full bg-gradient-to-t from-subdued/100 from-30% md:from-40%"></div></div></div></div></div><div class="hidden"><div><div class="text-xl text-neutral-800 mb-spacing20 font-bold">Advanced</div><div class="relative w-full"><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-primary-main outline-2 shadow-card hover:shadow-card visible"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-t-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden">1. How do you construct a logic screen in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-0 text-neutral-800"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>Login functionality is an essential part of any mobile application. We can design a login component which performs a client-side validation and if it passes then make an API call to the server for authentication of the user. We can create a simple login screen using TextInput, View and Button component. Since Button component renders based on the platform, it will give different look and feel on IOS and Android. To avoid this, we can use TouchableOpacity to create a button component. TouchableOpacity component can be styled as per the requirement. Similar to Button component, TouchOpacity component also provides onPress props where we assign our click listener. Following code explains the implementation of a Login form</p><p><img alt="logic screen in React Native" loading="lazy" width="100" height="100" decoding="async"  class="fr-fic fr-dib" style="color:transparent;width:100%;height:auto;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url(&quot;data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http%3A//www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage preserveAspectRatio='none' filter='url(%23b)' x='0' y='0' height='100%25' width='100%25' href='data:image/svg+xml;base64,CiAgPHN2ZyB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPgogICAgICA8bGluZWFyR3JhZGllbnQgaWQ9ImciPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNjY2MiIG9mZnNldD0iMjAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNkZGQiIG9mZnNldD0iNTAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNlZWUiIG9mZnNldD0iNzAlIiAvPgogICAgICA8L2xpbmVhckdyYWRpZW50PgogICAgPC9kZWZzPgogICAgPHJlY3Qgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9IiNlZWUiIC8+CiAgICA8cmVjdCBpZD0iciIgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9InVybCgjZykiIC8+CiAgICA8YW5pbWF0ZSB4bGluazpocmVmPSIjciIgYXR0cmlidXRlTmFtZT0ieCIgZnJvbT0iLTEwMCIgdG89IjEwMCIgZHVyPSIxcyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiICAvPgogIDwvc3ZnPg=='/%3E%3C/svg%3E&quot;)" sizes="(min-width: 767px) 50vw, 100vw" srcSet="" src="https://images.unsplash.com/photo-1497215968147-3f36c5df5ed3?ixlib=rb-4.0.3&auto=format&fit=crop&w=1000&q=80"></p><div class="jsx-189f2d4cbe17d436 code-block-wrapper mt-spacing10 mb-[16.8px] md:mb-[24px] bg-black p-4 rounded-[12px] relative text-[#708090] overflow-hidden"><div class="jsx-189f2d4cbe17d436 absolute top-4 right-4 z-10"><div class="jsx-189f2d4cbe17d436 px-spacing12 bg-white rounded-full h-10 flex items-center cursor-pointer"><i class="jsx-189f2d4cbe17d436 text-black text-sm icon-copy"></i></div></div><div class="jsx-189f2d4cbe17d436 overflow-x-auto pb-[12px] w-full"><pre id="code-block-vg0hi9ygq" class="jsx-189f2d4cbe17d436 whitespace-pre-wrap break-words w-full font-mono text-sm">import React from 'react';
import { View, StyleSheet, Text, TouchableOpacity, TextInput, Alert } from "react-native";
const initialState = { username: '', password: '' };
class LoginForm extends React.Component {
&nbsp; &nbsp; constructor(props) {
&nbsp; &nbsp; &nbsp; &nbsp; super(props);
&nbsp; &nbsp; &nbsp; &nbsp; this.state = initialState;
&nbsp; &nbsp; &nbsp; &nbsp; this.handleSubmitForm = this.handleSubmitForm.bind(this);
&nbsp; &nbsp; &nbsp; &nbsp; this.handleUsernameChange = this.handleUsernameChange.bind(this);
&nbsp; &nbsp; &nbsp; &nbsp; this.handlePasswordChange = this.handlePasswordChange.bind(this);
&nbsp; &nbsp; }
&nbsp; &nbsp; handleUsernameChange(text) {
&nbsp; &nbsp; &nbsp; &nbsp; this.setState({ username: text });
&nbsp; &nbsp; }
&nbsp; &nbsp; handlePasswordChange(text) {
&nbsp; &nbsp; &nbsp; &nbsp; this.setState({ password: text });
&nbsp; &nbsp; }
&nbsp; &nbsp; handleSubmitForm() {
&nbsp; &nbsp; &nbsp; &nbsp; const { username, password } = this.state;
&nbsp; &nbsp; &nbsp; &nbsp; Alert.alert(`User ${username} is log in with password ${password}`);
&nbsp; &nbsp; }
&nbsp; &nbsp; render() {
&nbsp; &nbsp; &nbsp; &nbsp; return (
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;View style={styles.container}&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;View&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;Text style={styles.text}&gt;Username&lt;/Text&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;TextInput autoCorrect={false} autoCapitalize={'none'} style={styles.input} onChangeText={this.handleUsernameChange}&gt;&lt;/TextInput&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;/View&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;View&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;Text style={styles.text}&gt;Password&lt;/Text&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;TextInput autoCorrect={false} autoCapitalize={'none'} style={styles.input} secureTextEntry onChangeText={this.handlePasswordChange}&gt;&lt;/TextInput&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;/View&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;TouchableOpacity style={styles.button} onPress={this.handleSubmitForm}&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;Text style={[styles.text, styles.center]}&gt;Login&lt;/Text&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;/TouchableOpacity&gt;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;/View&gt;
&nbsp; &nbsp; &nbsp; &nbsp; );
&nbsp; &nbsp; }
}
const styles = StyleSheet.create({
&nbsp; &nbsp; container: {
&nbsp; &nbsp; &nbsp; &nbsp; alignSelf: 'stretch',
&nbsp; &nbsp; &nbsp; &nbsp; margin: 10,
&nbsp; &nbsp; &nbsp; &nbsp; padding: 10,
&nbsp; &nbsp; &nbsp; &nbsp; borderColor: '#ccc',
&nbsp; &nbsp; &nbsp; &nbsp; borderWidth: 1,
&nbsp; &nbsp; &nbsp; &nbsp; borderRadius: 5,
&nbsp; &nbsp; &nbsp; &nbsp; backgroundColor: '#fff'
&nbsp; &nbsp; },
&nbsp; &nbsp; text: {
&nbsp; &nbsp; &nbsp; &nbsp; fontSize: 14,
&nbsp; &nbsp; &nbsp; &nbsp; fontWeight: 'bold',
&nbsp; &nbsp; &nbsp; &nbsp; color: '#015169',
&nbsp; &nbsp; &nbsp; &nbsp; paddingVertical: 5
&nbsp; &nbsp; },
&nbsp; &nbsp; input: {
&nbsp; &nbsp; &nbsp; &nbsp; height: 40,
&nbsp; &nbsp; &nbsp; &nbsp; borderColor: "#e0e0e0",
&nbsp; &nbsp; &nbsp; &nbsp; borderWidth: 1,
&nbsp; &nbsp; &nbsp; &nbsp; borderRadius: 5,
&nbsp; &nbsp; &nbsp; &nbsp; marginBottom: 15,
&nbsp; &nbsp; &nbsp; &nbsp; paddingHorizontal: 10
&nbsp; &nbsp; },
&nbsp; &nbsp; button: {
&nbsp; &nbsp; &nbsp; &nbsp; padding: 10,
&nbsp; &nbsp; &nbsp; &nbsp; borderColor: '#bee6fe',
&nbsp; &nbsp; &nbsp; &nbsp; borderWidth: 1,
&nbsp; &nbsp; &nbsp; &nbsp; borderRadius: 5,
&nbsp; &nbsp; &nbsp; &nbsp; backgroundColor: '#eaf7fd'
&nbsp; &nbsp; },
&nbsp; &nbsp; center: {
&nbsp; &nbsp; &nbsp; &nbsp; alignSelf: 'center'
&nbsp; &nbsp; }
});
export default LoginForm;</pre></div></div><p>Username and password TextInputs are controlled component here as its value is getting stored as a state of the component. onPress event of the login button, we validate the user input and if everything looks good then we will make the API call for login. We style this component using Stylesheet. create method. We used normal CSS rules to make this form looks nice.</p><p>This, along with other React Native basic interview questions for freshers, is a regular feature in React Native interviews, be ready to tackle it with the approach mentioned.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow visible"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">2. What is the ScrollView component of React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>ScrollView component is a generic scrolling container which can host multiple components and Views. you can scroll both vertically and horizontally (by setting the horizontal property). ScrollView can also be used to implement pinch and zoom functionality in IOS. Swiping horizontally between views can also be implemented on Android using the ViewPagerAndroid component. ScrollView works best to present a small number of things of a limited size. All the elements and views of a ScrollView are rendered, even if they are not currently shown on the screen.</p><div class="jsx-189f2d4cbe17d436 code-block-wrapper mt-spacing10 mb-[16.8px] md:mb-[24px] bg-black p-4 rounded-[12px] relative text-[#708090] overflow-hidden"><div class="jsx-189f2d4cbe17d436 absolute top-4 right-4 z-10"><div class="jsx-189f2d4cbe17d436 px-spacing12 bg-white rounded-full h-10 flex items-center cursor-pointer"><i class="jsx-189f2d4cbe17d436 text-black text-sm icon-copy"></i></div></div><div class="jsx-189f2d4cbe17d436 overflow-x-auto pb-[12px] w-full"><pre id="code-block-iiwhonvle" class="jsx-189f2d4cbe17d436 whitespace-pre-wrap break-words w-full font-mono text-sm">import React from 'react';
import { View, Text, Image, ActivityIndicator, StyleSheet, ScrollView } from "react-native";

export default PictureList;</pre></div></div><p>Above example renders a list of images in ScrollView. We import the ScrollView component from the react-native library and created Image element inside ScrollView. Each Image element has its own width and height set via CSS. When you run the above code and scrolls the screen you should be able to go through all the images renders. The scroll view is used to create scrollable UI on a mobile application. It works on both IOS and Android.</p><p>Expect to come across this, one of the most important React Native interview questions for experienced professionals in mobile app development, in your next interviews.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow visible"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">3. What is FlatList and how is it better than ScrollView?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>React native provides FlatList component to display a long line of data. For example, the News app normally displays a list to article summary card on the home page. these list of the card should be implemented using FlatList component. FlatList works well for long lists of data, where the number of items might change over time. Unlike the more generic ScrollView, the FlatList only renders elements that are currently visible on the screen, not all the elements at once. FlatList provides a performance boost over ScrollView as FlatList creates a card at runtime when the user starts scrolling the page. But ScrollView creates all the list item (card) at once.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow visible"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">4. What is the difference between FlatList and SectionList?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>We can use FlatList or SectionList component to render a list of items on a mobile app. But there are differences between these two components provided by the react-native library. If you want to render a set of data broken into logical sections, maybe with section headers. It takes sections as props whose values is an array of object and each object should have title property. This titled property will be used by SectionList to render the list heading. But FlatList just iterates the list and create a node to render on UI. In case you want to show the header for a group of the list then you need to customize the node and add a header to it. The basic difference is heading for a group of a node is provided out of the box via SectionList component of react-native but with FlatList, we need to implement ourselves.</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow visible"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">5. How do you make Ajax call from React Native application? Give an example.</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>We can use javascript to develop a mobile application using React native. calling an API is very much similar to how we make AJAX call in web application. Below example explains it in detail.</p><p><img alt="React Native application" loading="lazy" width="100" height="100" decoding="async"  class="fr-fic fr-dib" style="color:transparent;width:100%;height:auto;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url(&quot;data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http%3A//www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage preserveAspectRatio='none' filter='url(%23b)' x='0' y='0' height='100%25' width='100%25' href='data:image/svg+xml;base64,CiAgPHN2ZyB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPgogICAgICA8bGluZWFyR3JhZGllbnQgaWQ9ImciPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNjY2MiIG9mZnNldD0iMjAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNkZGQiIG9mZnNldD0iNTAlIiAvPgogICAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNlZWUiIG9mZnNldD0iNzAlIiAvPgogICAgICA8L2xpbmVhckdyYWRpZW50PgogICAgPC9kZWZzPgogICAgPHJlY3Qgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9IiNlZWUiIC8+CiAgICA8cmVjdCBpZD0iciIgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9InVybCgjZykiIC8+CiAgICA8YW5pbWF0ZSB4bGluazpocmVmPSIjciIgYXR0cmlidXRlTmFtZT0ieCIgZnJvbT0iLTEwMCIgdG89IjEwMCIgZHVyPSIxcyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiICAvPgogIDwvc3ZnPg=='/%3E%3C/svg%3E&quot;)" sizes="(min-width: 767px) 50vw, 100vw" srcSet="" src="https://images.unsplash.com/photo-1510511459019-1d227f4220b3?ixlib=rb-4.0.3&auto=format&fit=crop&w=1000&q=80"></p><div class="jsx-189f2d4cbe17d436 code-block-wrapper mt-spacing10 mb-[16.8px] md:mb-[24px] bg-black p-4 rounded-[12px] relative text-[#708090] overflow-hidden"><div class="jsx-189f2d4cbe17d436 absolute top-4 right-4 z-10"><div class="jsx-189f2d4cbe17d436 px-spacing12 bg-white rounded-full h-10 flex items-center cursor-pointer"><i class="jsx-189f2d4cbe17d436 text-black text-sm icon-copy"></i></div></div><div class="jsx-189f2d4cbe17d436 overflow-x-auto pb-[12px] w-full"><pre id="code-block-7xud3qm52" class="jsx-189f2d4cbe17d436 whitespace-pre-wrap break-words w-full font-mono text-sm">import React from 'react';
import { View, Text, Image, ActivityIndicator, StyleSheet, FlatList } from "react-native";

export default PictureList;</pre></div></div><p>In the above component, we are building a picture list component which makes API call and parse the response to show a list of images on a mobile screen. We can use the same fetch function to make an API call. Fetch method is introduced in the web as part of ES6 specification. Fetch is used in the same way we used to use on a web browser. First, we created a class-based component and assigned list of images as the state of a component.&nbsp;</p><p>Since we haven’t made an API call yet that is why the initial state of out PictureList component will be an empty array. In the render method, if our state is empty which means, we haven't received the response from a server that is why we are showing ActivityIndicator component provided by react-native. It is default spinner displayed on the screen. When our component is mounted then componentDidMount React lifecycle method get invoked, there we will make an API call and once we receive the response we update the state of PictureList component. Once the state is updated, the render method will get called and we render a list of images using FlatList and Image component.</p><p>A must-know for anyone looking for top React Native interview questions and answers, this is one of the frequently asked React Native interview questions based on actual use cases.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">6. What is a controlled and uncontrolled component?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>We can divide all React Native components into two categories based on the internal state of the component. There are controls like textInput which have a value attribute. It is used to display user input value on UI. If the value displayed is controlled by the form control then it is known as an uncontrolled component because React is not setting or changing the value of these components. But if the state of the component is maintained by the state of the component then these components are called a controlled component. To make a component controlled, we assign the state of the component as the value of control elements and add a callback method which will update the state on each value change event. In React Native, it is preferred to have controlled component so that all the values and behaviour will get managed by React and developer will have full control over the state of components.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">7. What do you understand by high order function in javascript?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>The basic definition of High order function is a function is called high order function if it either accept a function as an argument or returns another function. But now let’s talk about the benefit of writing a high order function. In javascript, we are trying to write less amount of code and try to reuse the same code or functionality at many times as we can. High order function way of writing code allows us to implement currying in Javascript. Now, what is this currying? Currying is a way of writing code where you write a common functionality and change the functionality via argument. Let me give you an example:</p><div class="jsx-189f2d4cbe17d436 code-block-wrapper mt-spacing10 mb-[16.8px] md:mb-[24px] bg-black p-4 rounded-[12px] relative text-[#708090] overflow-hidden"><div class="jsx-189f2d4cbe17d436 absolute top-4 right-4 z-10"><div class="jsx-189f2d4cbe17d436 px-spacing12 bg-white rounded-full h-10 flex items-center cursor-pointer"><i class="jsx-189f2d4cbe17d436 text-black text-sm icon-copy"></i></div></div><div class="jsx-189f2d4cbe17d436 overflow-x-auto pb-[12px] w-full"><pre id="code-block-4d9w7zmbl" class="jsx-189f2d4cbe17d436 whitespace-pre-wrap break-words w-full font-mono text-sm">function multiplyBy(a) {
return function(b) {
return a * b;
};
}</pre></div></div><p>This function is high order function as this returns a new function. This function will act as function generator for different functionalities. For example, I can create a double function by using the above high order function:</p><div class="jsx-189f2d4cbe17d436 code-block-wrapper mt-spacing10 mb-[16.8px] md:mb-[24px] bg-black p-4 rounded-[12px] relative text-[#708090] overflow-hidden"><div class="jsx-189f2d4cbe17d436 absolute top-4 right-4 z-10"><div class="jsx-189f2d4cbe17d436 px-spacing12 bg-white rounded-full h-10 flex items-center cursor-pointer"><i class="jsx-189f2d4cbe17d436 text-black text-sm icon-copy"></i></div></div><div class="jsx-189f2d4cbe17d436 overflow-x-auto pb-[12px] w-full"><pre id="code-block-6beu0uoui" class="jsx-189f2d4cbe17d436 whitespace-pre-wrap break-words w-full font-mono text-sm">const double = multiplyBy(2);
console.log(double(4)) //result: 8</pre></div></div><p>Similarly, I can use the same high order function to generate a triple function which takes the number as argument and return three times the number.</p><div class="jsx-189f2d4cbe17d436 code-block-wrapper mt-spacing10 mb-[16.8px] md:mb-[24px] bg-black p-4 rounded-[12px] relative text-[#708090] overflow-hidden"><div class="jsx-189f2d4cbe17d436 absolute top-4 right-4 z-10"><div class="jsx-189f2d4cbe17d436 px-spacing12 bg-white rounded-full h-10 flex items-center cursor-pointer"><i class="jsx-189f2d4cbe17d436 text-black text-sm icon-copy"></i></div></div><div class="jsx-189f2d4cbe17d436 overflow-x-auto pb-[12px] w-full"><pre id="code-block-3tacibido" class="jsx-189f2d4cbe17d436 whitespace-pre-wrap break-words w-full font-mono text-sm">const triple = multiplyBy(3);
console.log(triple(4)) //result: 12</pre></div></div><p>This type of function generation is known as currying in javascript. It is a better way of writing code as this decouples the base functionality with final logic. The base logic can be re-used at multiple places.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">8. What is a high order component in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>Just now, we have learned what high order functions are in Javascript and what are its benefits. With that knowledge, we can easily guess what a high order component will be and how it would be a good practise to use high order components wherever we can. Since components are also functions which are called as component in React world so High order components are components which take either component as an argument or returns another component. Higher order components are JavaScript functions used for adding additional functionalities to the existing component.&nbsp;</p><p>These components are the pure component which means it doesn’t know any side effect. Its output is totally based on the input values. For example, connect function from a react-redux library is also a high order component. Connect takes mapStateToProps and mapDispatchToProps as an argument and returns a new component which can access redix store. The withProvider function of react-redux, the withRouter function of react-router are very well used function which is also an example of high order component.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">9. What is rendering prop pattern in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>Passing callback functions as a component prop is not new in Javascript world. We used to pass callback with events and also when we try to implement a controlled component. Slowly, react community has evolved a pattern based on passing a function as props. It is called the render prop pattern. The term “render props” refers to a technique for sharing code between React components using a prop whose value is a function. A component with a render prop takes a function that returns a React element and calls it instead of implementing its own render logic.&nbsp;</p><p>You can think of this pattern as a child component will call the prop function and the return element will be inserted by the parent component. It gives a way so that a child component can modify the structure of the parent component without dealing with Refs. React router is one library that has used this pattern. Below is a very good example of how to render prop patterns work:</p><div class="jsx-189f2d4cbe17d436 code-block-wrapper mt-spacing10 mb-[16.8px] md:mb-[24px] bg-black p-4 rounded-[12px] relative text-[#708090] overflow-hidden"><div class="jsx-189f2d4cbe17d436 absolute top-4 right-4 z-10"><div class="jsx-189f2d4cbe17d436 px-spacing12 bg-white rounded-full h-10 flex items-center cursor-pointer"><i class="jsx-189f2d4cbe17d436 text-black text-sm icon-copy"></i></div></div><div class="jsx-189f2d4cbe17d436 overflow-x-auto pb-[12px] w-full"><pre id="code-block-pviojg123" class="jsx-189f2d4cbe17d436 whitespace-pre-wrap break-words w-full font-mono text-sm">const ProductDetail = ({ product }) =&gt; (
&nbsp;&lt;React.Fragment&gt;
&nbsp; &nbsp;&lt;Text&gt;{product.title}&lt;/Text&gt;
&nbsp; &nbsp;&lt;Text&gt;{product.description}&lt;/Text&gt;
&nbsp;&lt;/React.Fragment&gt; )
&lt;Fetch url=" some URL where my data is"
&nbsp;render={(data) =&gt; &lt;ProductDetail product={data.product} /&gt; }
/&gt;</pre></div></div><p>You can clearly see that render prop will be called by Fetch child component and it will insert the product detail node in the parent component.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">10. What is a dumb component or presentational component in ReactJS?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p></p><p>In ReactJS, as your application size is growing, you are going to have so many small or big component. At this stage, it’s always better to categorize and decided the roles and responsibilities of the component. Based on role and responsibilities, we can divide the component in two parts. One is a presentational component and another type of components are container component. We also call presentational component as a stateless component or dumb component. Container components are also known as a stateful component or smart component. It is very important to distinguish between the presentational component and the container component.</p><p><span style="color:rgb(103, 103, 103)"><strong>Presentational components show the following behaviour:</strong></span></p><ol class="CertTheme__ol1 pt-spacing10"><li class="CertTheme__listItem pt-spacing10">These types of component are concerned with presentation and styling.</li><li class="CertTheme__listItem pt-spacing10">These types of a component may contain both presentational and container components inside, and usually, have some DOM markup and styles of their own.</li><li class="CertTheme__listItem pt-spacing10">These types of component Often allow containment via <em>this.props.children</em>.</li><li class="CertTheme__listItem pt-spacing10">These types of component Don’t specify how the data is loaded or mutated. Data is passed to these type of component and they just create a markup to render the component.</li><li class="CertTheme__listItem pt-spacing10">These types of component receive data and callbacks exclusively via props.</li><li class="CertTheme__listItem pt-spacing10">These types of component rarely have their own state (when they do, it’s UI state rather than data).</li><li class="CertTheme__listItem pt-spacing10">These types of components are written as functional component unless they need state, lifecycle hooks, or performance optimisations.</li></ol><p></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">11. How do you implement screen navigation functionality in React native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>A mobile application contains multiple screens and there has to be a way to navigate through multiple screens in the application. Managing the presentation of, and transition between, multiple screens is typically handled by what is known as a navigator. React Navigation (<a href="https://reactnavigation.org/" rel="nofollow" target="_blank">https://reactnavigation.org/</a>) provides an easy to use navigation solution, with the ability to present common stack navigation and tabbed navigation patterns on both iOS and Android. The community solution to navigation is a standalone library that allows developers to set up the screens of an app with just a few lines of code.</p><p>This is an advanced React Native interview question based on screen navigation in mobile applications. Don't be surprised if this question pops up as one of the top interview questions for React Native in your next interview.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">12. What is the reason behind React native not automatically sizing everything?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>In Web development, if we don’t give a size to an element either via CSS or setting the width and height attribute of an element then elements size would be 0. There are a few instances where the size of the element is determined based on the size of children. For example, if you have an image element in div then initially height of div element is 0 and once the image is fetched from server browser again calculated the size of div and place image inside div. The user experience of this element is not very good as size keeps changing in between. If this div is placed in the middle of other div elements then the whole page will fluctuate to absorb the size of the image. To avoid this behaviour, React native have decided not to automatically calculate the size of elements. Instead, it completely depends on the developer to give the width and height of elements by CSS.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">13. How do you access the in-app developer menu in React native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Debugging code is a crucial aspect of development, regarded as a skill in software development. A developer with strong debugging skills can produce higher quality, well-tested code. To support this need, React Native offers robust debugging tools.</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB"><strong>Accessing the Developer Menu:</strong></span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}"><strong>&nbsp;</strong></span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Shake Gesture: Shake your device or select "Shake Gesture" from the Hardware menu in the iOS Simulator.</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:0,&quot;335559739&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Keyboard Shortcuts:</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:0,&quot;335559739&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">iOS Simulator: Press CMD + D.</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:0,&quot;335559739&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Android Emulator on Mac OS: Press CMD + M.</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:0,&quot;335559739&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB">Android Emulator on Windows and Linux: Press Ctrl + M.</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:0,&quot;335559739&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB"><strong>Remote Debugging:</strong></span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}"><strong>&nbsp;</strong></span></p><ul><li class="CertTheme__listItem pt-spacing10"><p><span data-contrast="auto" lang="EN-GB">You can remotely debug the application via the Chrome browser. Although this may slow down the application slightly, it significantly enhances the development experience.</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:0,&quot;335559739&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></p></li></ul><p><span data-contrast="auto" lang="EN-GB">So, React Native provides extensive support for debugging, making it easier for developers to&nbsp;identify&nbsp;and fix issues, thereby improving code quality and testing.</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">14. How virtual DOM works in React native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>Virtual DOM was popularised by React core team member Pete Hunt. React explains its performance aspect by using this term. They explained that the DOM manipulation is always a heavy operation as browser reflow, repaint event gets triggered by DOM manipulation. The browser needs to recalculate the position of elements by upcoming change. To optimise this browser operation, ReactJS tries to minimize DOM manipulation operations. React creates an in-memory data structure cache, computes the resulting differences, and then updates the browser’s displayed DOM efficiently. This allows developers to write code as if the entire page is rendered on each change while the React libraries only render subcomponents that actually change. That is how React increases the space complexity by keeping data structure in memory but reducing the processing cost by reducing the number of DOM manipulation an updated needs to make an actual DOM.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">15. How do you manage state in a bigger React native application?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>In React, we follow component driven development, which means that we would be writing several stateful or stateless reusable components and combine them to build the entire application. Where your application is getting bigger then there are many instances where one component wants to access a state of any other component. One way to achieve this by putting a dependent component as children of the same parent and then can communicate via callbacks.&nbsp;</p><p>These solutions work for small application but for a large application, passing callback from parent to innermost child element is cumbersome. That is where Redux comes in picture. Redux is a popular library to effectively maintain and manage the state of large React native application. It provides a store which keeps application level state and the developer needs to write actions and reducers to modify the state in the store. Any component can connect with the store by using Redux’s high order component connect. any component can dispatch an action which reaches to the reducer and updates the state in the store.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">16. Are compile-to-JS libraries like TypeScript or ClojureScript compatible with React Native? Why or why not?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>As javascript is evolving, people have started adding benefits of strictly typed languages like Java, C++. Typescript is one such framework which adds some very good features in javascript. But since those features are not supported by standard javascript yet, we would be needing tooling to convert the new concept in current concepts. That is done via using Babel in the build process.&nbsp;</p><p>Languages that compile to JavaScript are generally compatible with React Native. React Native uses Babel to transform JavaScript into a form that is consumable by the native OS’s JavaScript runtime, using the react-native Babel plugin. As long as Babel can compile your JavaScript, and your code does not rely on the web- or Node.js-specific dependencies, it will run in React Native. So we can use compile-to-js libraries with React native but we need to add steps in the build process to convert typescript to React Native’s JS runtime consumable code.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">17. How does React Native achieve native performance for some of its animations?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>React native provide Animated library out of the box which is designed to make animation fluid, maintainable and easy to build. It also provides a simple start/stop method to control time-based animations. Certain animation types, like Animation.timing and Animation.spring, can be serialized and sent across the asynchronous bridge before they are executed. This allows the runtime to defer the actual drawing of the animation entirely to the native side, instead of trying to send positional values across the bridge as each frame is rendered.&nbsp;</p><p>This does not work with animations that are not computable ahead of time. We can combine multiple animations and can chain different animation steps to produce complex animations. By setting useNativeDriver: true in the animated config, we send all the animation information to the native, before starting the animation. This allows native code to perform the animation on UI thread without having to go through the bridge on every frame.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">18. Native apps that feel smooth often incorporate lots of little animations for state changes and transitions. How would you implement these behaviours?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>React Native comes with the Animated API built in. This API is declarative: We define specific animations, using Animated.timing, Animated.spring, etc., and provide the exact parameters needed for the animation to run. This technique falls apart when we need lots of subtle and delicate animations on the fly; it’s not performant, and maintaining all that code would be a nightmare. Instead, we look to the LayoutAnimation module, which is an interpolative API. We can invoke predefined LayoutAnimations, or define our own. LayoutAnimation watches changes in the positions of elements between cycles of the render loop and computes the positional differences between elements at different cycles. Then, it interpolates those changes and produces a smooth, natively driven animation.</p><p>A staple in React Native technical interview questions, be prepared to answer this one using your hands-on experience with animations.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">19. What is the significance of keys in a component in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p>If you have ever iterated through an array to create a list of component and in case you missed adding a key attribute with new elements, then React throws a warning that key is not assigned to elements. React uses Keys to identify unique Virtual Elements with their corresponding data driving the UI. They help React to optimise the rendering by recycling all the existing elements in the component.&nbsp;</p><p>You can say that React uses these user given key values to identify the nodes. It makes a decision based on these keys whether the node should be updated or not. These keys must be a unique number or string, using which React just reorders the elements instead of re-rendering them. This leads to an increase in the application’s performance by reducing the number of elements manipulations. In case you don’t find any unique value to assign to a node, the last resort will be to assign key of the node equals to index of the item.</p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">20. Can React native be used for building application for TV?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Yes, TV device support has been implemented with the intention of making existing React Native applications work seamlessly on Apple TV and Android TV with minimal or no changes needed in the JavaScript code. Due to the similarities between iOS and&nbsp;tvOS&nbsp;APIs, adding TV support to React Native was&nbsp;feasible. However, there are&nbsp;not many&nbsp;developers using React Native for building TV applications.</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><p><span data-contrast="auto" lang="EN-GB">At one point, the community considered removing TV support from the core library due to issues developers faced while using React Native for TV apps. Consequently, the React Native documentation mentions that React Native can be used to develop TV apps but&nbsp;provides&nbsp;few examples. So, technically, React Native does support TV, but community support and comprehensive documentation are still lacking.</span><span data-ccp-props="{&quot;134233117&quot;:false,&quot;134233118&quot;:false,&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">21. How do you handle deep linking in a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Deep linking in React Native is managed using React Navigation and Linking API:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>React Navigation</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Configure the navigator with deep linking support.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Linking API</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Use the Linking module to handle incoming URLs and navigate to the&nbsp;appropriate screen.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Custom Schemes</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Define custom URL schemes for the app to handle specific links.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">Deep linking enhances user experience by allowing direct navigation to specific content within the app from external sources.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">22. What are the best practices for managing performance in a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Best practices for managing performance in a React Native app include:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Optimizing Images</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:&nbsp;</strong>Use&nbsp;appropriate image&nbsp;formats and sizes.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Minimizing State Updates</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Avoid unnecessary state updates and re-renders.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Using PureComponent and memo</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Prevent re-renders for components that&nbsp;don't&nbsp;need to update.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Virtualized Lists</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:&nbsp;</strong>Use&nbsp;FlatList&nbsp;and&nbsp;SectionList&nbsp;for large datasets.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Monitoring and Profiling</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Utilize&nbsp;tools like React Native Debugger and performance monitors.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">Following these practices helps&nbsp;maintain&nbsp;a smooth and responsive user experience.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">23. How do you implement push notifications in a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">To implement push notifications:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Firebase</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Use Firebase Cloud Messaging (FCM) for push notifications.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>React Native Firebase</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Integrate the react-native-firebase library.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Configuration</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Set up Firebase in the app, including API keys and configuration files.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Notification Handling</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Handle notifications in the background and foreground using the library's methods.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">Push notifications keep users engaged and informed about important updates.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">24. What is the difference between controlled and uncontrolled components in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">The difference between controlled and uncontrolled components:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Controlled Components</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> The component's value is managed by React state. Changes to the value are handled through state updates.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Uncontrolled Components</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>The&nbsp;component&nbsp;maintains&nbsp;its own internal state. Values are accessed using refs.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">Controlled components provide better control and synchronization with the app's state, while uncontrolled components can be simpler for basic use cases.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">25. How do you handle complex animations in React Native?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Handling complex animations involves:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Animated API</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Use the Animated library for creating complex animations.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Reanimated</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Use the react-native-reanimated library for more advanced animations.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Combining Animations</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Chain multiple animations together using sequence and parallel functions.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Native Driver</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Use the native driver for smoother performance.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">These tools and techniques allow for creating engaging and performant animations.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">26. How do you ensure accessibility in a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Ensuring accessibility involves:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Accessibility Properties</strong></span><span data-contrast="auto" lang="EN-GB">: Use properties like accessible,&nbsp;accessibilityLabel, and&nbsp;accessibilityHint.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>VoiceOver and TalkBack</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Test the app with screen readers on both iOS and Android.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Semantic Elements</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Use semantic components and ARIA roles to improve navigation and interaction for users with disabilities.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">Accessibility improves the app's usability for all users, including those with disabilities.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">27. How do you manage environment variables in a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Managing environment variables involves:</span></p><ul class="CertTheme__ul"><li value="1" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">react-native-config:</strong></b><span> Use the react-native-config library to manage environment variables.</span></li><li value="2" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Environment Files: </strong></b><span>Define variables in .env files for different environments (e.g., .env.dev, .env.prod).</span></li><li value="3" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Accessing Variables:</strong></b><span> Access variables in the app using Config from the react-native-config library.</span></li></ul><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>This approach allows for secure and easy management of environment-specific configurations.</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">28. How do you handle deep linking in a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">To handle deep linking:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Linking API</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Use the Linking module to listen for incoming links and navigate to the corresponding screen.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Navigation Configuration</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Configure React Navigation to support deep links.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Custom Schemes</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Define custom URL schemes for handling specific types of links.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">Deep linking improves user experience by allowing direct navigation to specific content within the app.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">29. How do you implement error boundaries in a React Native app?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p><span data-contrast="auto" lang="EN-GB">Implementing error boundaries involves:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p><ul><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Error Boundary Component</strong></span><span data-contrast="auto" lang="EN-GB"><strong>:</strong> Create a&nbsp;component&nbsp;that catches JavaScript errors anywhere in the&nbsp;component&nbsp;tree.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>ComponentDidCatch</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Use the&nbsp;componentDidCatch&nbsp;lifecycle method to log errors and display a fallback UI.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559740&quot;:276}">&nbsp;</span></li><li class="CertTheme__listItem pt-spacing10"><span data-contrast="auto" lang="EN-GB"><strong>Usage</strong></span><span data-contrast="auto" lang="EN-GB"><strong>: </strong>Wrap critical parts of the app with the error boundary&nbsp;component.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></li></ul><p><span data-contrast="auto" lang="EN-GB">Error boundaries prevent the app from crashing and provide a better user experience during unexpected errors.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:240,&quot;335559740&quot;:276}">&nbsp;</span></p></div></div></div></div><div class="rounded-xl mb-spacing24 last:mb-0 outline duration-300 transition ease-in-out outline-1 outline-neutral-200 hover:outline-neutral-400 hover:shadow-neutralShadow hidden"><div class="cursor-pointer items-center justify-between p-4 transition-all duration-500 undefined bg-white p-spacing16 pl-spacing24 flex gap-spacing8 rounded-xl"><div class="flex text-sm font-semibold items-center overflow-x-auto"><h3 class="text-neutral-800 font-bold text-sm leading-5.5 -indent-0 pl-5 overflow-hidden line-clamp-2">30. What are the advantages of using React Native over native development?</h3></div><div class="md:w-5 md:h-5 w-6 h-6 ml-spacing8 flex items-center transition-all duration-300"><i class="icon-chevron-up-filled inline-block transition-transform duration-300 text-xl rotate-180 text-primary-main"></i></div></div><div class="overflow-hidden p-0 transition-all duration-500 ease-in-out rounded-b-xl" style="max-height:0px"><div><div class="p-spacing24 bg-white border-t border-neutral-200 faq-editor-content last:rounded-b-xl"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Advantages of using React Native:</span></p><ul class="CertTheme__ul"><li value="1" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Cross-Platform Development:</strong></b><span> Write once and deploy on both iOS and Android.</span></li><li value="2" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Faster Development: </strong></b><span>Reuse code across platforms, reducing development time.</span></li><li value="3" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Hot Reloading: </strong></b><span>Instantly see code changes without recompiling.</span></li><li value="4" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Large Community and Ecosystem:</strong></b><span> Access to a vast number of libraries and community support.</span></li><li value="5" class="CertTheme__listItem pt-spacing10"><b><strong class="CertTheme__textBold">Cost-Effective: </strong></b><span>Lower development and maintenance costs due to shared codebase.</span></li></ul><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>These advantages make React Native a popular choice for building mobile applications.</span></p></div></div></div></div><div class="relative"><div class="mt-spacing20 z-10 relative text-center flex justify-center mt-0"><button class="flex items-center gap-x-spacing8 py-spacing4"><span class="text-sm underline font-semibold text-mono-black">View all questions</span><i class="icon-chevron-down-double text-xl leading-5 text-neutral-800"></i></button></div><div class="absolute bottom-0 block h-32 w-full bg-gradient-to-t from-subdued/100 from-30% md:from-40%"></div></div></div></div></div></div></div></div></div></div></div></section></div></div><div class="sticky top-0 self-start max-h-screen overflow-y-auto w-full"><div class="w-full overflow-hidden pt-spacing32"><div class="px-spacing16 py-spacing20 rounded-xl border border-neutral-200 bg-white"><div class=""><h5 class="text-lg leading-6 text-mono-black font-bold">Want to Know More?</h5></div><form novalidate="" class="pt-spacing20 w-full"><div class="mb-spacing12"><div class=" relative  w-full  group h-11 flex direction-row justify-between rounded-lg border-none
    hover:border-neutral-400  shadow-customShad focus:border-neutral-600 focus:shadow-neutral "><input type="text" placeholder="full Name" class="w-full h-full  text-sm text-neutral-800 placeholder-transparent leading-5.5 pl-4 pr-8 rounded-lg border-1 peer  focus:outline-none border-neutral-200 hover:border-neutral-400 focus:border-neutral-600 focus:shadow-neutral" name="fullName"><label class="absolute  left-3 -top-2 border-r-none text-sm transition-all peer-focus:-top-2 peer-focus:text-sm pointer-events-none pr-3.75 pl-1  bg-white 
          text-neutral-500 peer-placeholder-shown:text-sm peer-placeholder-shown:text-neutral-500 peer-placeholder-shown:top-3 peer-focus:text-neutral-500 peer-placeholder-shown:leading-5">Full Name<span class="text-red-500 ml-spacing4 pt-0.8 absolute">*</span></label></div></div><div class="mb-spacing12"><div class=" relative  w-full  group h-11 flex direction-row justify-between rounded-lg border-none
    hover:border-neutral-400  shadow-customShad focus:border-neutral-600 focus:shadow-neutral "><input type="text" placeholder="Email" class="w-full h-full text-sm text-neutral-800 leading-5.5 pl-4 pr-8 rounded-lg border-1 peer focus:outline-none border-neutral-200 hover:border-neutral-400 focus:border-neutral-600 focus:shadow-neutral placeholder-transparent" name="email"><label class="absolute  left-3 -top-2 border-r-none text-sm transition-all peer-focus:-top-2 peer-focus:text-sm pointer-events-none pr-3.75 pl-1 bg-white 
          text-neutral-500 peer-placeholder-shown:text-sm peer-placeholder-shown:text-neutral-500 peer-placeholder-shown:top-3 peer-focus:text-neutral-500 peer-placeholder-shown:leading-5">Email<span class="text-red-500 ml-spacing4 pt-0.8 absolute">*</span></label></div></div><div class="mb-spacing16"><div><div class="flex h-11 relative focus-within:shadow-neutral focus-within:border-neutral-600 rounded-lg border-1  focus:placeholder-transparent hover:border-neutral-400 focus:border-neutral-600 focus:shadow-neutral focus:outline-none border-neutral-200 shadow-customShad "><div class="p-3 cursor-pointer m-1 flex justify-center items-center rounded-r-lg !w-auto !px-0 !pr-2 !pl-3 leading-6 w-fit border-neutral-200 rounded-l-lg border-none hover:border-neutral-400 focus:border-neutral-600 focus:shadow-neutral focus:outline-none"><div class="pr-1 font-bold text-base text-blackDar"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#181A93" d="M17.3 0h478.4v342H17.3V0z"></path><path fill="#FFA44A" d="M0 0h513v114H0V0z"></path><path fill="#1A9F0B" d="M0 228h513v114H0V228z"></path><path fill="white" d="M0 114h513v114H0V114z"></path><circle fill="white" cx="256.5" cy="171" r="34.2"></circle><path fill="#181A93" d="M256.5 216.6c-25.1 0-45.6-20.5-45.6-45.6s20.5-45.6 45.6-45.6 45.6 20.5 45.6 45.6-20.5 45.6-45.6 45.6zm0-11.4c18.2 0 34.2-16 34.2-34.2s-15.9-34.2-34.2-34.2-34.2 16-34.2 34.2 16 34.2 34.2 34.2z"></path><circle fill="#181A93" cx="256.5" cy="171" r="22.8"></circle></svg></div><div class="pl-spacing4 text-xs w-6 items-center text-neutral-700 font-semibold">+91</div></div></div><i class="icon-chevron-right text-base rotate-90 leading-4 ml-spacing12"></i></div><input type="text" class="hidden" name="isd" value="+91"><div class="w-full"><div class="inline-block bg-white border-none undefined h-full w-full border-neutral-200 rounded-lg border-1 shadow-customShad group hover:border-neutral-400 focus:border-neutral-600 focus:shadow-neutral focus:outline-none"><input type="text" class="w-full h-full text-sm text-neutral-800 leading-5.5 px-spacing12 border-neutral-200 rounded-r-lg border-none peer focus:outline-none " placeholder="  " name="number"><label class="absolute  bg-white placeholder-transparent left-3 -top-2 text-sm transition-all peer-focus:-top-2 peer-focus:left-3 peer-focus:text-sm pointer-events-none  pr-3.75 pl-1 bg-white 
          text-neutral-500 peer-placeholder-shown:text-sm peer-placeholder-shown:text-neutral-500 peer-placeholder-shown:top-3 peer-focus:text-neutral-500 peer-placeholder-shown:leading-5 peer-placeholder-shown:left-24">Phone Number<span class="text-red-500 ml-spacing4 absolute pt-0.8">*</span></label></div></div></div><div class="max-w-61 !w-auto pt-spacing4 ml-3.5 md:mr-0 mr-4.25 bg-white absolute z-99 h-68 customized-scrollbar overflow-y-scroll border-1 text-xs border-neutral-400 rounded-lg hidden !ml-0"><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h513v342H0z"></path><g fill="#D80027"><path d="M0 0h513v38H0zM0 76h513v38H0zM0 152h513v38H0zM0 228h513v38H0zM0 304h513v38H0z"></path></g><path fill="#2E52B2" d="M0 0h256.5v190H0z"></path><g fill="white"><path d="M47.8 141.9l-4-12.8-4.3 12.8H26.3l10.7 7.7-4 12.8 10.8-7.9 10.7 7.9-4.2-12.8 10.9-7.7zM104.2 141.9l-4.1-12.8-4.2 12.8H82.7l10.7 7.7-4.1 12.8 10.8-7.9 10.7 7.9-4-12.8 10.8-7.7zM160.6 141.9l-4.2-12.8-4 12.8h-13.5l10.9 7.7-4.2 12.8 10.8-7.9 10.9 7.9-4.2-12.8 10.8-7.7zM216.9 141.9l-4.1-12.8-4.2 12.8h-13.2l10.7 7.7-4 12.8 10.7-7.9 10.8 7.9-4.2-12.8 10.9-7.7zM100.1 78.3l-4.2 12.8H82.7L93.4 99l-4.1 12.6 10.8-7.8 10.7 7.8-4-12.6 10.8-7.9h-13.4zM43.8 78.3l-4.3 12.8H26.3L37 99l-4 12.6 10.8-7.8 10.7 7.8L50.3 99l10.9-7.9H47.8zM156.4 78.3l-4 12.8h-13.5l10.9 7.9-4.2 12.6 10.8-7.8 10.9 7.8-4.2-12.6 10.8-7.9h-13.3zM212.8 78.3l-4.2 12.8h-13.2l10.7 7.9-4 12.6 10.7-7.8 10.8 7.8-4.2-12.6 10.9-7.9h-13.4zM43.8 27.7l-4.3 12.6H26.3L37 48.2l-4 12.7L43.8 53l10.7 7.9-4.2-12.7 10.9-7.9H47.8zM100.1 27.7l-4.2 12.6H82.7l10.7 7.9-4.1 12.7 10.8-7.9 10.7 7.9-4-12.7 10.8-7.9h-13.4zM156.4 27.7l-4 12.6h-13.5l10.9 7.9-4.2 12.7 10.8-7.9 10.9 7.9-4.2-12.7 10.8-7.9h-13.3zM212.8 27.7l-4.2 12.6h-13.2l10.7 7.9-4 12.7 10.7-7.9 10.8 7.9-4.2-12.7 10.9-7.9h-13.4z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">United States +1</div></div></div><div class="bg-mono-black/8 pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#181A93" d="M17.3 0h478.4v342H17.3V0z"></path><path fill="#FFA44A" d="M0 0h513v114H0V0z"></path><path fill="#1A9F0B" d="M0 228h513v114H0V228z"></path><path fill="white" d="M0 114h513v114H0V114z"></path><circle fill="white" cx="256.5" cy="171" r="34.2"></circle><path fill="#181A93" d="M256.5 216.6c-25.1 0-45.6-20.5-45.6-45.6s20.5-45.6 45.6-45.6 45.6 20.5 45.6 45.6-20.5 45.6-45.6 45.6zm0-11.4c18.2 0 34.2-16 34.2-34.2s-15.9-34.2-34.2-34.2-34.2 16-34.2 34.2 16 34.2 34.2 34.2z"></path><circle fill="#181A93" cx="256.5" cy="171" r="22.8"></circle></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">India +91</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="white" d="M0 0h512v341.3H0z"></path><g fill="#D80027"><path d="M0 0h142v341.3H0zM370 0h142v341.3H370zM306.5 206l50.4-25.2-25.2-12.6V143l-50.4 25.2 25.2-50.4h-25.2L256.1 80l-25.2 37.8h-25.2l25.2 50.4-50.4-25.2v25.2l-25.2 12.6 50.4 25.2-12.6 25.2h50.4V269h25.2v-37.8h50.4z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Canada +1</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#0052B4" d="M0 0h513v342H0z"></path><g fill="white"><path d="M222.2 170.7c.3-.3.5-.6.8-.9-.2.3-.5.6-.8.9zM188 212.6l11 22.9 24.7-5.7-11 22.8 19.9 15.8-24.8 5.6.1 25.4-19.9-15.9-19.8 15.9.1-25.4-24.8-5.6 19.9-15.8-11.1-22.8 24.8 5.7zM385.9 241.1l5.2 10.9 11.8-2.7-5.3 10.9 9.5 7.5-11.8 2.6v12.2l-9.4-7.6-9.5 7.6.1-12.2-11.8-2.6 9.5-7.5-5.3-10.9 11.8 2.7zM337.3 125.1l5.2 10.9 11.8-2.7-5.3 10.9 9.5 7.5-11.8 2.7v12.1l-9.4-7.6-9.5 7.6.1-12.1-11.9-2.7 9.5-7.5-5.3-10.9L332 136zM385.9 58.9l5.2 10.9 11.8-2.7-5.3 10.9 9.5 7.5-11.8 2.7v12.1l-9.4-7.6-9.5 7.6.1-12.1-11.8-2.7 9.5-7.5-5.3-10.9 11.8 2.7zM428.4 108.6l5.2 10.9 11.8-2.7-5.3 10.9 9.5 7.5-11.8 2.6V150l-9.4-7.6-9.5 7.6v-12.2l-11.8-2.6 9.5-7.5-5.3-10.9 11.8 2.7zM398 166.5l4.1 12.7h13.3l-10.8 7.8 4.2 12.7-10.8-7.9-10.8 7.9 4.1-12.7-10.7-7.8h13.3z"></path><path d="M254.8 0v30.6l-45.1 25.1h45.1V115h-59.1l59.1 32.8v22.9h-26.7l-73.5-40.9v40.9H99v-48.6l-87.4 48.6H-1.2v-30.6L44 115H-1.2V55.7h59.1L-1.2 22.8V0h26.7L99 40.8V0h55.6v48.6L242.1 0z"></path></g><path fill="#D80027" d="M142.8 0h-32v69.3h-112v32h112v69.4h32v-69.4h112v-32h-112z"></path><path fill="#0052B4" d="M154.6 115l100.2 55.7v-15.8L183 115z"></path><path fill="white" d="M154.6 115l100.2 55.7v-15.8L183 115z"></path><g fill="#D80027"><path d="M154.6 115l100.2 55.7v-15.8L183 115zM70.7 115l-71.9 39.9v15.8L99 115z"></path></g><path fill="#0052B4" d="M99 55.7L-1.2 0v15.7l71.9 40z"></path><path fill="white" d="M99 55.7L-1.2 0v15.7l71.9 40z"></path><g fill="#D80027"><path d="M99 55.7L-1.2 0v15.7l71.9 40zM183 55.7l71.8-40V0L154.6 55.7z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Australia +61</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#D80027" d="M0 85.337h512V256H0z"></path><g fill="white"><path d="M83.478 170.666c0-24.865 17.476-45.637 40.812-50.734a52.059 52.059 0 00-11.13-1.208c-28.688 0-51.942 23.254-51.942 51.941s23.255 51.942 51.942 51.942c3.822 0 7.543-.425 11.13-1.208-23.336-5.095-40.812-25.867-40.812-50.733zM150.261 122.435l3.684 11.337h11.921l-9.645 7.007 3.684 11.337-9.644-7.006-9.645 7.006 3.685-11.337-9.645-7.007h11.921z"></path><path d="M121.344 144.696l3.683 11.337h11.921l-9.645 7.007 3.684 11.337-9.643-7.006-9.645 7.006 3.685-11.337-9.645-7.007h11.921zM179.178 144.696l3.684 11.337h11.921l-9.645 7.007 3.684 11.337-9.644-7.006-9.644 7.006 3.685-11.337-9.645-7.007h11.921zM168.047 178.087l3.684 11.337h11.921l-9.644 7.007 3.684 11.337-9.645-7.006-9.643 7.006 3.684-11.337-9.644-7.007h11.92zM132.474 178.087l3.683 11.337h11.921l-9.644 7.007 3.684 11.337-9.644-7.006-9.644 7.006 3.684-11.337-9.644-7.007h11.92z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Singapore +65</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.334h512v341.337H0z"></path><g fill="#D80027"><path d="M425.301 233.745l3.388 10.428h10.963l-8.87 6.444 3.388 10.427-8.869-6.444-8.871 6.444 3.388-10.427-8.87-6.444h10.963zM386.107 308.817l5.083 15.642h16.445l-13.305 9.667 5.082 15.64-13.305-9.667-13.305 9.667 5.083-15.64-13.305-9.667h16.445zM387.588 185.971l4.236 13.036h13.704l-11.088 8.054 4.235 13.034-11.087-8.056-11.088 8.056 4.235-13.034-11.087-8.054h13.704zM349.876 233.291l5.082 15.641h16.446l-13.306 9.666 5.084 15.641-13.306-9.666-13.305 9.666 5.082-15.641-13.305-9.666h16.445z"></path></g><path fill="white" d="M256.003 85.329v30.564l-45.178 25.088h45.178v59.359H196.89l59.113 32.846v22.806h-26.69l-73.484-40.826v40.826h-55.652v-48.573l-87.429 48.573H.003v-30.553l45.168-25.099H.003v-59.359h59.103L.003 108.147V85.329h26.68l73.494 40.838V85.329h55.652v48.573l87.43-48.573z"></path><path fill="#D80027" d="M144 85.33h-32v69.334H0v32h112v69.334h32v-69.334h112v-32H144z"></path><path fill="#0052B4" d="M155.826 200.344L256 255.998v-15.739l-71.847-39.915z"></path><path fill="white" d="M155.826 200.344L256 255.998v-15.739l-71.847-39.915z"></path><g fill="#D80027"><path d="M155.826 200.344L256 255.998v-15.739l-71.847-39.915zM71.846 200.344L0 240.259v15.739l100.174-55.654z"></path></g><path fill="#0052B4" d="M100.174 140.983L0 85.33v15.738l71.847 39.915z"></path><path fill="white" d="M100.174 140.983L0 85.33v15.738l71.847 39.915z"></path><g fill="#D80027"><path d="M100.174 140.983L0 85.33v15.738l71.847 39.915zM184.154 140.983L256 101.068V85.33l-100.174 55.653z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">New Zealand +64</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.331h512v341.337H0z"></path><path d="M0 85.331h512v113.775H0z"></path><path fill="#FFDA44" d="M0 312.882h512v113.775H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Germany +49</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h513v342H0z"></path><path fill="#6DA544" d="M0 0h513v114H0z"></path><path d="M0 228h513v114H0z"></path><path fill="#dd0d12" d="M0 0h171v342H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">United Arab Emirates +971</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#D80027" d="M0 0h513v342H0z"></path><g fill="white"><path d="M274.2 119.8c-5.1 21.1-14.1 17.1-18.5 35.5-26.1-6.3-42.1-32.5-35.9-58.6 6.3-26.1 32.5-42.1 58.5-35.9-8.7 36.9.5 40.1-4.1 59zM206.6 135.4c18.5 11.3 11.9 18.7 28 28.6-14 22.9-43.9 30-66.8 16s-30-43.9-16-66.8c32.3 19.8 38.2 12.1 54.8 22.2zM200.6 204.6c16.5-14.1 21.4-5.5 35.8-17.8 17.4 20.4 15 51-5.4 68.4-20.4 17.4-51 15-68.4-5.4 28.7-24.6 23.2-32.6 38-45.2zM264.5 231.7c-8.3-20.1 1.4-22.1-5.9-39.6 24.8-10.3 53.2 1.5 63.4 26.3 10.3 24.8-1.5 53.2-26.3 63.4-14.5-35-23.8-32.2-31.2-50.1zM310 179.3c-21.6 1.7-20.6-8.1-39.5-6.6-2.1-26.7 17.9-50.1 44.6-52.2 26.7-2.1 50.1 17.9 52.2 44.6-37.7 2.9-37.9 12.7-57.3 14.2z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Hong Kong +852</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.331h512v341.326H0z"></path><path fill="#6DA544" d="M0 85.331h170.663v341.337H0z"></path><path fill="#FF9811" d="M341.337 85.331H512v341.337H341.337z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Ireland +353</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#DB3E00" d="M0 0h513v342H0z"></path><path fill="#479900" d="M331 0h182v342H331z"></path><path d="M0 0h181.8v342H0z"></path><path fill="white" d="M256 126.7c-19.4 0-35.2 15.8-35.2 35.2v52.8h70.4v-52.8c0-19.5-15.8-35.2-35.2-35.2z"></path><path fill="white" d="M256 84.3c-47.7 0-86.4 38.7-86.4 86.4S208.3 257 256 257s86.4-38.7 86.4-86.4-38.7-86.3-86.4-86.3zm0 157.7c-39.4 0-71.4-32-71.4-71.4 0-39.4 32-71.4 71.4-71.4 39.4 0 71.4 32 71.4 71.4 0 39.5-32 71.4-71.4 71.4z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Afghanistan +93</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#0052B4" d="M0 0h513v342H0z"></path><path fill="#FFDA44" d="M513 210.9H202.2V342h-79.8V210.9H0V131.1h122.4V0h79.8v131.1H513v61.2z"></path><path fill="#D80027" d="M513 149.7v42.6H183.7V342H141V192.3H0v-42.6h141V0h42.7v149.7z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Aland Islands +358</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 90 60"><path fill="#ED2024" d="M0 0h90v60H0z"></path><path fill="#212121" d="M32.5 12.2v16l7.1 2.5-5 4.9 2.4 3 5.3-5.5 1.2 2.3-3 4.9 3.6 5.6-1.8 2.6 2.8 3.6 2.7-3.7-1.5-2.6 3-5.8-2.7-4.6 1.2-2.3 5.2 5.5 2.5-2.9-5.2-5.1 7.2-2.6V12.2l-5.2 1.9-.1 3.8-3.3.3v-2.6l1.7-2.3 5.6-2.2-2.3-.4 1.4-1.2.9.4-.8-1.4L54 9l-1-1.1L47.5 9l1.4 1.1-3.8 4.9-3.8-4.8 1.3-1.1-5-1.2L36.2 9l-1.5-.4-.8 1.4.9-.6 1.6 1.1-2.3.5 5.5 2 1.6 2.3v2.9l-3.3-.3v-3.6z"></path><g fill="#212121"><path d="M26.2 25h6.4v2.5h-6.4zM26.2 20.9h6.4v2.7h-6.4zM26.2 16.7h6.4v2.6h-6.4zM26.2 12.7h6.4v2.5h-6.4z"></path></g><g fill="#212121"><path d="M57.4 25h6.4v2.5h-6.4zM57.4 20.9h6.4v2.7h-6.4zM57.4 16.7h6.4v2.6h-6.4zM57.4 12.7h6.4v2.5h-6.4z"></path></g><path fill="#212121" d="M53.4 36.1h6.4V38h-6.4zM30.2 36.1h6.4V38h-6.4z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Albania +355</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#41662E" d="M0 0h512v341.3H0z"></path><path fill="white" d="M256 0h256v341.3H256z"></path><g fill="#D80027"><path d="M341.5 105.3l-29.4 40.4-47.5-15.4 29.4 40.4-29.4 40.4 47.5-15.4 29.4 40.4v-50l47.5-15.5-47.5-15.4z"></path><path d="M309.9 276.7c-58.5 0-106-47.5-106-106s47.5-106 106-106c18.3 0 35.4 4.6 50.4 12.7-23.5-23-55.7-37.2-91.2-37.2-72 0-130.4 58.4-130.4 130.4S197.1 301 269.1 301c35.5 0 67.7-14.2 91.2-37.2-14.9 8.2-32.1 12.9-50.4 12.9z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Algeria +213</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#0052B4" d="M0 0h513v342H0z"></path><path fill="#D80027" d="M513 33L95.3 171 513 310.76v30.57L0 171 513 0z"></path><path fill="white" d="M513 287.18v24.58L81.72 171 513 30v24.16"></path><path fill="#A2001D" d="M476.98 140.21l-21.89 10.68-3.18-15.32 31.19-29.77s-9.42-40.65-13.75-44.98l-112.32 55.82-6.84 36.76-31.9 28.59-.4 34.2 34.29-22.76 67.23-2.66-1.51 38.11h22.23l11.9-44.64 31.55-24.61-6.6-19.42z"></path><path fill="#EFC100" stroke="#231F20" stroke-miterlimit="10" d="M317.89 238.41l-22.24-11.11 22.24-11.11h144.46v22.22z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">AmericanSamoa +1684</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#FFDA44" d="M0 0h513v342H0z"></path><path fill="#0052B4" d="M0 0h171v342H0z"></path><path fill="#D80027" d="M342 0h171v342H342zM198.92 113.58H256v64.8h-57.08zM309.16 228.68L256 243.18v-64.8h57.08z"></path><path fill="#BC8B00" d="M182.24 95.92v92.2c0 34.32 27.26 54.17 48.63 64.46-.8 1.37 25.13 8.26 25.13 8.26s25.93-6.9 25.13-8.26c21.38-10.29 48.63-30.14 48.63-64.46v-92.2H182.24zm129.86 92.2c0 16.88-10 29.43-32.76 43.9-8.62 5.48-17.54 9.03-23.34 11.01-5.8-1.98-14.72-5.53-23.34-11.01-22.76-14.47-32.76-28.02-32.76-43.9v-74.54h112.2v74.54z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Andorra +376</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path d="M0 171h513v171H0z"></path><path fill="#D80027" d="M0 0h513v171H0z"></path><g fill="#FFDA44"><path d="M197.01 139.81c-9.32 12.37-9 27.81 3.37 37.12 0 0 162.62 122.13 164.64 123.93 2.02 1.8 6.3 2.38 11-3.27 4.46-5.36 3.31-9.78 1.04-11.63S197.01 139.81 197.01 139.81zM264.42 79.12l11.72 24.03 26.45 3.96-19.23 18.58 4.4 26.38-23.61-12.55-23.73 12.33 4.64-26.33L226 106.77l26.47-3.73z"></path><path d="M268.67 39.2l-3.2 22.04c51.81 3.9 92.64 47.18 92.64 99.99 0 55.38-44.9 100.28-100.28 100.28-40.82 0-75.94-24.39-91.59-59.4l-18.4 13.11c19.96 40.59 61.71 68.52 110 68.52 67.66 0 122.51-54.85 122.51-122.51-.01-64.01-49.1-116.54-111.68-122.03z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Angola +244</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#0052B4" d="M0 0h513v342H0z"></path><path fill="white" d="M454.8 265.38c7.94-10.93 13.24-24.27 13.24-40.42V104.89a59.754 59.754 0 01-36.02 12.01c-19.64 0-37.07-9.43-48.03-24.01-10.95 14.58-28.39 24.01-48.03 24.01-13.52 0-25.99-4.47-36.02-12v120.06c0 16.16 5.3 29.5 13.24 40.42H454.8z"></path><path fill="#8DCCFF" d="M310.23 260.98C332.65 296.96 384 309 384 309s51.35-12.04 73.77-48.02H310.23z"></path><path fill="#D87B00" d="M396.66 172.21c.32 1.42 8.72 10.17 17.56 20.15 1.39 1.57-8.74 12.63-6.91 12.59 4.75-.12 19.27-17.26 19.34 6.65.05 15.94-30 27.51-30 27.51h17.47l.65 14.96s4.97-13.34 7.59-16.57c8.1-9.97 20.18-30.07 34.59-27.1 14.41 2.97-13.66-13.92-13.66-13.92s-5.2-15.19-16.63-16.97c-10.06-1.57-14.29-2.51-26.64-7.3-1.68-.65-3.88-2.32-3.36 0z"></path><path fill="#D87B00" d="M359.69 198.69c1.07-.99 4.46-12.63 8.69-25.28.67-1.99 15.31 1.27 14.35-.3-2.47-4.06-24.58-8.08-3.9-20.08 13.79-8 38.82 12.27 38.82 12.27l-8.72-15.14 12.64-8.03s-14.05 2.35-18.14 1.69c-12.68-2.04-36.13-2.48-40.75-16.45-4.62-13.97-5.25 18.79-5.25 18.79s-10.56 12.08-6.4 22.88c3.66 9.5 4.96 13.64 6.97 26.73.29 1.79-.06 4.53 1.69 2.92z"></path><path fill="#D87B00" d="M395.67 219.87c-1.39-.43-13.16 2.49-26.22 5.18-2.06.42-6.59-13.88-7.47-12.26-2.27 4.17 5.36 25.31-15.41 13.45-13.84-7.91-8.89-39.73-8.89-39.73l-8.71 15.14-13.29-6.9s9.09 10.96 10.57 14.84c4.6 11.99 16 32.49 6.24 43.49-9.76 11.01 18.88-4.9 18.88-4.9s15.76 3.07 23-5.96c6.38-7.94 9.3-11.14 19.61-19.45 1.43-1.12 3.97-2.19 1.69-2.9z"></path><path fill="white" d="M256.5 0h-23.1L160 48.9V0H96v48.9L22.6 0H0v22.7l46.1 30.7H0v64h46.1L0 148.1V171h22.6L96 121.8V171h64v-49.2l73.4 49.2h23.1v-22.9l-46.6-30.7h46.6v-64h-46.6l46.6-30.7z"></path><path fill="#D80027" d="M144 0h-32v69.4H0v32h112V171h32v-69.6h112.5v-32H144z"></path><path fill="#D80027" d="M0 171v-11.3l62.5-42.3h22.6L7.3 171zM7.3.1l77.8 53.2H62.5L0 11.1V.1zM256.5.1v11l-63 42.3h-22.6L248.7.1zM248.7 171l-77.8-53.6h22.6l63 42.3V171z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Anguilla +1264</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 744 496"><path fill="#3A7DCE" d="M0 0h744v496H0V0z"></path><path fill="white" d="M120 125l90 63 54-14 23-81 61-36 92 14 105 55 6 90 34 12v92l-65 115-78 24-72-17 18-30-8-32-10 9-162-25-49-85 20-46-49-62z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Antarctica +672</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path d="M0 0h513v342H0z"></path><path fill="#186DD2" d="M88.8 136.5c-2.2 12.9-3.4 26.2-3.4 39.8 0 13.6 1.2 27 3.4 39.8L256 228.3l167.2-12.1c2.2-12.9 3.4-26.2 3.4-39.8s-1.2-27-3.4-39.8"></path><path fill="white" d="M423.2 219H88.8c15.8 69.8 84.7 122.3 167.2 122.3S407.4 288.8 423.2 219z"></path><path fill="#FFDA44" d="M365.9 136.5H146.1l44.9-21.1-23.9-43.5 48.8 9.4L222 32l34 36.2L290 32l6.1 49.3 48.8-9.4-23.9 43.5z"></path><g fill="#C32500"><path d="M256.5 342L0 0v342z"></path><path d="M513 342V0L256 342z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Antigua and Barbuda +1268</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h512v342H0z"></path><path fill="#338AF3" d="M0 0h512v114H0zM0 228h512v114H0z"></path><circle fill="#FFDA44" stroke="#d6ab00" stroke-width="5" cx="256.5" cy="171" r="40"></circle></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Argentina +54</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#0052B4" d="M0 0h513v342H0z"></path><path fill="#D80027" d="M0 0h513v114H0z"></path><path fill="#FF9811" d="M0 228h513v114H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Armenia +374</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 363 242"><path fill="#338AF3" d="M0 0h363v242H0z"></path><path fill="white" d="M57 96.9L14.7 78.2 57 59.6l18.6-42.2 18.6 42.2 42.3 18.6-42.3 18.7-18.6 42.2z"></path><path fill="#D80027" d="M75.6 40.6l11.5 26.1 26.1 11.5-26.1 11.5-11.5 26.1-11.5-26.1L38 78.2l26.1-11.5z"></path><g fill="#FFDA44"><path d="M0 152.2h363v15.7H0zM0 183.6h363v15.7H0z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Aruba +297</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#0052B4" d="M0 0h513v342H0z"></path><path fill="white" d="M440.1 181.1c-.1 39.2-6.4 81.4-57.4 101.5-51.1-20.1-57.3-62.3-57.4-101.5h114.8z"></path><path fill="#29DBFF" d="M439.6 197.7c-2.8 34.9-12.4 67.4-57 85-44.4-17.6-54.5-51.2-56.9-84.9"></path><path fill="white" d="M437.8 214.1c-3.2 24.3-16.7 53.5-55.1 68.6-38.4-15.1-50.5-42.5-55.1-68.4"></path><path fill="#29DBFF" d="M434.2 230.3c-5.7 17.7-19.3 39.4-51.3 52.8-32-12.6-45.2-33.8-51.4-53"></path><path fill="white" d="M426.7 246.9c-6.5 11.3-17.7 25.4-44 35.9-27.5-11.5-37.4-25.3-44-36.1"></path><path fill="#29DBFF" d="M412.4 265.1c-8.1 7.2-12 11.2-29.6 17.9-20.1-7.9-22.6-11.6-29.2-17.5"></path><path fill="#5CC85C" d="M383.3 231.6c-.2-.2-27.9 35.7-27.9 35.7-1.8-1.3-10-9.5-13.3-15l41.3-50.1 40.2 49.7c-3.9 6.5-11.4 13.6-13.2 15M382.6 85.3l-26.5 45h53z"></path><ellipse transform="rotate(-82.3 291.431 225.686)" fill="#F7A226" cx="291.4" cy="225.7" rx="48.7" ry="15.7"></ellipse><ellipse transform="rotate(-68.099 303.087 164.67)" fill="#DDC7AB" cx="303.1" cy="164.7" rx="11.7" ry="7.2"></ellipse><ellipse transform="rotate(-81.738 291.697 271.697)" fill="#DDC7AB" cx="291.7" cy="271.7" rx="11.4" ry="3.3"></ellipse><ellipse transform="matrix(.9986 -.05353 .05353 .9986 -13.992 16.424)" fill="#DDC7AB" cx="299.6" cy="269.4" rx="3.3" ry="11"></ellipse><ellipse transform="rotate(-21.518 314.54 201.06)" fill="#DDC7AB" cx="314.5" cy="201.1" rx="4.1" ry="13.7"></ellipse><ellipse transform="rotate(-21.518 317.511 178.077)" fill="#DDC7AB" cx="317.5" cy="178.1" rx="13.7" ry="4.1"></ellipse><ellipse transform="rotate(-7.7 473.781 225.857)" fill="#F7A226" cx="473.6" cy="225.9" rx="15.7" ry="48.7"></ellipse><ellipse transform="rotate(-21.901 462.057 164.866)" fill="#DDC7AB" cx="462" cy="164.9" rx="7.2" ry="11.7"></ellipse><ellipse transform="rotate(-8.27 473.27 271.908)" fill="#DDC7AB" cx="473.4" cy="271.9" rx="3.3" ry="11.4"></ellipse><ellipse transform="matrix(.05353 -.9986 .9986 .05353 171.34 719.998)" fill="#DDC7AB" cx="465.5" cy="269.6" rx="11" ry="3.3"></ellipse><ellipse transform="rotate(-68.482 450.552 201.247)" fill="#DDC7AB" cx="450.6" cy="201.2" rx="13.7" ry="4.1"></ellipse><ellipse transform="rotate(-68.482 447.58 178.265)" fill="#DDC7AB" cx="447.6" cy="178.3" rx="4.1" ry="13.7"></ellipse><path fill="#B0C6CC" d="M373.3 130.3L356.1 155l17.8 26.1H396l4.7-25.4-5.4-25.4z"></path><path fill="white" d="M256 0v117.4h-46.1l46.1 30.7v22.6h-22.6L160 121.8v48.9H96v-48.9l-73.4 48.9H0v-22.6l46.1-30.7H0v-64h46.1L0 22.7V0h22.6L96 48.9V0h64v48.9L233.4 0z"></path><path fill="#D80027" d="M144 0h-32v69.4H0v32h112v69.3h32v-69.3h112v-32H144z"></path><path fill="#2E52B2" d="M256 22.7v30.7h-46.1z"></path><g><path fill="#D80027" d="M0 170.7v-11l62.5-42.3h22.6L7.3 170.7z"></path></g><path fill="#D80027" d="M7.3.1l77.8 53.2H62.5L0 11.1V.1zM256 .1v11l-62.5 42.3h-22.6L248.7.1zM248.7 170.7l-77.8-53.3h22.6l62.5 42.3v11z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Ascension Island +247</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 114h513v114H0z"></path><path fill="#D80027" d="M0 0h513v114H0zM0 228h513v114H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Austria +43</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#D80027" d="M0 0h513v342H0z"></path><path fill="#338AF3" d="M0 0h513v114H0z"></path><path fill="#6DA544" d="M0 228h513v114H0z"></path><g fill="white"><path d="M265.6 212.6c-23 0-41.6-18.6-41.6-41.6s18.6-41.6 41.6-41.6c7.2 0 13.9 1.8 19.8 5-9.2-9-21.9-14.6-35.8-14.6-28.3 0-51.2 22.9-51.2 51.2s22.9 51.2 51.2 51.2c13.9 0 26.6-5.6 35.8-14.6-5.9 3.2-12.6 5-19.8 5z"></path><path d="M297.6 142.2l5.5 15.5 14.9-7.1-7.1 14.9 15.5 5.5-15.5 5.5 7.1 14.9-14.9-7.1-5.5 15.5-5.5-15.5-14.9 7.1 7.1-14.9-15.5-5.5 15.5-5.5-7.1-14.9 14.9 7.1z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Azerbaijan +994</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.337h512v341.326H0z"></path><g fill="#338AF3"><path d="M0 85.337h512v113.775H0zM0 312.888h512v113.775H0z"></path></g><path d="M256 256.006L0 426.668V85.331z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Bahamas +1242</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M2.216 86.076H512v339.848H2.216z"></path><path fill="white" d="M209.455 154.969l-50.236 25.267 50.236 25.257-50.236 25.267 50.236 25.257-50.236 25.266 50.236 25.257-50.236 25.268 50.236 25.257-50.236 25.267 50.236 25.268-36.45 18.33H0V86.07h172.939l36.516 18.364-50.236 25.267z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Bahrain +973</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#496E2D" d="M0 85.331h512v341.337H0z"></path><circle fill="#F40B32" cx="218.902" cy="255.994" r="115"></circle></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Bangladesh +880</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.33"><path fill="#FFDA44" d="M0 0h512v341.34H0z"></path><g fill="#0052B4"><path d="M0 0h170.66v341.34H0zM341.34 0H512v341.34H341.34z"></path></g><path d="M325.74 101.02l-31.97 12.4c-.68 1.35-5.79 7.54-8.18 53.06h-17.05v-60.42L256 78.68l-12.54 27v60.8H226.4c-2.39-45.53-7.8-52.48-8.47-53.84l-31.68-11.63c.15.31 15.4 31.34 15.4 78.01v12.54h41.81v71.07h25.08v-71.07h41.81v-12.54c0-24.13 4.17-44.02 7.68-56.46 3.82-13.57 7.7-21.49 7.74-21.57l-.03.03z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Barbados +1246</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#75AF2B" d="M.6.2H512v341H.6z"></path><path fill="#D32424" d="M0 230h512V.2H0"></path><path fill="white" d="M100.1 230V.2H0v340.9h511.4-411.3z"></path><path fill="#D32424" d="M51.6 218l-38-47.7 38-46.9 38 46.9zM51.6 113.4l-38-47.7 38-46.9 38 46.9zM51.6 322.6l-38-47.7 38-46.9 38 46.9z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Belarus +375</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.331h512v341.326H0z"></path><path d="M0 85.331h170.663v341.337H0z"></path><path fill="#D80027" d="M341.337 85.331H512v341.337H341.337z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Belgium +32</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#0052B4" d="M0 0h512v341.3H0z"></path><circle fill="white" cx="260.9" cy="170.9" r="118.9"></circle><circle fill="none" stroke="#6DA544" stroke-width="18" stroke-miterlimit="10" cx="261.9" cy="173.1" r="94.5"></circle><g stroke="black"><path fill="#0052B4" d="M261.9 151.5l-50.6 23.4v20c0 11.8 6.1 22.8 16.2 28.9L262 239l34.5-15.2c10-6.2 16.2-17.1 16.2-28.9v-20l-50.8-23.4z"></path><path fill="#FFDA44" d="M211.3 128.1h101.3v46.7H211.3z"></path></g><g fill="#BC0029"><path d="M0 0h512v35H0zM0 306h512v35H0z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Belize +501</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#6DA544" d="M0 85.337h512v341.326H0z"></path><path fill="#FFDA44" d="M196.641 85.337H512V256H196.641z"></path><path fill="#D80027" d="M196.641 256H512v170.663H196.641z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Benin +229</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.33"><path fill="#D80027" d="M0 0h512v341.34H0z"></path><path fill="#0052B4" d="M0 .1h256v170.6H0z"></path><path fill="white" d="M256 0h-22.6L160 48.9V0H96v48.9L22.6 0H0v22.7l46.1 30.7H0v64h46.1L0 148.1v22.6h22.6L96 121.8v48.9h64v-48.9l73.4 48.9H256v-22.6l-46.1-30.7H256v-64h-46.1L256 22.7z"></path><path fill="#D80027" d="M144 0h-32v69.4H0v32h112v69.3h32v-69.3h112v-32H144z"></path><path fill="#D80027" d="M0 170.7v-11l62.5-42.3h22.6L7.3 170.7zM7.3.1l77.8 53.2H62.5L0 11.1V.1zM256 .1v11l-62.5 42.3h-22.6L248.7.1zM248.7 170.7l-77.8-53.3h22.6l62.5 42.3v11z"></path><g transform="translate(13 5)"><path fill="white" d="M303.9 94.94v99.69c0 59.81 79.75 99.69 79.75 99.69s79.75-39.88 79.75-99.69V94.94H303.9z"></path><path fill="#2F8F22" d="M436.37 254.44H330.93c23.13 25.08 52.72 39.88 52.72 39.88s29.59-14.8 52.72-39.88z"></path><circle fill="#65B5D2" cx="383.65" cy="214.56" r="39.88"></circle><circle fill="#D80027" cx="343.77" cy="194.63" r="19.94"></circle><circle fill="#D80027" cx="423.52" cy="194.63" r="19.94"></circle><circle fill="#D80027" cx="383.65" cy="154.75" r="19.94"></circle></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Bermuda +1441</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#FF7415" d="M0 0h512v341.3H0z"></path><path fill="#FFDA44" d="M512 0H0v341.3"></path><path fill="none" stroke="white" stroke-width="42" stroke-miterlimit="10" d="M128.7 255.5s35 54 67.3 32.4c56.9-37.9-68.9-108.6-2.9-152.6 58.3-38.8 76.6 103.5 137.6 62.8 59-39.3-64.7-111.4-9.2-148.4 33.4-22.2 67.1 32.6 67.1 32.6"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Bhutan +975</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.337h512v341.326H0z"></path><path fill="#D80027" d="M0 85.337h512v113.775H0z"></path><path fill="#6DA544" d="M0 312.888h512v113.775H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Bolivia +591</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.334h512v341.337H0z"></path><path fill="#FFDA44" d="M99.905 85.329h341.333v341.334"></path><g fill="white"><path d="M36.561 100.645l14.843-10.807 14.867 10.794-4.979-15.302H41.525z"></path><path d="M88.332 103.632L82.649 86.16l-5.672 17.472-18.365.012 14.867 10.796-5.661 17.461 14.843-10.806 14.866 10.795-5.684-17.474 14.854-10.795z"></path><path d="M119.59 134.89l-5.684-17.474-5.673 17.474-18.365.011 14.867 10.795-5.661 17.462 14.844-10.807 14.866 10.796-5.685-17.474 14.856-10.794z"></path><path d="M150.846 166.146l-5.683-17.473-5.673 17.473-18.364.011 14.866 10.796-5.661 17.461 14.843-10.806 14.866 10.795-5.683-17.474 14.855-10.794z"></path><path d="M182.103 197.403l-5.683-17.474-5.672 17.474-18.366.011 14.866 10.795-5.66 17.462 14.843-10.807 14.866 10.796-5.684-17.473 14.855-10.795z"></path><path d="M213.359 228.659l-5.683-17.472-5.672 17.472-18.365.012 14.866 10.795-5.66 17.462 14.842-10.806 14.866 10.794-5.683-17.473 14.855-10.795z"></path><path d="M244.616 259.916l-5.683-17.473-5.672 17.473-18.366.012 14.867 10.795-5.661 17.462 14.844-10.807 14.866 10.794-5.685-17.472 14.855-10.794z"></path><path d="M275.872 291.173L270.19 273.7l-5.673 17.473-18.365.011 14.867 10.796-5.661 17.461 14.843-10.806 14.866 10.795-5.683-17.474 14.853-10.794z"></path><path d="M307.13 322.43l-5.683-17.474-5.674 17.474-18.364.011 14.866 10.795-5.661 17.462 14.844-10.807 14.866 10.796-5.684-17.474 14.855-10.794z"></path><path d="M338.386 353.686l-5.683-17.472-5.672 17.472-18.365.012 14.866 10.795-5.661 17.462 14.843-10.807 14.866 10.795-5.683-17.472 14.855-10.796z"></path><path d="M369.643 384.943l-5.683-17.473-5.672 17.473-18.366.012 14.866 10.794-5.66 17.463 14.843-10.807 14.866 10.795-5.684-17.473 14.855-10.795z"></path><path d="M395.216 398.727l-5.672 17.472-18.365.012 14.394 10.453h19.278l14.414-10.476-18.366.011z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Bosnia and Herzegovina +387</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><g fill="#338AF3"><path d="M0 322.783h512v103.88H0zM0 85.337h512v104.515H0z"></path></g><path d="M0 210.877h512v89.656H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Botswana +267</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#6DA544" d="M0 0h512v341.3H0z"></path><path fill="#FFDA44" d="M256 19.3l205.4 151.4L256 322 50.6 170.7z"></path><circle fill="white" cx="256" cy="170.7" r="86.5"></circle><g fill="#0052B4"><path d="M212.8 165.3c-15 0-29.5 2.3-43.2 6.5.6 47.2 39.1 85.3 86.4 85.3 29.3 0 55.2-14.6 70.8-36.9-26.7-33.4-67.9-54.9-114-54.9zM340.9 187.2c1-5.4 1.6-10.9 1.6-16.6 0-47.8-38.7-86.5-86.5-86.5-35.6 0-66.2 21.6-79.5 52.3 11.7-2.4 23.8-3.7 36.2-3.7 50.3.1 95.7 21 128.2 54.5z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Brazil +55</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0-.3h513V342H0V-.3z"></path><path fill="#0052B4" d="M462.9 198.1c-4 0-14-5-21-9-11-6-21-12-31.1-12s-20 6-31.1 12c-7 4-16 9-20 9s-14-5-20-9c-11-6-22-12-32.1-12-9 0-20 6-31.1 12-7 4-16 9-20 9s-13-5-20-9c-11-6-22-12-31.1-12-10 0-21 6-32.1 12-6 4-16 9-20 9s-13-5-20-9c-11-6-21-12-31.1-12s-20 6-31.1 12c-7 4-17 9-21 9s-13-5-20-9c-10-6-20-12-30.1-12v22l19 10c11 6 21 12 31.1 12s21-6 32.1-12c6-4 16-10 20-10s13 6 20 10c11 6 21 12 31.1 12s20-6 31.1-12c7-4 17-10 21-10s13 6 20 10c11 6 21 12 31.1 12s20-6 31.1-12c7-4 16-10 20-10s14 6 21 10c11 6 21 12 31.1 12s20-6 31.1-12c7-4 16-10 20-10s14 6 20 10c11 6 22 12 32.1 12s20-6 31.1-12l19-10v-22c-10 0-20 6-30.1 12-7 4-16 9-20 9zM0 31.7l19 10c11 6 21 12 31.1 12s21-6 32.1-12c6-4 16-10 20-10s13 6 20 10c11 6 21 12 31.1 12s20-6 31.1-12c7-4 17-10 21-10s13 6 20 10c11 6 21 12 31.1 12s20-6 31.1-12c7-4 16-10 20-10s14 6 21 10c11 6 21 12 31.1 12s20-6 31.1-12c7-4 16-10 20-10s14 6 20 10c11 6 22 12 32.1 12s20-6 31.1-12l19-10v-22c-10 1-20 6-30.1 12-7 4-16 9-20 9s-14-5-21-9c-11-6-21-12-31.1-12s-20 6-31.1 12c-7 4-16 9-20 9s-14-5-20-9c-11-6-22-12-32.1-12s-20 6-31.1 12c-7 4-16 9-20 9s-13-5-20-9c-11-6-22-12-31.1-12s-21 6-32.1 12c-6 4-16 9-20 9s-13-5-20-9c-11-6-21-12-31.1-12s-20 6-31.1 12c-7 4-17 9-21 9s-13-5-20-9c-10-6-20-11-30.1-12v22zm462.9 55.2c-4 0-14-5-21-9-11-6-21-12-31.1-12s-20 6-31.1 12c-7 4-16 9-20 9s-14-5-20-9c-11-6-22-12-32.1-12-9 0-20 6-31.1 12-7 4-16 9-20 9s-13-5-20-9c-11-6-22-12-31.1-12-10 0-21 6-32.1 12-6 4-16 9-20 9s-13-5-20-9c-11-6-21-12-31.1-12s-20 6-31.1 12c-7 4-17 9-21 9s-13-5-20-9c-10-6-20-12-30.1-12v22l19 9c11 6 21 12 31.1 12s21-6 32.1-12c6-4 16-9 20-9s13 5 20 9c11 6 21 12 31.1 12s20-6 31.1-12c7-4 17-9 21-9s13 5 20 9c11 6 21 12 31.1 12s20-6 31.1-12c7-4 16-9 20-9s14 5 21 9c11 6 21 12 31.1 12s20-6 31.1-12c7-4 16-9 20-9s14 5 20 9c11 6 22 12 32.1 12s20-6 31.1-12l19-9v-22c-10 0-20 6-30.1 12-7 3.9-16 9-20 9zm50.1 34c-10 1-20 6-30.1 12-7 4-16 10-20 10s-14-6-21-10c-11-6-21-12-31.1-12s-20 6-31.1 12c-7 4-16 10-20 10s-14-6-20-10c-11-6-22-12-32.1-12s-20 6-31.1 12c-7 4-16 10-20 10s-13-6-20-10c-11-6-22-12-31.1-12s-21 6-32.1 12c-6 4-16 10-20 10s-13-6-20-10c-11-6-21-12-31.1-12s-20 6-31.1 12c-7 4-17 10-21 10s-13-6-20-10c-10-6-20-11-30.1-12v23c4 1 13 5 19 9 11 6 21 12 31.1 12s21-6 32.1-12c6-4 16-9 20-9s13 5 20 9c11 6 21 12 31.1 12s20-6 31.1-12c7-4 17-9 21-9s13 5 20 9c11 6 21 12 31.1 12s20-6 31.1-12c7-4 16-9 20-9s14 5 21 9c11 6 21 12 31.1 12s20-6 31.1-12c7-4 16-9 20-9s14 5 20 9c11 6 22 12 32.1 12s20-6 31.1-12c6-4 15-8 19-9v-23zm-50.1 133.3c-4 0-14-5-21-9-11-6-21-12-31.1-12s-20 6-31.1 12c-7 4-16 9-20 9s-14-5-20-9c-11-6-22-12-32.1-12-9 0-20 6-31.1 12-7 4-16 9-20 9s-13-5-20-9c-11-6-22-12-31.1-12-10 0-21 6-32.1 12-6 4-16 9-20 9s-13-5-20-9c-11-6-21-12-31.1-12s-20 6-31.1 12c-7 4-17 9-21 9s-13-5-20-9c-10-6-20-12-30.1-12v22l19 9c11 6 21 12 31.1 12s21-6 32.1-12c6-4 16-9 20-9s13 5 20 9c11 6 21 12 31.1 12s20-6 31.1-12c7-4 17-9 21-9s13 5 20 9c11 6 21 12 31.1 12s20-6 31.1-12c7-4 16-9 20-9s14 5 21 9c11 6 21 12 31.1 12s20-6 31.1-12c7-4 16-9 20-9s14 5 20 9c11 6 22 12 32.1 12s20-6 31.1-12l19-9v-22c-10 0-20 6-30.1 12-7 4-16 9-20 9zm50.1 34c-10 1-20 6-30.1 12-7 4-16 10-20 10s-14-6-21-10c-11-6-21-12-31.1-12s-20 6-31.1 12c-7 4-16 10-20 10s-14-6-20-10c-11-6-22-12-32.1-12s-20 6-31.1 12c-7 4-16 10-20 10s-13-6-20-10c-11-6-22-12-31.1-12s-21 6-32.1 12c-6 4-16 10-20 10s-13-6-20-10c-11-6-21-12-31.1-12s-20 6-31.1 12c-7 4-17 10-21 10s-13-6-20-10c-10-6-20-11-30.1-12v23c4 0 13 5 19 9 11 6 21 12 31.1 12s21-6 32.1-12c6-4 16-9 20-9s13 5 20 9c11 6 21 12 31.1 12s20-6 31.1-12c7-4 17-9 21-9s13 5 20 9c11 6 21 12 31.1 12s20-6 31.1-12c7-4 16-9 20-9s14 5 21 9c11 6 21 12 31.1 12s20-6 31.1-12c7-4 16-9 20-9s14 5 20 9c11 6 22 12 32.1 12s20-6 31.1-12c6-4 15-9 19-9v-23z"></path><path fill="white" d="M0-.3h256v171H0V-.3z"></path><path d="M389.8 119.9H408v78.8h-18.3l.1-78.8zm0 117.8H408v75.1h-18.3l.1-75.1z" fill="#A2001D"></path><g fill="#D80027"><path d="M144-.3h-32v70H0v32h112v69h32v-69h112v-32H144v-70z"></path><path d="M0-.3v15l57 39h23L0-.3zM256-.3v15l-57 39h-23l80-54z"></path><path d="M0-.3v15l57 39h23L0-.3zM256-.3v15l-57 39h-23l80-54zM0 170.7v-15l57-38h23l-80 53zM256 170.7v-15l-57-38h-23l80 53z"></path></g><g fill="#2E52B2"><path d="M0 22.7v31h46l-46-31zm96-23v49L23-.3h73zM256 22.7v31h-46l46-31zm-96-23v49l73-49h-73z"></path><path d="M0 22.7v31h46l-46-31zm96-23v49L23-.3h73zM256 22.7v31h-46l46-31zm-96-23v49l73-49h-73zM0 147.7v-30h46l-46 30zm96 23v-49l-73 49h73zM256 147.7v-30h-46l46 30zm-96 23v-49l73 49h-73z"></path></g><path fill="#5DA51E" stroke="#45602C" stroke-width="4" stroke-miterlimit="10" d="M462.8 91.5h-29.1l25.7-25.7c4.5-4.4 4.5-11.4 0-15.8l-3.4-3.4c-4.4-4.4-11.4-4.4-15.8 0l-25.9 25.9V37.4c0-6.2-5.1-11.3-11.3-11.3h-4.7c-6.2 0-11.3 5.1-11.3 11.3v31.7l-23.5-23.8c-4.7-4.7-12.2-4.7-16.9 0l-3.6 3.6c-4.7 4.7-4.7 12.4 0 17.2l25 25.4h-30.6c-6 0-10.9 4.9-10.9 10.9v4.6c0 6 4.9 10.9 10.9 10.9H369l-20.7 20.7c-4.4 4.4-4.4 11.4 0 15.8l3.4 3.4c4.4 4.4 11.4 4.4 15.8 0l19.6-19.6V167c0 6.1 5.1 11.1 11.3 11.3h4.7c6.2 0 11.3-5.1 11.3-11.3v-28.3l22.2 22.6c4.7 4.7 12.4 4.7 17.1 0l3.6-3.6c4.7-4.7 4.7-12.4 0-17.2L435.2 118h27.6c5.9 0 10.7-4.9 10.9-10.9v-4.6c0-6.1-4.9-11-10.9-11z"></path><path fill="#E2DD24" stroke="#525625" stroke-width="4" stroke-miterlimit="10" d="M439.2 249.1h-79.8s-.9-13.4-6-21.8c-6.2-10.4-13.9-28.1-1.4-36.7 15.9-10.9 33.7.8 48.2.8 11.8.1 26.9-14 45-.8 12.2 8.9 3.9 28.2-1.3 36.7-7 11.5-4.7 21.8-4.7 21.8z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">British Indian Ocean Territory +246</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.33"><path fill="#FFDA44" d="M0 0h512v341.33H0z"></path><path d="M0 193.74l512 127.19V214.26L0 97.08z"></path><path fill="white" d="M512 234.26v-86.67L0 20.41v86.67"></path><g fill="#D80027" stroke="#231F20" stroke-width="3" stroke-miterlimit="10"><path d="M306.4 134.01a50.28 50.28 0 016.07 24.02c0 21.55-13.51 39.94-32.52 47.19v-59.51c5.7-1.19 10-6.37 10-12.59 6.9 0 12.5-5.75 12.5-12.85h-.42c6.9 0 12.91-5.75 12.91-12.85h-34.99V76.58l-14.99-27.71-15 27.71v30.84h-34.99c0 7.1 6.01 12.85 12.91 12.85h-.42c0 7.1 5.6 12.85 12.5 12.85 0 6.22 4.29 11.4 9.99 12.59v61.37c-22.09-5.39-38.48-25.3-38.48-49.05 0-8.7 2.2-16.88 6.07-24.02-10.96 11.21-17.72 26.53-17.72 43.44 0 34.32 27.82 62.15 62.15 62.15s62.15-27.83 62.15-62.15c0-16.91-6.77-32.24-17.72-43.44z"></path><path d="M198.46 226.81s20.69 27.71 66.5 27.71 66.5-27.71 66.5-27.71l13.47 28.37s-21.03 27.71-79.97 27.71-79.97-27.71-79.97-27.71l13.47-28.37zM129.24 133.18h20.88l24.93 27.26v73.45h-26.28v-68.37zM400 133.18h-20.88l-24.93 27.26v73.45h26.27v-68.37z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Brunei Darussalam +673</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#496E2D" d="M0 85.337h512v341.326H0z"></path><path fill="white" d="M0 85.337h512v113.775H0z"></path><path fill="#D80027" d="M0 312.888h512v113.775H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Bulgaria +359</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#6DA544" d="M0 0h512v341.3H0z"></path><path fill="#D80027" d="M0 0h512v170.7H0z"></path><path fill="#FFDA44" d="M256 66.9l25.8 79.3h83.3l-67.4 49 25.7 79.3-67.4-49-67.4 49 25.7-79.3-67.4-49h83.3z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Burkina Faso +226</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#D80027" d="M0 0h512v341.3H0z"></path><g fill="#6DA544"><path d="M215.9 170.7L0 314.6V26.8zM512 26.8v287.8L296.1 170.7z"></path></g><path fill="#0052B4" d="M512 26.8L296.1 170.7 512 314.6v26.7h-40.1L256 197.4 40.1 341.3H0v-26.7l215.9-143.9L0 26.8V0h40.1L256 143.9 471.9 0H512z"></path><path fill="white" d="M512 26.8L296.1 170.7 512 314.6v26.7h-40.1L256 197.4 40.1 341.3H0v-26.7l215.9-143.9L0 26.8V0h40.1L256 143.9 471.9 0H512z"></path><circle fill="white" cx="251.6" cy="170.7" r="100.2"></circle><g fill="#D80027"><path d="M251.6 93.3l10.1 17.5h20.2l-10.1 17.5 10.1 17.5h-20.2l-10.1 17.5-10.1-17.5h-20.2l10.1-17.5-10.1-17.5h20.2zM210.3 163.4l10.1 17.5h20.3l-10.1 17.5 10.1 17.5h-20.3l-10.1 17.5-10.1-17.5H180l10.1-17.5-10.1-17.5h20.2zM292.8 163.4l10.1 17.5h20.2L313 198.4l10.1 17.5h-20.2l-10.1 17.5-10.1-17.5h-20.2l10.1-17.5-10.1-17.5h20.2z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Burundi +257</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.337h512v341.326H0z"></path><g fill="#0052B4"><path d="M0 85.337h512v113.775H0zM0 312.888h512v113.775H0z"></path></g><path fill="white" d="M303.49 281.971v-17.809h-11.873v-23.745l-11.872-11.872-11.872 11.872v-23.744L256 204.8l-11.873 11.873v23.744l-11.872-11.872-11.872 11.872v23.745H208.51v17.809h-11.872v17.808h118.724v-17.808z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Cambodia +855</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#D80027" d="M0 0h512v341.3H0z"></path><path fill="#496E2D" d="M0 0h170.7v341.3H0z"></path><g fill="#FFDA44"><path d="M341.3 0H512v341.3H341.3zM256 102.2l17.2 53H329L283.9 188l17.2 53-45.1-32.7-45.1 32.7 17.2-53-45.1-32.8h55.8z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Cameroon +237</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#0052B4" d="M0 0h512v341.3H0z"></path><path fill="#D80027" d="M0 182.2h512v41.4H0z"></path><path fill="white" d="M0 140.8h512v41.4H0zM0 223.6h512V265H0z"></path><g fill="#FFDA44" stroke="black" stroke-miterlimit="10"><path d="M150.4 70l6.9 21.1h22.2l-18 13.1 6.9 21.1-18-13.1-17.9 13.1 6.8-21.1-17.9-13.1h22.2zM150.4 279.7l6.9 21.1h22.2l-18 13 6.9 21.2-18-13.1-17.9 13.1 6.8-21.2-17.9-13h22.2zM52.8 208.8l6.9 21.1h22.2l-18 13 6.9 21.2-18-13.1-17.9 13.1 6.8-21.2-17.9-13H46zM90.1 91l6.9 21.1h22.2l-18 13 6.9 21.2-18-13.1-17.9 13.1 6.8-21.2-18-13h22.3zM23.8 162H46l6.8-21.1 6.9 21.1h22.2l-18 13.1 6.9 21.1-18-13-17.9 13 6.8-21.1zM72.2 310.9l6.8-21.1-18-13h22.3l6.8-21.2 6.9 21.2h22.2l-18 13 6.9 21.1-18-13zM248 208.8l-6.9 21.1h-22.2l18 13-6.9 21.2 18-13.1 18 13.1-6.9-21.2 18-13h-22.2zM210.7 91l-6.8 21.1h-22.2l17.9 13-6.8 21.2 17.9-13.1 18 13.1-6.9-21.2 18-13h-22.2zM277.1 162h-22.2l-6.9-21.1-6.9 21.1h-22.2l18 13.1-6.9 21.1 18-13 18 13-6.9-21.1zM228.7 310.9l-6.9-21.1 18-13h-22.2l-6.9-21.2-6.8 21.2h-22.2l17.9 13-6.8 21.1 17.9-13z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Cape Verde +238</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.334h512v341.337H0z"></path><circle fill="#6DA544" cx="384" cy="181.79" r="29.682"></circle><path fill="#D80027" d="M332.054 174.377h103.88v44.522h-103.88z"></path><path fill="#496E2D" d="M435.942 255.997v-.001.001z"></path><path fill="#FFDA44" d="M332.058 285.678v29.682h15.616c9.364 9.176 22.18 14.84 36.326 14.84 14.147 0 26.962-5.664 36.326-14.84h15.616v-29.682H332.058z"></path><path fill="#338AF3" d="M332.058 211.475v44.522c0 39.759 51.942 51.942 51.942 51.942s51.942-12.182 51.942-51.942v-44.522H332.058z"></path><g fill="#F3F3F3"><path d="M383.997 235.256c-12.985 0-12.985 11.873-25.97 11.873s-12.985-11.873-25.97-11.873v20.777c12.985 0 12.985 11.873 25.97 11.873s12.985-11.873 25.97-11.873c12.986 0 12.986 11.873 25.973 11.873 12.986 0 12.986-11.873 25.973-11.873v-20.777c-12.986 0-12.986 11.873-25.973 11.873-12.986-.001-12.986-11.873-25.973-11.873zM383.997 193.666c-12.985 0-12.985 11.873-25.97 11.873s-12.985-11.873-25.97-11.873v20.777c12.985 0 12.985 11.873 25.97 11.873s12.985-11.873 25.97-11.873c12.986 0 12.986 11.873 25.973 11.873 12.986 0 12.986-11.873 25.973-11.873v-20.777c-12.986 0-12.986 11.873-25.973 11.873-12.986 0-12.986-11.873-25.973-11.873z"></path></g><path fill="white" d="M256 85.334v22.617l-46.069 30.709H256v64h-46.069L256 233.38v22.617h-22.628L160 207.078v48.919H96v-48.919l-73.372 48.919H0V233.38l46.069-30.72H0v-64h46.069L0 107.951V85.334h22.628L96 134.241V85.334h64v48.907l73.372-48.907z"></path><g fill="#D80027"><path d="M144 85.329h-32v69.334H0v32h112v69.334h32v-69.334h112v-32H144z"></path><path d="M0 85.329v15.082l57.377 38.252H80zM256 85.329v15.082l-57.377 38.252H176z"></path><path d="M0 85.329v15.082l57.377 38.252H80zM256 85.329v15.082l-57.377 38.252H176zM0 255.997v-15.082l57.377-38.252H80zM256 255.997v-15.082l-57.377-38.252H176z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Cayman Islands +1345</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#D80027" d="M0 0h512v341.3H0z"></path><g fill="#6DA544"><path d="M0 170.7h211.5V256H0zM300.5 170.7H512V256H300.5z"></path></g><path fill="#0052B4" d="M0 0v85.3h211.5V0h89v85.3H512V0z"></path><g fill="white"><path d="M300.5 85.3H512v85.3H300.5zM0 85.3h211.5v85.3H0z"></path></g><g fill="#FFDA44"><path d="M300.5 341.3h-89V256H0v85.3h512V256H300.5zM105.7 8.6l8.6 26.2h27.5L119.5 51l8.6 26.2L105.7 61 83.4 77.2 91.9 51 69.6 34.8h27.6z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Central African Republic +236</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.331h512v341.337H0z"></path><path fill="#0052B4" d="M0 85.331h170.663v341.337H0z"></path><path fill="#D80027" d="M341.337 85.331H512v341.337H341.337z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Chad +235</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.337h512v341.326H0z"></path><path fill="white" d="M256 85.337h256V256H256z"></path><path fill="#0052B4" d="M0 85.337h256V256H0z"></path><path fill="white" d="M128 109.801l15.108 46.498H192l-39.554 28.739 15.108 46.498L128 202.799l-39.554 28.737 15.108-46.498L64 156.299h48.892z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Chile +56</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#D80027" d="M0 0h512v341.3H0z"></path><g fill="#FFDA44"><path d="M352.3 312.6L328 294.9l-24.4 17.7 9.3-28.6-24.3-17.7h30.1l9.3-28.6 9.3 28.6h30.1L343 284zM415.9 120.9l-24.4 17.7 9.3 28.6-24.3-17.7-24.4 17.7 9.3-28.6-24.3-17.7h30.1l9.3-28.6 9.3 28.6zM367.4 57.4L343 75l9.3 28.7L328 86l-24.4 17.7 9.3-28.7-24.3-17.6h30.1l9.3-28.7 9.3 28.7zM415.9 204.4L391.5 222l9.3 28.7-24.3-17.7-24.4 17.7 9.3-28.7-24.3-17.6h30.1l9.3-28.7 9.3 28.7z"></path></g><path fill="#FFDA44" d="M167.6 64.4l26 80.3h84.5l-68.3 49.6 26.1 80.4-68.3-49.7-68.4 49.7 26.1-80.4L57 144.7h84.5z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">China +86</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#0052B4" d="M0 0h512v341.3H0z"></path><path fill="#6DA544" d="M0 0h512v341.3"></path><g fill="white"><path d="M77.6 272l5.7 11.9 12.8-3-5.7 11.9 10.3 8.1-12.8 2.9V317l-10.3-8.3-10.2 8.3v-13.2l-12.8-2.9 10.3-8.1-5.8-11.9 12.9 3zM40.5 173.1l5.7 11.9 12.8-3-5.7 11.8 10.3 8.2-12.9 2.9.1 13.2-10.3-8.3-10.3 8.3.1-13.2-12.9-2.9 10.4-8.2L22 182l12.8 3zM77.6 92.2l5.7 11.8 12.8-2.9-5.7 11.8 10.3 8.2-12.8 2.9v13.1l-10.3-8.2-10.2 8.2V124l-12.8-2.9 10.3-8.2-5.8-11.8L72 104zM123.7 155.1l5.7 11.9 12.8-3-5.7 11.9 10.3 8.1-12.8 2.9v13.2l-10.3-8.2-10.2 8.2v-13.2l-12.8-2.9 10.3-8.1-5.7-11.9 12.8 3zM90.8 209.1l4.4 13.7h14.5L98 231.3l4.5 13.7-11.7-8.4-11.7 8.4 4.5-13.7-11.7-8.5h14.4z"></path></g><circle fill="#FFDA44" cx="267.1" cy="170.7" r="74.5"></circle><path fill="#6DA544" d="M267.1 220.3h24.8s10.8-19 0-37.2l24.8-24.8-12.4-24.8h-12.4s-6.2 18.6-31 18.6-31-18.6-31-18.6h-12.4l12.4 24.8-12.4 24.8 12.4 12.4s12.4-24.8 37.2-12.4c0 0 10.5 15.5 0 37.2z"></path><path fill="#FFDA44" d="M464.4 92.2c.6-2.9-.2-17.6-.2-20.7 0-21.3-13.9-39.4-33.2-45.7 5.9 12 9.2 25.4 9.2 39.7 0 4.8-.4 9.5-1.1 14.1-2.9-4.7-6.6-8.9-11.2-12.6-17.1-13.6-40.6-14-57.9-2.5 13.4 2.9 26.3 8.9 37.7 18 9 7.1 16.2 16.8 21.7 26.1 0 0-17.8 10.9-31 15.1s-42.3 7.9-42.3 7.9c72 12 132-36 132-36-6.5-13.4-15.8-4-23.7-3.4z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Christmas Island +61</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#6DA544" d="M0 0h512v341.3H0z"></path><g fill="#FFDA44"><path d="M422.7 252.4l6.2 12.8 13.8-3.2-6.2 12.8 11.2 8.8-13.9 3.2V301l-11.1-8.9-11.1 8.9v-14.2l-13.8-3.2 11.1-8.8-6.2-12.8 13.9 3.2zM376.1 116.1l6.2 12.9 13.8-3.2-6.2 12.8 11.2 8.8-13.9 3.1v14.3l-11.1-8.9-11.1 8.9.1-14.3-13.9-3.1 11.1-8.8-6.2-12.8L370 129zM413.1 38.3l6.2 12.8 13.8-3.2-6.2 12.8 11.2 8.9-13.9 3.1v14.2L413.1 78 402 86.9l.1-14.2-13.9-3.1 11.1-8.9-6.2-12.8 13.9 3.2zM464.9 96.7l6.2 12.8 13.9-3.2-6.3 12.8 11.2 8.9-13.9 3.1.1 14.2-11.2-8.9-11.1 8.9.1-14.2L440 128l11.2-8.9-6.3-12.8 13.9 3.2zM436.9 164.8l4.9 14.8h15.6l-12.6 9.2 4.8 14.9-12.7-9.2-12.6 9.2 4.8-14.9-12.6-9.2h15.6z"></path></g><path fill="#FFDA44" d="M306.8 254.7c-49.2 0-89.1-39.9-89.1-89.1s39.9-89.1 89.1-89.1c15.3 0 29.8 3.9 42.4 10.7C329.4 67.9 302.3 56 272.5 56c-60.5 0-109.6 49.1-109.6 109.6S212 275.3 272.5 275.3c29.8 0 56.9-11.9 76.6-31.3-12.6 6.8-27 10.7-42.3 10.7zM140.4 59.5C129.7 41 109.7 28.6 86.8 28.6S44 41 33.3 59.5h107.1zM140.6 59.9l-53.8 53.8-53.7-53.8C28 68.9 25 79.3 25 90.5c0 34.2 27.7 61.9 61.9 61.9s61.9-27.7 61.9-61.9c-.1-11.2-3.1-21.6-8.2-30.6z"></path><path fill="#A2001D" d="M71.4 98.2v52.2c4.9 1.3 10.1 1.9 15.5 1.9s10.5-.7 15.5-1.9V98.2h-31z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Cocos (Keeling) Islands +61</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.337h512v341.326H0z"></path><path fill="#D80027" d="M0 343.096h512v83.567H0z"></path><path fill="#0052B4" d="M0 256h512v87.096H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Colombia +57</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.337h512v341.326H0z"></path><path fill="#FFDA44" d="M0 85.337h512v85.337H0z"></path><path fill="white" d="M0 170.663h512V256H0z"></path><path fill="#D80027" d="M0 256h512v85.337H0z"></path><path fill="#6DA544" d="M256 256.006L0 426.668V85.331z"></path><g fill="white"><path d="M68.638 256c0-24.865 17.476-45.638 40.812-50.734a52.059 52.059 0 00-11.13-1.208c-28.688 0-51.942 23.255-51.942 51.942s23.255 51.942 51.942 51.942c3.822 0 7.543-.425 11.13-1.208-23.337-5.096-40.812-25.869-40.812-50.734z"></path><path d="M108.877 211.478l2.762 8.503h8.94l-7.232 5.256 2.762 8.502-7.232-5.255-7.234 5.255 2.764-8.502-7.234-5.256h8.94zM108.877 233.739l2.762 8.503h8.94l-7.232 5.255 2.762 8.503-7.232-5.255-7.234 5.255 2.764-8.503-7.234-5.255h8.94zM108.877 256l2.762 8.503h8.94l-7.232 5.255 2.762 8.503-7.232-5.255-7.234 5.255 2.764-8.503-7.234-5.255h8.94zM108.877 278.261l2.762 8.502h8.94l-7.232 5.256 2.762 8.503-7.232-5.255-7.234 5.255 2.764-8.503-7.234-5.256h8.94z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Comoros +269</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.331h512v341.337H0z"></path><path fill="#6DA544" d="M443.726 85.331L102.4 426.657H0V85.331z"></path><path fill="#FFDA44" d="M500.124 85.331L158.798 426.657H11.876L353.202 85.331z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Congo +242</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.332h512v341.337H0z"></path><g fill="white"><path d="M384 156.705l5.283 16.254h17.089l-13.826 10.045 5.281 16.254L384 189.211l-13.825 10.047 5.28-16.254-13.825-10.045h17.089zM313.791 185.786l15.228 7.758 12.084-12.083-2.673 16.879 15.227 7.759-16.879 2.673-2.674 16.88-7.76-15.227-16.878 2.673 12.086-12.084zM284.71 255.995l16.254-5.281.001-17.089 10.044 13.825 16.254-5.282-10.046 13.827 10.046 13.826-16.254-5.28-10.044 13.825v-17.09zM313.791 326.204l7.759-15.229-12.084-12.084 16.881 2.674 7.757-15.227 2.674 16.879 16.879 2.672-15.227 7.759 2.673 16.882-12.084-12.087zM384 355.284l-5.281-16.253h-17.091l13.827-10.045-5.28-16.254L384 322.776l13.827-10.044-5.281 16.254 13.826 10.045h-17.089zM454.209 326.204l-15.229-7.758-12.083 12.084 2.673-16.882-15.227-7.756 16.879-2.675 2.675-16.879 7.756 15.227 16.881-2.674-12.086 12.085zM483.29 255.995l-16.254 5.281v17.09l-10.045-13.826-16.254 5.281 10.046-13.826-10.046-13.827 16.254 5.282 10.045-13.825v17.089zM454.209 185.788l-7.757 15.226 12.082 12.084-16.881-2.673-7.756 15.227-2.675-16.88-16.879-2.675 15.227-7.757-2.673-16.878 12.084 12.082zM0 186.665v16h46.069L0 233.377v7.539l57.377-38.252H80L0 255.998h112v-69.334H0zm96 69.331H22.628L96 207.083v48.913zM176 138.665l80-53.334H144v69.334h112v-16h-46.069L256 107.951v-7.539l-57.377 38.251H176v.002zm-16-53.332h73.372L160 134.246V85.333zM144 255.998h112l-80-53.334h22.623L256 240.917v-7.539l-46.069-30.713H256v-16H144v69.333zm16-48.915l73.372 48.913H160v-48.913zM112 85.331H0l80 53.334H57.377L0 100.413v7.539l46.069 30.712H0v16h112V85.331zm-16 48.915L22.628 85.333H96v48.913z"></path></g><g fill="#D80027"><path d="M144 85.331h-32v69.334H0v32h112v69.333h32v-69.333h112v-32H144z"></path><path d="M80 138.665L0 85.331v15.082l57.377 38.252zM176 138.665h22.623L256 100.413V85.331zM57.377 202.665L0 240.917v15.081l80-53.333zM176 202.665l80 53.333v-15.081l-57.377-38.252z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Cook Islands +682</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.331h512v341.326H0z"></path><path fill="#D80027" d="M0 211.473h512v89.043H0z"></path><g fill="#0052B4"><path d="M0 352.462h512v74.207H0zM0 85.331h512v74.207H0z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Costa Rica +506</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.331h512v341.326H0z"></path><path fill="#6DA544" d="M330.207 85.331H512v341.337H330.207z"></path><path fill="#FF9811" d="M0 85.331h181.793v341.337H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Cote d'Ivoire +225</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h513v342H0z"></path><path fill="#D80027" d="M0 0h513v114H0z"></path><path fill="#0052B4" d="M0 228h513v114H0z"></path><g fill="#338AF3"><path d="M309.3 113.2v-44l17.5-14.4 17.7 14.4v44zM203.7 113.2v-44l-17.3-14.4-17.9 14.4v44zM238.9 113.2v-44l17.6-14.4 17.6 14.4v44z"></path></g><g fill="#0052B4"><path d="M309.3 113.2h-35.2v-44l17.5-14.4 17.7 14.4zM238.9 113.2h-35.2v-44l17.5-14.4 17.7 14.4z"></path></g><path stroke="#D80027" fill="white" d="M168.5 113.2v101.9c0 24.3 14.4 46.2 35.4 59.4 21.3 13.4 42.1 14.7 52.6 14.7s31.4-1.7 52.6-14.8c21-13 35.4-35.1 35.4-59.3V113.2h-176z"></path><g fill="#D80027"><path d="M168.5 113.2h35.2v35.2h-35.2zM238.9 113.2h35.2v35.2h-35.2zM309.3 113.2h35.2v35.2h-35.2zM203.7 148.4h35.2v35.2h-35.2zM274.1 148.4h35.2v35.2h-35.2zM168.5 183.6h35.2v35.2h-35.2zM203.7 218.8h35.2V254h-35.2zM238.9 183.6h35.2v35.2h-35.2zM309.3 183.6h35.2v35.2h-35.2zM274.1 218.8h35.2V254h-35.2zM309.3 274.3c8.6-5.4 16.2-12.3 22-20.3h-22v20.3zM181.7 254c5.8 8 13.3 14.9 22 20.4V254h-22zM238.9 254v33.7c7.2 1.2 13.3 1.5 17.6 1.5 4.3 0 10.4-.3 17.6-1.6V254h-35.2z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Croatia +385</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#FF9811" d="M0-40.8v422.9-211.4z"></path><path fill="white" d="M0 0h512v341.3H0z"></path><g fill="#0052B4"><path d="M0 0h512v68.3H0zM0 136.5h512v68.3H0zM0 273.1h512v68.3H0z"></path></g><path fill="#D80027" d="M256 170.7L0 341.3V0z"></path><path fill="white" d="M81.5 94.8l16.9 51.9H153l-44.2 32.1 16.9 52-44.2-32.1-44.2 32.1 16.9-52L10 146.7h54.6z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Cuba +53</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="white" d="M0 0h512v341.3H0z"></path><path fill="#6DA544" d="M371.5 275.9l-11.1-15c-22.4 16.1-67.7 35.8-104.3 35.8-35.8 0-79.6-17.1-104.3-35.8l-11.1 15c10 10.3 46.9 27 88.4 38.4-3.9 6-1.6 6.1 2.6 10.8 8.5-6.6 17.4-1.5 24.9-7.3 7.5 5.8 16.3.7 24.9 7.3 5.4-5.6 5.4-5.6 2.5-11.1 41-11.7 77-27.6 87.5-38.1z"></path><path fill="#DB7D00" d="M113.7 168.7s.2 79.9 89 77.8L208 263h10.6s-8.9-49 71.7-49.4c0 0 0-32.9 32.9-32.9h49.4S294 119 442.8 40.1l2.2-15.6s-154.8 84.6-237 68.1c0 0 12.7 50.7-12.9 50.7-12.8 0-11.6-9.6-38.4-9.6-22.3 0-20.6 23.5-31.3 23.2S103 142.3 102 144.8s11.7 23.9 11.7 23.9z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Cyprus +357</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.337h512v341.326H0z"></path><path fill="#D80027" d="M512 256v170.663H0L215.185 256z"></path><path fill="white" d="M512 85.337V256H215.185L0 85.337z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Czech Republic +420</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#338AF3" d="M0 0h512v341.3H0z"></path><path fill="#FFDA44" d="M512 66.9V0H411.7L0 274.4v66.9h100.3z"></path><path fill="#D80027" d="M512 0v40.1L60.2 341.3H0v-40.1L451.8 0z"></path><path fill="#FFDA44" d="M93.6 31.2l16.3 50.4H163l-42.9 31.2 16.4 50.5-42.9-31.2-43 31.2L67 112.8 24.1 81.6h53.1z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Democratic Republic of the Congo +243</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#D80027" d="M0 0h513v342H0z"></path><path fill="white" d="M190 0h-60v140H0v60h130v142h60V200h323v-60H190z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Denmark +45</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#6DA544" d="M0 0h512v341.3H0z"></path><path fill="#338AF3" d="M512 0v166.7L0 170.8V0z"></path><path fill="white" d="M256 170.7L0 341.3V0z"></path><path fill="#D80027" d="M89.8 92.5l17 52.4H162l-44.6 32.5 17 52.4-44.6-32.4-44.6 32.4 17-52.4-44.6-32.5h55.2z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Djibouti +253</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#496E2D" d="M0 0h512v341.3H0z"></path><path d="M0 110.7v120h512v-120z"></path><path fill="#FFDA44" d="M0 110.7h512v40H0z"></path><path fill="white" d="M0 190.7h512v40H0z"></path><path d="M196 0h120v341.3H196z"></path><path fill="#FFDA44" d="M196 0h40v341.3h-40z"></path><path fill="white" d="M274.7 0h40v341.3h-40z"></path><circle fill="#D80027" cx="256" cy="170.7" r="123.1"></circle><g fill="#496E2D"><path d="M256 58.6l4.6 14.2h15l-12.1 8.9 4.6 14.2-12.1-8.8-12.1 8.8 4.6-14.2-12.1-8.9h15zM190.1 80l12.2 8.8 12.1-8.8-4.6 14.3 12.1 8.8h-15l-4.6 14.2-4.7-14.2h-15l12.1-8.8zM149.4 136h15l4.6-14.2 4.7 14.2h15l-12.2 8.8 4.7 14.3-12.2-8.8-12.1 8.8 4.6-14.3zM149.4 205.3l12.1-8.8-4.6-14.3L169 191l12.2-8.8-4.7 14.3 12.2 8.8h-15l-4.7 14.3-4.6-14.3zM190.1 261.4l4.6-14.3-12.1-8.8h15l4.7-14.3 4.6 14.3h15l-12.1 8.8 4.6 14.3-12.1-8.9zM256 282.8l-4.6-14.3h-15l12.1-8.8-4.6-14.3 12.1 8.8 12.1-8.8-4.6 14.3 12.1 8.8h-15zM321.9 261.4l-12.2-8.9-12.1 8.9 4.6-14.3-12.1-8.8h15l4.6-14.3 4.7 14.3h15l-12.1 8.8zM362.6 205.3h-15l-4.6 14.3-4.7-14.3h-15l12.2-8.8-4.7-14.3L343 191l12.1-8.8-4.6 14.3zM362.6 136l-12.1 8.8 4.6 14.3-12.1-8.8-12.2 8.8 4.7-14.3-12.2-8.8h15l4.7-14.2 4.6 14.2zM321.9 80l-4.6 14.3 12.1 8.8h-15l-4.7 14.2-4.6-14.2h-15l12.1-8.8-4.6-14.3 12.1 8.8z"></path></g><path fill="#496E2D" d="M279.3 168.7c-11-21.1-14.5-25.1-14.5-25.1s.4-9.7.4-15.6c0-8.8-7.4-15.8-16.5-15.8-8.6 0-15.7 2.9-16.5 11-4.2.9-8.6 4.1-8.6 10.7 0 4.8 1 7.3 5.2 9.3 2.1-4.6 4.3-4.8 9.3-6.4.8.6 1.7 3 2.6 3.4l.3 1s-13.3 6.6-13.3 30.9c0 29.5 22 45.4 22 45.4l-1.8.3-1.9 7.1h22v-7.2l11 17.5c.3-.3 10.2-47.6.3-66.5z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Dominica +1767</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="white" d="M0 0h512v341.3H0z"></path><path fill="#D80027" d="M0 215.2h211.5v126.1H0z"></path><path fill="#0052B4" d="M0 0h211.5v126.2H0z"></path><path fill="#D80027" d="M300.5 0H512v126.2H300.5z"></path><path fill="#0052B4" d="M300.5 215.2H512v126.1H300.5z"></path><g stroke="white" stroke-width="5" stroke-miterlimit="10"><path fill="#0052B4" d="M256 130h-49.9v49.4s19.5 6 49.9 6V130z"></path><path fill="#D80027" d="M206.1 179.4v6c0 27.5 22.3 49.9 49.9 49.9v-49.9c-30.4 0-49.9-6-49.9-6z"></path><path fill="#0052B4" d="M256 235.3c27.5 0 49.9-22.3 49.9-49.9v-6s-19.5 6-49.9 6v49.9z"></path><path fill="#D80027" d="M256 130v55.4c30.4 0 49.9-6 49.9-6V130H256z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Dominican Republic +1849</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#FFDA44" d="M0 0h512v341.3H0z"></path><path fill="#0052B4" d="M0 170.7h512V256H0z"></path><path fill="#D80027" d="M0 256h512v85.3H0z"></path><circle fill="#FFDA44" cx="256" cy="170.7" r="59.4"></circle><path fill="#4C1F00" d="M369.2 79.9s-27.2-13.8-33.9-16c-6.7-2.2-49.1-13.2-49.1-7 0 10.3-13.5 12-15.5 12s-2-5.3-14.8-5.3-13.7 4.8-15.8 4.8c-2.2 0-14.5-1-14.5-11.5 0-5.2-42.9 4-49.1 7-6.1 3.1-33.9 16-33.9 16s45.8 2.7 53.9 6.2 43.8 16.5 43.8 16.5l-2.8 13.3h37.8l-3.8-13.3s35.1-12.7 43.8-16.5 53.9-6.2 53.9-6.2z"></path><path fill="#57BA17" d="M217.7 171.7c0 21.1 17.2 38.3 38.3 38.3 21.1 0 38.3-17.2 38.3-38.3v-11.5h-76.5v11.5z"></path><path fill="#338AF3" d="M256 110.5c-21.1 0-38.3 17.2-38.3 38.3v11.5h76.5v-11.5c.1-21.1-17.1-38.3-38.2-38.3z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Ecuador +593</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="white" d="M0 0h512v341.3H0z"></path><path fill="#D80027" d="M0 0h512v113.8H0z"></path><path d="M0 227.6h512v113.8H0z"></path><path fill="#C09300" d="M220.3 204.4s0-58.4 4.5-64.7c3.1-4.3 16.8 5.2 22.7 4.5 0 0 4.2-7.5 4.5-12 .3-4.6-1.1-7.6-4.9-6.2 0 0-1.2-2.1.5-3.3 1.6-1.2 5.6.1 5.6.1s-.5-1 1.6-.9c2.9.2 7.2 1.4 7.4 5.6.2 3.1.3 7.7.4 8.7.7 6.8 2.7 8.7 2.7 8.7s18.4-9.2 22-5.2c3.3 3.8 4.5 64.7 4.5 64.7l-18.1-16.8 12.1 29.5s-14.4 2.4-28.9 2.4c-14.5 0-31.1-4.2-31.1-4.2l13.8-28.2-19.3 17.3z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Egypt +20</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><g fill="#0052B4"><path d="M0 85.337h512v113.775H0zM0 312.888h512v113.775H0z"></path></g><path fill="#FFDA44" d="M228.582 261.936L256 214.447l27.418 47.489z"></path><path fill="#6DA544" d="M291.616 277.616L256 295.425l-35.616-17.809v-23.744h71.232z"></path><path fill="#FFDA44" d="M289.579 216.485l-12.592 12.592c5.37 5.372 8.693 12.791 8.693 20.988 0 16.392-13.289 29.68-29.68 29.68-16.392 0-29.68-13.289-29.68-29.68 0-8.195 3.322-15.616 8.693-20.988l-12.592-12.592c-8.594 8.594-13.91 20.466-13.91 33.579 0 26.228 21.261 47.489 47.489 47.489s47.489-21.261 47.489-47.489c0-13.114-5.316-24.987-13.91-33.579z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">El Salvador +503</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h513v342H0z"></path><path fill="#6DA544" d="M0 0h513v113.8H0z"></path><path fill="#D80027" d="M0 227.6h513V342H0z"></path><path fill="#0070C8" d="M126 170.7L0 341.3V0z"></path><path fill="none" stroke="black" stroke-miterlimit="10" d="M233.8 139.4v40.4c0 35.6 35.6 35.6 35.6 35.6s35.6 0 35.6-35.6v-40.4h-71.2z"></path><path fill="#786145" d="M264.5 179.8h9.8l4 25.8h-17.8z"></path><path fill="#6DA544" d="M287.2 162c0-9.8-8-14.8-17.8-14.8s-17.8 5-17.8 14.8c-4.9 0-8.9 4-8.9 8.9s4 8.9 8.9 8.9h35.6c4.9 0 8.9-4 8.9-8.9s-4-8.9-8.9-8.9z"></path><g fill="#FFDA00" stroke="black" stroke-miterlimit="10"><path d="M230.7 120l1.9 3.3h3.8l-1.9 3.3 1.9 3.2h-3.8l-1.9 3.3-1.9-3.3H225l1.9-3.2-1.9-3.3h3.8zM246 120l1.9 3.3h3.7l-1.9 3.3 1.9 3.2h-3.7l-1.9 3.3-1.9-3.3h-3.8l1.9-3.2-1.9-3.3h3.8zM261.3 120l1.9 3.3h3.7l-1.9 3.3 1.9 3.2h-3.7l-1.9 3.3-1.9-3.3h-3.8l1.9-3.2-1.9-3.3h3.8zM277.1 120l1.9 3.3h3.8l-1.9 3.3 1.9 3.2H279l-1.9 3.3-1.9-3.3h-3.7l1.8-3.2-1.8-3.3h3.7zM293.1 120l1.9 3.3h3.8l-1.9 3.3 1.9 3.2H295l-1.9 3.3-1.9-3.3h-3.7l1.8-3.2-1.8-3.3h3.7zM308.1 120l1.9 3.3h3.7l-1.9 3.3 1.9 3.2H310l-1.9 3.3-1.9-3.3h-3.8l1.9-3.2-1.9-3.3h3.8z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Equatorial Guinea +240</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#338AF3" d="M0 0h512v341.3H0z"></path><path fill="#56AF35" d="M0 0h512v170.7H0z"></path><path fill="#D80027" d="M0 341.3l512-170.7L0 0v341.3z"></path><g fill="#ffc945"><path d="M134.7 231.5c33.6 0 60.8-27.2 60.8-60.8s-27.2-60.8-60.8-60.8-60.8 27.2-60.8 60.8 27.2 60.8 60.8 60.8zm0 24.3c-47 0-85.2-38.1-85.2-85.2s38.1-85.2 85.2-85.2 85.2 38.1 85.2 85.2-38.2 85.2-85.2 85.2z"></path><circle cx="119.5" cy="148.3" r="17.5"></circle><circle cx="148.9" cy="158.5" r="17.5"></circle><circle cx="134.7" cy="135.2" r="17.5"></circle><circle cx="119.5" cy="172.7" r="17.5"></circle><circle cx="149.9" cy="182.8" r="17.5"></circle><circle cx="122.5" cy="198" r="17.5"></circle><circle cx="145.9" cy="205.2" r="17.5"></circle></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Eritrea +291</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#111" d="M0 85.337h512v341.326H0z"></path><path fill="#368FD8" d="M0 85.337h512v113.775H0z"></path><path fill="white" d="M0 312.888h512v113.775H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Estonia +372</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 600"><path fill="#2B5DEA" d="M0 0h900v600H0V0z"></path><path fill="#FFDF29" d="M0 100h900v400H0V100z"></path><path fill="#D70000" d="M0 150h900v300H0V150z"></path><path fill="white" d="M450 171.4v257.2c114.3 0 171.4-85.7 214.3-128.6-42.9-42.9-100-128.6-214.3-128.6z"></path><path d="M450 171.4c-100 0-171.4 85.7-214.3 128.6C278.6 342.9 350 428.6 450 428.6V171.4z"></path><path fill="white" d="M346.3 254.3h21v91.3h-21zM398.2 254.3h21v91.3h-21z"></path><path d="M477.8 254.3h21v91.3h-21zM529.7 254.3h21v91.3h-21z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Eswatini +268</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22.5 15"><path fill="#20AA46" d="M0 0h22.5v5H0V0z"></path><path fill="#E92F3B" d="M0 10h22.5v5H0v-5z"></path><path fill="#FADF50" d="M0 5h22.5v5H0V5z"></path><circle fill="#205CCA" cx="11.3" cy="7.5" r="5.2"></circle><path fill="#FFDB3D" d="M11.2 9.2L8.8 11l.9-2.9-2.4-1.8h3l1-2.8 1 2.9h3l-2.4 1.8.9 2.9-2.6-1.9zm0-1l.9.6-.3-1.1.9-.7h-1.1l-.4-1.1-.4 1.1H9.7l.9.7-.3 1.1c0 .1.9-.6.9-.6z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Ethiopia +251</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#0052B4" d="M0 0h512v341.3H0z"></path><path fill="white" d="M256 0v30.6l-45.2 25.1H256V115h-59.1l59.1 32.8v22.9h-26.7l-73.5-40.9v40.9h-55.6v-48.6l-87.5 48.6H0v-30.6L45.2 115H0V55.7h59.1L0 22.8V0h26.7l73.5 40.8V0h55.6v48.6L243.3 0z"></path><path fill="#D80027" d="M144 0h-32v69.3H0v32h112v69.4h32v-69.4h112v-32H144z"></path><path fill="#0052B4" d="M155.8 115L256 170.7v-15.8L184.2 115z"></path><path fill="white" d="M155.8 115L256 170.7v-15.8L184.2 115z"></path><g fill="#D80027"><path d="M155.8 115L256 170.7v-15.8L184.2 115zM71.8 115L0 154.9v15.8L100.2 115z"></path></g><path fill="#0052B4" d="M100.2 55.6L0 0v15.7l71.8 39.9z"></path><path fill="white" d="M100.2 55.6L0 0v15.7l71.8 39.9z"></path><g fill="#D80027"><path d="M100.2 55.6L0 0v15.7l71.8 39.9zM184.2 55.6L256 15.7V0L155.8 55.6z"></path></g><path fill="#1F8BDE" d="M312.2 194.2v-90c0-8.5 6.5-15.3 15-15.3h120.5c8.3 0 15 6.8 15 15.3v90c0 75.2-75.2 105.3-75.2 105.3s-75.3-30.1-75.3-105.3z"></path><path fill="white" d="M312.2 194.2v-90c0-8.5 6.5-15.3 15-15.3h120.5c8.3 0 15 6.8 15 15.3v90c0 75.2-75.2 105.3-75.2 105.3s-75.3-30.1-75.3-105.3zm79.6 86.3c7.9-4.5 15.9-10 23.2-16.7 20.5-18.5 32.6-41.4 32.6-69.7v-90c0-.3-120.4-.3-120.4-.3v90.3c0 28.3 12.1 51.2 32.6 69.7 8.3 7.5 17.6 13.9 27.6 19 1.4-.6 2.8-1.4 4.4-2.3z"></path><path fill="#187536" d="M347.1 193.4c-2.6-7.9 1.7-14.3 10.1-14.3h60.5c8.2 0 12.8 6.3 10.1 14.3l-5.5 16.5c-2.6 7.9-8.9 9.2-15.8 4 0 0 2.6-4.8-19.1-4.8-21.7 0-19.1 4.8-19.1 4.8-6.1 5.7-13.1 4-15.8-4 .1.1-5.4-16.5-5.4-16.5z"></path><path fill="white" d="M357.4 179.1c8.1 1.6 17.8-15 30.1-15 13.1 0 21.8 17.1 30.1 15 7.4-1.8 15-22.2 15-30.1 0-16.6-20.2-30.1-45.1-30.1-24.9 0-45.1 13.5-45.1 30.1-.1 8.5 6.6 28.5 15 30.1zM356 270.7c6.2.4 12.5-1.8 17.2-6.5l9-9c2.9-2.9 7.5-2.9 10.4 0l9 9c4.7 4.7 11 6.9 17.1 6.5 5.3-.3 32.5-33.5 25.7-32.6-4.6.6-9.1 2.8-12.7 6.3l-.1.1-9 9c-2.9 2.9-7.5 2.9-10.4 0l-9-9c-8.7-8.8-22.9-8.8-31.7-.1l-.1.1-9 9c-2.9 2.9-7.5 2.9-10.4 0l-9-9c-3.5-3.5-7.8-5.6-12.3-6.3-6.7-1.1 20.1 32.2 25.3 32.5zM322.1 210c2.9-2.9 7.5-2.9 10.4 0l9 9c8.8 8.7 22.9 8.7 31.7 0l9-9c2.9-2.9 7.5-2.9 10.4 0l9 9c8.8 8.7 22.9 8.7 31.7 0l9-9c2.9-2.9 7.5-2.9 10.4 0 0 0 5.5-14.8 2.5-15.9-7.9-2.9-17.2-1.2-23.5 5.2l-.1.1-9 9c-2.9 2.9-7.5 2.9-10.4 0l-9-9c-8.7-8.8-22.9-8.8-31.7-.1l-.1.1-9 9c-2.9 2.9-7.5 2.9-10.4 0l-9-9c-6.2-6.2-15.1-8-22.8-5.5-3.1 1.1 1.9 16.1 1.9 16.1z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Falkland Islands (Malvinas) +500</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="white" d="M0 0h512v341.3H0z"></path><path fill="#0F61A5" d="M512 214.5H206.2v126.8H118.4V214.5H0v-87.7h118.4V0H206.2v126.8H512V192z"></path><path fill="#E50E3D" d="M512 149.3V192H183.7v149.3H141V192H0v-42.7h141V0h42.7v149.3z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Faroe Islands +298</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#2E52B2" d="M0 0h512v341.3H0z"></path><path fill="white" d="M256 0v22.6l-46.1 30.7H256v64h-46.1L256 148v22.7h-22.6l-73.4-49v49H96v-49l-73.4 49H0V148l46.1-30.7H0v-64h46.1L0 22.6V0h22.6L96 48.9V0h64v48.9L233.4 0z"></path><g fill="#D80027"><path d="M144 0h-32v69.3H0v32h112v69.4h32v-69.4h112v-32H144z"></path><path d="M0 0v15.1l57.4 38.2H80zM256 0v15.1l-57.4 38.2H176z"></path><path d="M0 0v15.1l57.4 38.2H80zM256 0v15.1l-57.4 38.2H176zM0 170.7v-15.1l57.4-38.3H80zM256 170.7v-15.1l-57.4-38.3H176z"></path></g><path fill="#F3F3F3" d="M307.1 127.1v92c0 61.6 80.5 80.5 80.5 80.5s80.4-19 80.4-80.6v-92l-80.5-23-80.4 23.1z"></path><path fill="#D80027" d="M468 132.8V98.3H307.1v34.5h69v69h-69v23h69V296c6.9 2.5 11.5 3.5 11.5 3.5s4.6-1.1 11.5-3.5v-71.2h69v-23h-69v-69H468z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Fiji +679</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="white" d="M0 0h512v341.3H0z"></path><path fill="#2E52B2" d="M512 129.3V212H203.7v129.3H121V212H0v-82.7h121V0h82.7v129.3z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Finland +358</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.331h512v341.337H0z"></path><path fill="#0052B4" d="M0 85.331h170.663v341.337H0z"></path><path fill="#D80027" d="M341.337 85.331H512v341.337H341.337z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">France +33</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 90 60"><path fill="#FDEB01" d="M0 0l90 60H0z"></path><path fill="#58A846" d="M90 0v60L0 0z"></path><path fill="#ED3D24" stroke="#A02021" stroke-miterlimit="10" d="M54.1 35.3l14.7-10.7H50.6L45 7.3l-5.6 17.3H21.2l14.7 10.7-5.6 17.4L45 42l14.7 10.7z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">French Guiana +594</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><g fill="#D80027"><path d="M0 85.337h512v113.775H0zM0 312.888h512v113.775H0z"></path></g><path fill="#FFDA44" d="M293.991 256c0 20.982-17.01 33.243-37.992 33.243S218.008 276.982 218.008 256s17.01-37.992 37.992-37.992 37.991 17.01 37.991 37.992z"></path><path fill="#0052B4" d="M293.991 256c0 20.982-17.01 37.992-37.992 37.992s-37.992-17.01-37.992-37.992"></path><g fill="#D80027"><path d="M232.259 246.506h9.498v19h-9.498zM270.247 246.506h9.498v19h-9.498zM251.247 232.259h9.498v33.243h-9.498z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">French Polynesia +689</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.337h512v341.326H0z"></path><path fill="#6DA544" d="M0 85.337h512v113.775H0z"></path><path fill="#0052B4" d="M0 312.888h512v113.775H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Gabon +241</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#1a7e25" d="M0 322.783h512v103.88H0z"></path><path fill="#cf0d19" d="M0 85.337h512v104.515H0z"></path><path fill="#0052B4" d="M0 210.877h512v89.656H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Gambia +220</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22.5 15"><path fill="white" d="M.8 0h21v15H.8V0z"></path><path fill="#eb000e" d="M9.8 6H0v3h9.8v6h3V9h9.8V6h-9.8V0h-3v6z"></path><path fill="#eb000e" d="M17.3 2.7l-.2-1.2h1l-.2 1.2 1.2-.2v1l-1.2-.2.2 1.2h-1l.2-1.2-1.2.2v-1l1.2.2zm-12.7 0l-.2-1.2h1l-.2 1.2 1.2-.2v1l-1.2-.2.2 1.2h-1l.2-1.2-1.2.2v-1l1.2.2zm0 9l-.2-1.2h1l-.2 1.2 1.2-.2v1l-1.2-.2.2 1.2h-1l.2-1.2-1.2.2v-1l1.2.2zm12.7 0l-.2-1.2h1l-.2 1.2 1.2-.2v1l-1.2-.2.2 1.2h-1l.2-1.2-1.2.2v-1l1.2.2z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Georgia +995</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.337h512v341.326H0z"></path><path fill="#D80027" d="M0 85.337h512v113.775H0z"></path><path fill="#496E2D" d="M0 312.888h512v113.775H0z"></path><path d="M255.883 199.111l14.119 43.458 40.366 3.2-36.969 26.861 19.453 40.259-36.969-26.859-36.97 26.859 14.123-43.459-36.969-26.861h45.696z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Ghana +233</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h513v342H0z"></path><path fill="#D80027" d="M0 230h513v112H0z"></path><path fill="#D80027" stroke="black" stroke-miterlimit="10" d="M363.1 131.8V99.1H374V77.3h-21.9v10.9h-21.8V77.3h-21.8v21.8h10.9v32.7h-21.8V55.5h10.9V33.7h-21.8v10.9h-10.9V33.7H254v10.9h-10.9V33.7h-21.8v21.8h10.9v76.3h-21.8V99.1h10.9V77.3h-21.8v10.9h-21.8V77.3h-21.8v21.8h10.9v32.7H145V219h239.9v-87.2z"></path><path fill="#FFDA44" stroke="black" stroke-miterlimit="10" d="M264.9 235.5l-24.2 18.2 19.1 14.3v31.3h-23.2v9h23v7.9h-23v9.3H270V268l19.1-14.3-24.2-18.2zm0 25.3l-10.1-7.1 10.1-7.1 10.1 7.1-10.1 7.1z"></path><path d="M239.6 209.7v-27.9s.1-22.3 25-22.3c24.8 0 25.7 22 25.7 22v28.2h-50.7zM170.5 209.7v-24.3s.1-18.7 19.6-18.7 20.2 18.4 20.2 18.4v24.5h-39.8z"></path><path d="M169.1 209.7v-24.3s.1-18.7 19.6-18.7 20.2 18.4 20.2 18.4v24.5h-39.8zM320.9 209.7v-24.3s.1-18.7 19.6-18.7 20.2 18.4 20.2 18.4v24.5h-39.8zM329.3 132v-15.7s.1-12.1 11.3-12.1c11.3 0 11.7 11.9 11.7 11.9V132h-23zM250.5 132v-23.7s.1-18.3 14.3-18.3c14.2 0 14.7 18 14.7 18v24h-29zM177.5 132v-15.7s.1-12.1 11.3-12.1 11.7 11.9 11.7 11.9V132h-23z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Gibraltar +350</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h513v342H0z"></path><g fill="#1571CC"><path d="M0 0h513v38H0zM0 76h513v38H0zM0 152h513v38H0zM0 228h513v38H0zM0 304h513v38H0z"></path></g><path fill="#1571CC" d="M0 0h190v190H0z"></path><g fill="white"><path d="M0 76h190v38H0z"></path><path d="M76 0h38v190H76z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Greece +30</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#D80027" d="M0 0h513v342H0z"></path><path fill="white" d="M513 0v171H0V0z"></path><circle fill="white" cx="185.8" cy="171.2" r="117.8"></circle><path fill="#D80027" d="M68 171c0-65.1 52.8-117.8 117.8-117.8 65.1 0 117.8 52.8 117.8 117.8"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Greenland +299</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#c60a0a" d="M0 0h512v341.3H0z"></path><path fill="#3E8446" d="M256 170.7L44.5 296.8V44.5z"></path><g fill="#FFDA44"><path d="M256 170.7l211.5 126.1h-423zM467.5 44.5L256 170.7 44.5 44.5z"></path></g><path fill="#3E8446" d="M467.5 44.5v252.3L256 170.7z"></path><g fill="#FFDA44"><path d="M256 10.4l3.3 10.2H270l-8.6 6.3 3.3 10.2-8.7-6.3-8.7 6.3 3.3-10.2-8.6-6.3h10.7zM170.1 10.4l3.3 10.2h10.7l-8.6 6.3 3.3 10.2-8.7-6.3-8.7 6.3 3.3-10.2-8.6-6.3h10.7zM341.9 10.4l3.3 10.2H356l-8.7 6.3 3.3 10.2-8.7-6.3-8.7 6.3 3.3-10.2-8.6-6.3h10.7zM256 304.2l3.3 10.2H270l-8.6 6.3 3.3 10.2-8.7-6.3-8.7 6.3 3.3-10.2-8.6-6.3h10.7zM170.1 304.2l3.3 10.2h10.7l-8.6 6.3 3.3 10.2-8.7-6.3-8.7 6.3 3.3-10.2-8.6-6.3h10.7zM341.9 304.2l3.3 10.2H356l-8.7 6.3 3.3 10.2-8.7-6.3-8.7 6.3 3.3-10.2-8.6-6.3h10.7z"></path></g><circle fill="#c60a0a" cx="244.5" cy="170.7" r="76.2"></circle><path fill="#FFDA44" d="M244.5 110.1l13.6 41.8h44l-35.6 25.8 13.6 41.8-35.6-25.8-35.5 25.8 13.6-41.8-35.6-25.8h44zM107.7 167.8c4.4 6.9 2.3 16.1-4.6 20.5s-16.1 2.3-20.5-4.6c-7.9-12.5-3.3-33-3.3-33s20.4 4.6 28.4 17.1z"></path><circle fill="#A2001D" cx="99.1" cy="182.1" r="7.4"></circle></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Grenada +1473</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.331h512v341.337H0z"></path><path fill="#0052B4" d="M0 85.331h170.663v341.337H0z"></path><path fill="#D80027" d="M341.337 85.331H512v341.337H341.337z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Guadeloupe +590</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#D80027" d="M0 0h512v341.3H0z"></path><path fill="#0052B4" d="M11.1 11.1h489.7v319.1H11.1z"></path><path fill="#7DBEF1" d="M256 285.3s76.4-51.3 76.4-114.6S256 56 256 56s-76.4 51.3-76.4 114.6S256 285.3 256 285.3z"></path><path fill="#1C8AE6" d="M179.8 180.7h152.6l-29.3 64.9h-95.2z"></path><path fill="#FFF042" d="M192.3 205.9s40.5 38.2 51 38.2c12.4 0 12.6-18.4 25.5-25.5 20.2-11.1 51-12.7 51-12.7L297 248.7l-41 36.6-46.8-39.7-16.9-39.7z"></path><path fill="#259C7B" d="M256 157.5l-22.5 15.6 7.9-26.2-21.8-16.5 27.4-.5 9-25.9 9 25.9 27.4.5-21.8 16.6 7.9 26.2-22.5-15.7z"></path><path fill="#8E5715" d="M249.7 144.6c-.9 9.2-1.5 18.4-1.7 27.6-.3 11.9.3 20.7 2 26 2.2 6.6 7.2 12.9 14.2 18.9 5.3 4.6 10.6 8.1 14.2 10.1 3.1 1.7 7 .6 8.7-2.4 1.7-3.1.6-7-2.4-8.7-4.3-2.5-8.4-5.4-12.2-8.7-5.4-4.6-9.1-9.2-10.4-13.3-1.1-3.4-1.6-11.3-1.4-21.7.2-8.9.8-17.8 1.7-26.6.4-3.5-2.2-6.6-5.7-7-3.6-.3-6.7 2.3-7 5.8z"></path><path fill="white" d="M217.8 170.7l25.5 38.2h-25.5v-38.2z"></path><path fill="none" stroke="#D80027" stroke-width="12" stroke-miterlimit="10" d="M256 285.3s76.4-51.3 76.4-114.6S256 56 256 56s-76.4 51.3-76.4 114.6S256 285.3 256 285.3z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Guam +1671</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h513v342H0z"></path><g fill="#338AF3"><path d="M0 0h171v342H0zM342 0h171v342H342z"></path></g><circle fill="#DCC26D" cx="256" cy="155.8" r="25.5"></circle><path fill="#628A40" d="M194.2 155.9c0 22.1 11.8 42.5 30.8 53.5 5.9 3.4 13.5 1.4 16.9-4.5 3.4-5.9 1.4-13.5-4.5-16.9-11.5-6.6-18.5-18.9-18.5-32.1 0-6.8-5.5-12.4-12.4-12.4s-12.3 5.5-12.3 12.4zm95.1 52.1c17.8-11.4 28.6-31 28.5-52.1 0-6.8-5.5-12.4-12.4-12.4-6.8 0-12.4 5.5-12.4 12.4 0 12.7-6.5 24.5-17.1 31.3-5.8 3.6-7.7 11.2-4.1 17 3.6 5.8 11.2 7.7 17 4.1.2-.1.3-.2.5-.3z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Guatemala +502</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h513v342H0z"></path><path fill="#D80027" d="M308 0H204v118.7H0v104h204V342h104V222.7h205v-104H308z"></path><path fill="#FFDA44" d="M368.6 188l26 17.3V136l-26 17.3h-95.3V58.1l17.3-26h-69.2l17.3 26v95.2h-95.3l-26-17.3v69.3l26-17.3h95.3v95.2l-17.3 26h69.2l-17.3-26V188z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Guernsey +44</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#FFDA44" d="M0 0h512v342H0z"></path><path fill="#6DA544" d="M342 0h171v342H342z"></path><path fill="#D80027" d="M0 0h171v342H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Guinea +224</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#6DA544" d="M0 85.331h512v341.337H0z"></path><path fill="#FFDA44" d="M0 85.331h512v170.663H0z"></path><path fill="#D80027" d="M0 85.331h181.793v341.337H0z"></path><path d="M98.32 195.127l15.107 46.497h48.894l-39.555 28.74 15.108 46.498-39.554-28.737-39.556 28.737 15.111-46.498-39.554-28.74h48.891z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Guinea-Bissau +245</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 600"><path fill="#009E49" d="M0 0h900v600H0V0z"></path><path fill="white" d="M0 0l947 300L0 600V0z"></path><path fill="#FFD00D" d="M0 26.1L870 300 0 573.9V26.1z"></path><path fill="#2D2D2D" d="M0 0l450 300L0 600V0z"></path><path fill="#D3132F" d="M0 35l397.5 265L0 565V35z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Guyana +592</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#A2001D" d="M0 0h513v172H0z"></path><path fill="#0052B4" d="M0 172h513v172H0z"></path><path fill="white" d="M381.4 251.5l-110.7-13.8-110.8 13.8V85.4h221.5z"></path><circle fill="#0052B4" cx="270.7" cy="182.3" r="55.4"></circle><circle fill="#A2001D" cx="270.7" cy="182.3" r="27.7"></circle><path fill="#6DA544" d="M229.1 113.1h83.1l-41.5 41.5z"></path><path fill="#FFDA44" d="M256.8 140.8h27.7v83h-27.7z"></path><path fill="#6DA544" d="M314.9 215.5h-88.5l-66.5 36h221.5z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Haiti +509</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.331h512v341.326H0z"></path><path fill="white" d="M256 85.331h256v341.337H256z"></path><path fill="#ACABB1" d="M321.353 233.837l32.073 42.43c-5.053 7.651-5.026 17.961.817 25.692 7.414 9.807 21.374 11.748 31.182 4.335 9.807-7.414 11.748-21.374 4.334-31.182-5.843-7.731-15.756-10.568-24.495-7.795l-49.988-66.129-11.838 8.949-17.759 13.424 17.899 23.677 17.775-13.401zm46.175 48.78a7.421 7.421 0 118.95 11.84 7.421 7.421 0 01-8.95-11.84z"></path><path fill="#FFDA44" d="M376.367 247.24l17.899-23.677-17.759-13.424-11.838-8.949-49.988 66.129c-8.74-2.775-18.651.063-24.495 7.795-7.414 9.808-5.473 23.768 4.334 31.182 9.808 7.414 23.768 5.473 31.182-4.335 5.845-7.731 5.871-18.041.817-25.692l32.073-42.43 17.775 13.401zm-62.504 45.771a7.42 7.42 0 11-11.84-8.95 7.42 7.42 0 0111.84 8.95z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Holy See (Vatican City State) +379</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h513v342H0z"></path><g fill="#338AF3"><path d="M0 0h513v114H0zM0 228h513v114H0zM203.5 117.9l6.7 16.6 17.6 1-14 10.9 4.7 17.7-15-9.9-15 9.9 4.7-17.7-14-10.9 17.6-1zM308.5 117.9l6.7 16.6 17.6 1-14 10.9 4.7 17.7-15-9.9-15 9.9 4.7-17.7-14-10.9 17.6-1zM256 147.6l6.7 16.6 17.6 1-14 10.9 4.7 17.7-15-9.9-15 9.9 4.7-17.7-14-10.9 17.6-1zM203.5 177.3l6.7 16.6 17.6 1-14 10.9 4.7 17.6-15-9.9-15 9.9 4.7-17.6-14-10.9 17.6-1zM308.5 177.3l6.7 16.6 17.6 1-14 10.9 4.7 17.6-15-9.9-15 9.9 4.7-17.6-14-10.9 17.6-1z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Honduras +504</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#D80027" d="M0 85.337h512v113.775H0z"></path><path fill="#6DA544" d="M0 312.888h512v113.775H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Hungary +36</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.334h512v341.337H0z"></path><path fill="white" d="M512 295.883H202.195v130.783H122.435V295.883H0V216.111h122.435V85.329H202.195v130.782H512V277.329z"></path><path fill="#D80027" d="M512 234.666v42.663H183.652v149.337h-42.674V277.329H0v-42.663h140.978V85.329h42.674v149.337z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Iceland +354</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#A2001D" d="M0 85.337h512V256H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Indonesia +62</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h512v342H0z"></path><path fill="#6DA544" d="M0 0h513v114H0z"></path><g fill="#D80027"><path d="M0 227.9h513v114H0zM278.8 134.8c.1 2 8.7 26.2 4.4 39.4-6.6 20.3-15.8 21.8-19.8 24.5V134l-6.9-4.2-6.9 4.2v64.7c-4-2.7-12.4-2.4-19.8-24.5-4.3-12.7 5.7-37.3 5.8-39.2 0 0-9.5 8.1-15.8 24-5.9 14.8 1.9 49.6 29.5 54.8 2.3.4 4.7 5.6 7.2 5.6 2.1 0 4.1-5.2 6-5.5 28.4-4.6 35-41.7 29.9-55.6-5.4-14.6-13.6-23.5-13.6-23.5z"></path></g><g fill="white" opacity=".5"><path d="M44.6 98.9h22.3v24.4H44.6zM0 98.9h22.3v24.4H0zM89.2 98.9h22.3v24.4H89.2zM133.8 98.9h22.3v24.4h-22.3zM178.4 98.9h22.3v24.4h-22.3zM223 98.9h22.3v24.4H223zM267.7 98.9H290v24.4h-22.3zM312.3 98.9h22.3v24.4h-22.3zM356.9 98.9h22.3v24.4h-22.3zM401.5 98.9h22.3v24.4h-22.3zM446.1 98.9h22.3v24.4h-22.3zM490.7 98.9H513v24.4h-22.3zM44.6 216.9h22.3v25.5H44.6zM0 216.9h22.3v25.5H0zM89.2 216.9h22.3v25.5H89.2zM133.8 216.9h22.3v25.5h-22.3zM178.4 216.9h22.3v25.5h-22.3zM223 216.9h22.3v25.5H223zM267.7 216.9H290v25.5h-22.3zM312.3 216.9h22.3v25.5h-22.3zM356.9 216.9h22.3v25.5h-22.3zM401.5 216.9h22.3v25.5h-22.3zM446.1 216.9h22.3v25.5h-22.3zM490.7 216.9H513v25.5h-22.3z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Iran +98</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h513v342H0z"></path><path fill="#CE1126" d="M0 0h513v114H0z"></path><path d="M0 228h513v114H0z"></path><g fill="#547C31"><path d="M219.2 160.7h-29.3c1.5-5.7 6.6-9.9 12.8-9.9v-19.9c-18.3 0-33.1 14.9-33.1 33.1v16.5h49.6c1.8 0 3.3 1.5 3.3 3.3v6.6h-66.2v19.9h86.1v-26.5c0-12.7-10.4-23.1-23.2-23.1zM268.8 190.5v-59.6H249v79.5h33.1v-19.9zM335 190.5v-59.6h-19.8v59.6h-6.6v-19.8h-19.9v39.7h59.6v-19.9z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Iraq +964</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#E52D42" d="M0 0h513v342H0z"></path><path fill="white" d="M393.3 68.2h-45.8l-33.8 80.2-34.4-22.9s-24.7-59.1-34.4-68.2c-9.7-9.7-18.7-.6-48.9 7.8-29.6 8.4-30.8 18.7-42.2 18.7-4.8 0-19.9-17.5-27.7-22.3-12.1-7.8-16.9-4.2-13.9 7.2 1.2 4.8 10.9 10.9 16.9 19.9 7.8 11.5 12.7 25.9 12.7 25.9s10.9-10.3 16.9-12.1c9-2.4 19.3 1.8 31.4 0 15.1-2.4 31.4-10.9 31.4-10.9l4.2 43.4s-54.3 50.7-49.5 70.6 56.1 44.6 68.2 62.7c12.1 17.5-7.2 24.1-7.2 32.6s-1.8 19.9 7.2 16.3c9-3.6 10.3-18.1 18.7-31.4 6-9 10.3-13.9 11.5-17.5 1.8-9-23.5-32-37.4-48.9-6.6-7.8-19.9-18.7-19.9-18.7l39.2-29.6s67.6 27.7 82.6 18.7c15.1-9 19.3-98.3 19.3-98.3l47-11.5-12.1-11.7z"></path><path fill="#F8DD4E" d="M279.3 262.4c-6 0-11.5-4.8-11.5-11.5s4.8-11.5 11.5-11.5c6 0 11.5 4.8 11.5 11.5s-5.5 11.5-11.5 11.5zm45.8-182.8c-6 0-11.5-4.8-11.5-11.5s4.8-11.5 11.5-11.5c6 0 11.5 4.8 11.5 11.5s-5.5 11.5-11.5 11.5zm0 91.1c-6 0-11.5-4.8-11.5-11.5 0-6 4.8-11.5 11.5-11.5 6 0 11.5 4.8 11.5 11.5-.6 6.7-5.5 11.5-11.5 11.5zm-136.9 45.8c-6 0-11.5-4.8-11.5-11.5 0-6 4.8-11.5 11.5-11.5 6.6 0 11.5 4.8 11.5 11.5s-5.5 11.5-11.5 11.5zm45.2-136.9c-6 0-11.5-4.8-11.5-11.5s4.8-11.5 11.5-11.5c6 0 11.5 4.8 11.5 11.5s-4.8 11.5-11.5 11.5zm22.9 91.1c-6 0-11.5-10.3-11.5-22.9s4.8-22.9 11.5-22.9c6 0 11.5 10.3 11.5 22.9s-4.8 22.9-11.5 22.9zm-114-45.2c-6 0-11.5-4.8-11.5-11.5 0-6.6 4.8-11.5 11.5-11.5 6.6 0 11.5 4.8 11.5 11.5 0 6.6-4.8 11.5-11.5 11.5z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Isle of Man +44</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h513v342H0z"></path><g fill="#2E52B2"><path d="M340.6 122.4h-56.1l-28-48.6-28 48.6h-56.1l28 48.6-28 48.6h56.1l28 48.6 28-48.6h56.1l-28-48.6 28-48.6zM293.2 171L276 204.2h-38.9L219.8 171l17.2-33.2h38.9l17.3 33.2zm-36.7-71.8l11.9 23.3h-23.9l12-23.3zm-58.3 38.6h23.9l-10.8 21-13.1-21zm0 66.4l13-22.1 11.9 22.1h-24.9zm58.3 37.5l-11.9-22.1h23.9l-12 22.1zm59.4-37.5h-25l11.9-22.1 13.1 22.1zm-26.1-66.4h26.1l-13 22.1-13.1-22.1zM0 21.3h512V64H0zM0 277.3h512V320H0z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Israel +972</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M341.334 85.33H0v341.332h512V85.33z"></path><path fill="#6DA544" d="M0 85.333h170.663V426.67H0z"></path><path fill="#D80027" d="M341.337 85.333H512V426.67H341.337z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Italy +39</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#6DA544" d="M0 85.337h512v341.326H0z"></path><path d="M215.864 256.006L0 399.911V112.089zM512 112.089v287.822L296.136 256.006z"></path><path fill="#0052B4" d="M512 112.089L296.136 256.006 512 399.911v26.757h-40.125L256 282.752 40.125 426.668H0v-26.757l215.864-143.905L0 112.089V85.331h40.125L256 229.248 471.875 85.331H512z"></path><path fill="#FFDA44" d="M512 112.089L296.136 256.006 512 399.911v26.757h-40.125L256 282.752 40.125 426.668H0v-26.757l215.864-143.905L0 112.089V85.331h40.125L256 229.248 471.875 85.331H512z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Jamaica +1876</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.331h512v341.337H0z"></path><circle fill="#D80027" cx="256" cy="255.994" r="96"></circle></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Japan +81</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h513v342H0z"></path><path fill="#D80027" d="M301.8 171L513 30.2V0h-45.3L256.5 140.8 45.3 0H0v30.2L211.2 171 0 311.8V342h45.3l211.2-140.8L467.7 342H513v-30.2z"></path><path fill="#FFDA44" d="M233.7 44.6l22.3 5.6 22.3-5.6 4-20.9-14.9 6.5L256 14.8l-11.4 15.4-14.9-6.5z"></path><path fill="#D80027" d="M233.7 44.6s-4 12.9-4 29.9c0 27.9 26.3 41.3 26.3 41.3s26.3-15.5 26.3-41.3c0-15.4-4-29.9-4-29.9s-8.1-5-22.3-5-22.3 5-22.3 5z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Jersey +44</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.339h512v341.326H0z"></path><path d="M0 85.339h512v113.775H0z"></path><path fill="#6DA544" d="M0 312.89h512v113.775H0z"></path><path fill="#D80027" d="M256 256.006L0 426.669V85.331z"></path><path fill="white" d="M77.913 224.802l7.876 16.469 17.786-4.11-7.965 16.426 14.303 11.343-17.808 4.014.049 18.255-14.241-11.421-14.241 11.421.05-18.255-17.809-4.014 14.303-11.343-7.965-16.426 17.786 4.11z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Jordan +962</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#36B6CC" d="M0 0h513v342H0V0z"></path><circle fill="#FFD400" cx="256.5" cy="170.9" r="68.4"></circle><path fill="#FFD400" d="M256.5 251.5l-27.9 41.7-7.1-49.7-43.2 25.5 15.2-47.8-50 4.2 34.4-36.5-46.9-18 46.8-18-34.4-36.5 50 4.2-15.2-47.8 43.2 25.4 7.1-49.7 27.9 41.7 27.9-41.7 7.1 49.7 43.2-25.4-15.2 47.8 50-4.2-34.3 36.6 46.8 17.9-46.8 18 34.4 36.5-50-4.2 15.2 47.8-43.2-25.4-7.1 49.7c0-.1-27.9-41.8-27.9-41.8zm0-.8c44.1 0 79.9-35.8 79.9-79.9S300.6 91 256.5 91s-79.9 35.8-79.9 79.9 35.8 79.8 79.9 79.8zM22.8 28.3c0-3.2 2.4-5.7 5.7-5.7h11.3c3.2 0 5.7 2.4 5.7 5.7v11.3c.1 3.1-2.4 5.7-5.6 5.7H28.5c-3.1 0-5.7-2.5-5.7-5.6v-.1-11.3zm0 45.7c0-3.2 2.4-5.7 5.7-5.7h11.3c3.2 0 5.7 2.4 5.7 5.7v11.3c.1 3.1-2.4 5.7-5.6 5.7H28.5c-3.1 0-5.7-2.5-5.7-5.6V74zm0 45.6c0-3.2 2.4-5.7 5.7-5.7h11.3c3.2 0 5.7 2.4 5.7 5.7v11.3c.1 3.1-2.4 5.7-5.6 5.7H28.5c-3.1 0-5.7-2.5-5.7-5.6v-.1-11.3zm0 45.6c0-3.2 2.4-5.7 5.7-5.7h11.3c3.2 0 5.7 2.4 5.7 5.7v11.3c.1 3.1-2.4 5.7-5.6 5.7H28.5c-3.1 0-5.7-2.5-5.7-5.6v-.1-11.3zm0 45.7c0-3.2 2.4-5.7 5.7-5.7h11.3c3.2 0 5.7 2.4 5.7 5.7v11.3c.1 3.1-2.4 5.7-5.6 5.7H28.5c-3.1 0-5.7-2.5-5.7-5.6v-11.4zm0 45.6c0-3.2 2.4-5.7 5.7-5.7h11.3c3.2 0 5.7 2.4 5.7 5.7v11.3c.1 3.1-2.4 5.7-5.6 5.7H28.5c-3.1 0-5.7-2.5-5.7-5.6v-11.4zm0 45.6c0-3.2 2.4-5.7 5.7-5.7h11.3c3.2 0 5.7 2.4 5.7 5.7v11.3c.1 3.1-2.4 5.7-5.6 5.7H28.5c-3.1 0-5.7-2.5-5.7-5.6v-11.4zm22.8-22.8c0-3.2 2.4-5.7 5.7-5.7h11.3c3.2 0 5.7 2.4 5.7 5.7v11.3c.1 3.1-2.4 5.7-5.6 5.7H51.3c-3.1 0-5.7-2.5-5.7-5.6v-11.4zm0-45.6c0-3.2 2.4-5.7 5.7-5.7h11.3c3.2 0 5.7 2.4 5.7 5.7V245c.1 3.1-2.4 5.7-5.6 5.7H51.3c-3.1 0-5.7-2.5-5.7-5.6v-11.4zm0-45.7c0-3.2 2.4-5.7 5.7-5.7h11.3c3.2 0 5.7 2.4 5.7 5.7v11.3c.1 3.1-2.4 5.7-5.6 5.7H51.3c-3.1 0-5.7-2.5-5.7-5.6V188zm0-45.6c0-3.2 2.4-5.7 5.7-5.7h11.3c3.2 0 5.7 2.4 5.7 5.7v11.3c.1 3.1-2.4 5.7-5.6 5.7H51.3c-3.1 0-5.7-2.5-5.7-5.6v-.1-11.3zm0-45.6c0-3.2 2.4-5.7 5.7-5.7h11.3c3.2 0 5.7 2.4 5.7 5.7v11.3c.1 3.1-2.4 5.7-5.6 5.7H51.3c-3.1 0-5.7-2.5-5.7-5.6v-.1-11.3zm0-45.6c0-3.2 2.4-5.7 5.7-5.7h11.3c3.2 0 5.7 2.4 5.7 5.7v11.3c.1 3.1-2.4 5.7-5.6 5.7H51.3c-3.1 0-5.7-2.5-5.7-5.6V51.2z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Kazakhstan +77</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.331h512v341.337H0z"></path><path d="M0 85.331h512v90.579H0z"></path><path fill="#496E2D" d="M0 336.089h512v90.568H0z"></path><path fill="#A2001D" d="M0 198.606h512v114.799H0z"></path><g fill="white"><path d="M323.265 139.803l-25.583-11.809L256 222.376l-41.682-94.382-25.583 11.809 51.749 116.191-51.749 116.192 25.583 11.808L256 289.613l41.682 94.381 25.583-11.808-51.749-116.192z"></path><path d="M273.376 150.931C263.472 140.115 256 133.898 256 133.898s-7.472 6.216-17.376 17.032v210.127C248.528 371.873 256 378.091 256 378.091s7.472-6.216 17.376-17.033V150.931z"></path></g><g fill="#A2001D"><path d="M209.04 191.226v129.535c10.465 18.542 23.274 33.742 32.872 43.818V147.408c-9.599 10.076-22.408 25.275-32.872 43.818zM302.96 191.226c-10.465-18.543-23.274-33.742-32.872-43.818V364.58c9.599-10.077 22.407-25.276 32.872-43.818V191.226z"></path></g><path d="M302.96 191.226v129.535c10.594-18.774 18.784-40.973 18.784-64.767s-8.19-45.993-18.784-64.768zM209.04 191.226v129.535c-10.594-18.774-18.784-40.973-18.784-64.767s8.19-45.993 18.784-64.768z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Kenya +254</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 450 300"><path fill="#CE1126" d="M0 0h450v300H0V0z"></path><g fill="#FCD116"><circle cx="227.6" cy="161.2" r="56.2"></circle><path d="M254.1 73.4l-23.7 26 28.6 6.5zM202.6 73.6l-4.8 33.1 28.5-8zM296.9 100.3l-34.7 8.5 20.1 23.7zM158.6 98.5l15.5 32.7 20.2-22.7zM317.6 143.8l-34.4-9.9 5.6 29.5zM135.6 141.2l31.9 19.8 5.2-27.7z"></path></g><path fill="#003F87" d="M0 175h450v125H0V175z"></path><path fill="white" d="M0 267c15 0 30 13 45 13s30-13 45-13 30 13 45 13 30-13 45-13 30 13 45 13 30-13 45-13 30 13 45 13 30-13 45-13 30 13 45 13 30-13 45-13v-21c-15 0-30 13-45 13s-30-13-45-13-30 13-45 13-30-13-45-13-30 13-45 13-30-13-45-13-30 13-45 13-30-13-45-13-30 13-45 13-30-13-45-13v21zm0-43c15 0 30 13 45 13s30-13 45-13 30 13 45 13 30-13 45-13 30 13 45 13 30-13 45-13 30 13 45 13 30-13 45-13 30 13 45 13 30-13 45-13v-21c-15 0-30 13-45 13s-30-13-45-13-30 13-45 13-30-13-45-13-30 13-45 13-30-13-45-13-30 13-45 13-30-13-45-13-30 13-45 13-30-13-45-13v21zm0-43c15 0 30 13 45 13s30-13 45-13 30 13 45 13 30-13 45-13 30 13 45 13 30-13 45-13 30 13 45 13 30-13 45-13 30 13 45 13 30-13 45-13v-21c-15 0-30 13-45 13s-30-13-45-13-30 13-45 13-30-13-45-13-30 13-45 13-30-13-45-13-30 13-45 13-30-13-45-13-30 13-45 13-30-13-45-13v21z"></path><path fill-rule="evenodd" clip-rule="evenodd" fill="#FCD116" d="M183.2 48.3l-1.1-5.3 22.4-3.7s-30.1-7.1-40-10.7c-14.3-5.1-16.3-12.1-16.3-12.1s44.7 11 64.8 11c4.3 0 12.8 10.7 12.8 10.7s14.8-14.9 21.9-15.4c32.1-2.3 66.6-6.4 66.6-6.4s-10 6.7-16 8.5c-16.2 4.9-50.6 11.7-50.6 11.7l-4.8 7.5H277l-14.4 4.3 7.4 6.9s-7.8-4.1-18.1-2.1c-7.1 1.3-15.4 6-22.9 8-18.7 4.8-29.9-12.8-29.9-12.8l-15.9-.1z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Kiribati +686</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#91DC5A" d="M0 85.331h512v341.337H0z"></path><path fill="white" d="M0 85.331h512v341.337H0z"></path><g fill="#0052B4"><path d="M0 85.331h512v57.188H0zM0 369.48h512v57.177H0z"></path></g><path fill="#D80027" d="M0 165.215h512v181.582H0z"></path><circle fill="white" cx="190.33" cy="255.994" r="65.668"></circle><path fill="#D80027" d="M190.332 190.332l14.734 45.346h47.757l-38.65 28.028 14.849 45.481-38.69-28.16-38.631 28.107 14.79-45.428-38.616-28.028h47.722z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Korea, Democratic People's Republic of Korea +850</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 600"><path fill="white" d="M0 0h900v600H0z"></path><g transform="rotate(-56.31)"><g stroke="black" stroke-width="25"><path d="M-75 228.3H75m-150 37.5H75m-150 37.5H75M-75 778.3H75m-150 37.5H75m-150 37.5H75"></path></g><path stroke="white" stroke-width="12.5" d="M0 753.3v125"></path><circle fill="#ca163a" cy="540.8" r="150"></circle><path fill="#0e4896" d="M0 390.8c-41.4 0-75 33.6-75 75s33.6 75 75 75 75 33.6 75 75-33.6 75-75 75c-82.8 0-150-67.2-150-150s67.2-150 150-150z"></path></g><g stroke="black" stroke-width="25"><path d="M231.56 535.73l-83.205-124.808M262.76 514.928l-83.205-124.807m114.407 104.006l-83.205-124.808M689.187 230.644l-83.205-124.807M720.39 209.843L637.184 85.036m114.407 104.006L668.386 64.234"></path></g><path stroke="white" stroke-width="12.5" d="M205.6 462.897l31.202-20.8m389.981-259.989l36.444-24.296m31.202-20.801l31.202-20.801"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Korea, Republic of South Korea +82</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.33"><path fill="#0052B4" d="M0 0h512v341.34H0z"></path><g fill="white"><path d="M220.72 42.63l7.95 16.11 17.77 2.58-12.86 12.54 3.04 17.7-15.9-8.36-15.9 8.36 3.03-17.7-12.86-12.54 17.78-2.58zM291.28 42.57l7.95 16.1 17.78 2.59-12.86 12.53 3.03 17.71-15.9-8.36-15.9 8.36 3.04-17.71-12.86-12.53 17.77-2.59zM353.36 53.93l7.95 16.11 17.77 2.58-12.86 12.54 3.04 17.7-15.9-8.35-15.9 8.35 3.04-17.7-12.87-12.54 17.78-2.58zM416.37 72.23l7.95 16.11 17.77 2.59-12.86 12.53 3.04 17.71-15.9-8.36-15.9 8.36 3.03-17.71-12.86-12.53 17.78-2.59zM158.64 53.93l7.95 16.11 17.78 2.58-12.87 12.54 3.04 17.7-15.9-8.35-15.9 8.35 3.04-17.7-12.86-12.54 17.77-2.58zM95.63 72.23l7.95 16.11 17.78 2.59-12.86 12.53 3.03 17.71-15.9-8.36-15.9 8.36 3.04-17.71-12.86-12.53 17.77-2.59z"></path></g><path fill="#FFDA44" d="M217.53 259.33l-27.22-13.61-27.22-54.43h27.22l27.22-27.22 13.61-27.22 27.22-13.61 13.61 13.61 27.22 13.61v13.61l13.61 13.61 40.83 27.22L340 245.73l-40.83 40.83-13.61-27.22-40.83 27.22v27.22l-13.61-13.61-13.59-40.84z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Kosovo +383</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 342"><g fill="#D80027"><path d="M0 0h513v342H0z"></path><circle cx="256" cy="170.7" r="170.7"></circle></g><path fill="#FFDA44" d="M382.4 170.7L330.8 195l27.5 50-56.1-10.7-7.1 56.6-39.1-41.7-39.1 41.7-7.1-56.6-56.1 10.7 27.5-50-51.6-24.3 51.6-24.3-27.5-50.1 56.1 10.8 7.1-56.7L256 92.1l39.1-41.7 7.1 56.7 56.1-10.8-27.5 50.1z"></path><circle fill="#D80027" cx="257.4" cy="170.7" r="71.6"></circle><g fill="#FFDA44"><path d="M214.2 170.7c-2.1 0-4.1.1-6.2.3.1 12 4.4 22.9 11.6 31.5 3.8-10.3 9.5-19.6 16.7-27.7-6.9-2.7-14.3-4.1-22.1-4.1zM240.8 217.2c5.2 1.9 10.8 2.9 16.6 2.9 5.8 0 11.4-1 16.6-2.9-2.8-11.1-8.7-21-16.6-28.8-7.9 7.8-13.8 17.7-16.6 28.8zM300.2 146c-8.5-14.8-24.5-24.7-42.8-24.7-18.3 0-34.2 9.9-42.8 24.7 15.6.1 30.2 4.3 42.8 11.6 12.6-7.3 27.2-11.6 42.8-11.6zM278.5 174.8c7.2 8 12.9 17.4 16.7 27.7 7.2-8.5 11.5-19.5 11.6-31.5-2-.2-4.1-.3-6.2-.3-7.7 0-15.2 1.4-22.1 4.1z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Kyrgyzstan +996</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#0052B4" d="M0 0h513v342H0z"></path><g fill="#D80027"><path d="M0 .1h513v90.7H0zM0 251.3h513V342H0z"></path></g><circle fill="white" cx="256.5" cy="171" r="65.9"></circle></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Laos +856</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h513v342H0z"></path><g fill="#A2001D"><path class="prefix__st1" d="M0 0h513v127.6H0zM0 214.4h513V342H0z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Latvia +371</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h513v342H0z"></path><g fill="#D80027"><path d="M0 .2h513v90.7H0zM.5 251.3H513V342H.5z"></path></g><path fill="#6DA544" d="M290.3 193.5L256 130.7l-34.3 62.8h25.7v17.2h17.2v-17.2z"></path><path fill="#14AF5A" d="M241.3 213.1c4.4-4.4 4.4-11.6-.1-16l4.7 4.7c-5.2-4.7-12.2-6.6-19.1-5.3l-23.5 5.9c-6.1 1.5-6.8-.4-1.8-4.2l27.1-20.3c5.1-3.8 4.2-6.9-2.3-6.9h-11c-6.4 0-7-2.3-1.5-5.1l25.3-12.7c5.6-2.8 5.1-5.1-1.5-5.1h-11c-6.4 0-7.4-3.1-2.3-6.9l27.1-20.3c5.6-3.8 12.9-3.8 18.5 0l27.1 20.3c5.1 3.8 4.2 6.9-2.3 6.9h-11c-6.4 0-7 2.3-1.5 5.1l25.3 12.7c5.6 2.8 5.1 5.1-1.5 5.1h-11c-6.4 0-7.4 3.1-2.3 6.9l27.1 20.3c5.1 3.8 4.4 5.7-1.8 4.2l-23.5-5.9c-6.8-1.3-13.9.6-19.1 5.3l4.7-4.7c-4.4 4.4-4.5 11.5-.1 16l6.8 6.8c4.4 4.4 3.1 8-3.3 8h-45.8c-6.2 0-7.7-3.6-3.3-8 .1.1 6.9-6.8 6.9-6.8z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Lebanon +961</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h513v342H0z"></path><path fill="#0052B4" d="M0 0h513v114H0z"></path><path fill="#6DA544" d="M0 227.6h513v114H0z"></path><path d="M245.2 171l7.7-23.1c2-5.9 5.1-6 7.1 0l7.7 23.1 19.4 29.1c1.7 2.6 1.3 6.3-1.2 8 0 0-6.9 8-29.5 8s-29.5-8-29.5-8c-2.4-2-2.9-5.4-1.2-8l19.5-29.1z"></path><path d="M256.5 171c-12.5 0-22.6-10.1-22.6-22.6 0-12.5 10.1-22.6 22.6-22.6s22.6 10.1 22.6 22.6c0 12.5-10.2 22.6-22.6 22.6zm0 0c6.2 0 11.3-16.3 11.3-22.6 0-6.2-5.1-11.3-11.3-11.3-6.2 0-11.3 5.1-11.3 11.3 0 6.3 5 22.6 11.3 22.6z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Lesotho +266</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 91.476h512v341.337H0z"></path><g fill="#D80027"><path d="M0 91.476h512v31.031H0zM0 153.539h512v31.031H0zM0 215.603h512v31.031H0zM0 277.666h512v31.031H0zM0 339.729h512v31.031H0zM0 401.793h512v31.031H0z"></path></g><path fill="#0052B4" d="M0 79.177h256v167.457H0z"></path><path fill="white" d="M127.999 118.382l11.05 34.01h35.764l-28.932 21.021 11.05 34.012-28.932-21.021-28.933 21.021 11.053-34.012-28.932-21.021h35.762z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Liberia +231</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path d="M0 85.337h512v341.326H0z"></path><path fill="#D80027" d="M0 85.337h512v113.775H0z"></path><path fill="#496E2D" d="M0 312.888h512v113.775H0z"></path><g fill="white"><path d="M281.424 236.026l8.962 12.35 14.513-4.706-8.975 12.339 8.961 12.349-14.509-4.724-8.976 12.34.01-15.258-14.51-4.725 14.514-4.706z"></path><path d="M256.965 286.868c-17.048 0-30.868-13.821-30.868-30.868s13.821-30.868 30.868-30.868a30.742 30.742 0 0114.684 3.71c-6.851-6.698-16.218-10.833-26.556-10.833-20.982 0-37.992 17.01-37.992 37.992s17.01 37.992 37.992 37.992c10.338 0 19.706-4.135 26.556-10.833a30.738 30.738 0 01-14.684 3.708z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Libya +218</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#D80027" d="M0 0h513v342H0z"></path><path fill="#0052B4" d="M0 0h513v171H0z"></path><path fill="#FFDA44" d="M149.3 98.1c0-14-11.3-25.3-25.3-25.3-6.5 0-12.4 2.4-16.9 6.4V64.4h8.4V47.5h-8.4v-8.4H90.3v8.4h-8.4v16.9h8.4v14.9c-4.5-4-10.4-6.4-16.9-6.4-14 0-25.3 11.3-25.3 25.3 0 7.5 3.3 14.2 8.4 18.8v14.9h84.3V117c5.3-4.7 8.5-11.5 8.5-18.9z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Liechtenstein +423</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#6DA544" d="M0 85.337h512v341.326H0z"></path><path fill="#FFDA44" d="M0 85.337h512v113.775H0z"></path><path fill="#D80027" d="M0 312.888h512v113.775H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Lithuania +370</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#D80027" d="M0 85.337h512v113.775H0z"></path><path fill="#338AF3" d="M0 312.888h512v113.775H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Luxembourg +352</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#496E2D" d="M0 85.331h512v341.337H0z"></path><path fill="white" d="M285.682 248.878c-4.19 0-8.166.836-11.861 2.164 2.023-4.509 3.379-9.527 3.379-14.885 0-21.201-21.201-37.101-21.201-37.101s-21.201 15.901-21.201 37.101c0 5.357 1.356 10.375 3.379 14.885-3.693-1.328-7.671-2.164-11.861-2.164-21.201 0-37.101 21.201-37.101 21.201s15.901 21.201 37.101 21.201c12.429 0 23.031-7.286 29.682-13.315 6.65 6.03 17.251 13.315 29.682 13.315 21.201 0 37.101-21.201 37.101-21.201s-15.899-21.201-37.099-21.201z"></path><g fill="#FFDA44"><path d="M256 152.111l4.38 13.476h14.171l-11.464 8.332 4.376 13.476-11.463-8.33-11.463 8.33 4.376-13.476-11.464-8.332h14.171zM202.112 175.683l8.425 7.585 9.818-5.667-4.61 10.355 8.423 7.588-11.274-1.185-4.611 10.355-2.358-11.088-11.275-1.185 9.818-5.669zM162.662 215.132l11.09 2.358 5.668-9.818 1.186 11.274 11.089 2.358-10.357 4.61 1.186 11.274-7.587-8.423-10.357 4.61 5.669-9.818zM309.889 175.683l-8.425 7.585-9.818-5.667 4.611 10.355-8.425 7.588 11.275-1.185 4.61 10.355 2.359-11.088 11.275-1.185-9.818-5.669zM349.338 215.132l-11.089 2.358-5.669-9.818-1.186 11.274-11.088 2.358 10.357 4.61-1.185 11.274 7.586-8.423 10.357 4.61-5.669-9.818z"></path></g><g fill="white"><path d="M256 350.642c16.84 0 32.363-5.619 44.816-15.073h-89.63c12.451 9.454 27.974 15.073 44.814 15.073zM187.977 306.12a74.138 74.138 0 008.85 15.073h118.345a74.13 74.13 0 008.85-15.073H187.977z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Macau +853</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#6DA544" d="M512 426.666V85.329H0v341.337h512z"></path><path fill="#D80027" d="M512 85.331H0v170.666h512V85.331z"></path><path fill="white" d="M0 85.334h181.793v341.337H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Madagascar +261</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.337h512v341.326H0z"></path><path d="M0 85.337h512v113.775H0z"></path><path fill="#496E2D" d="M0 312.888h512v113.775H0z"></path><path fill="#D80027" d="M307.01 166.957l-20.842-9.804 11.099-20.186-22.634 4.329-2.868-22.864L256 135.248l-15.764-16.816-2.869 22.864-22.633-4.329 11.099 20.186-20.843 9.804z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Malawi +265</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="white" d="M0 0h512v341.3H0z"></path><g fill="#D80027"><path d="M0 42.7h512v42.7H0zM0 128h512v42.7H0zM0 213.3h512V256H0zM0 298.7h512v42.7H0z"></path></g><path fill="#0052B4" d="M0 0h256v170.7H0z"></path><g fill="#FFDA44"><path d="M141.1 134.8c-28 0-45.9-24.8-45.9-49.5 0-24.8 17.9-49.5 45.9-49.5 8.7 0 18.1 1 25.3 4.9-11.2-11-26.6-17.8-43.6-17.8-34.4 0-62.4 27.9-62.4 62.4s27.9 62.4 62.4 62.4c17 0 32.3-6.8 43.6-17.8-7.1 3.9-16.5 4.9-25.3 4.9z"></path><path d="M171 49.7l9 18.8 20.3-4.7-9.1 18.8 16.4 12.9-20.4 4.6.1 20.9-16.3-13.1-16.2 13.1v-20.9l-20.3-4.6 16.3-12.9-9.1-18.8 20.3 4.7z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Malaysia +60</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.331h512v341.333H0z"></path><path fill="#6DA544" d="M144.696 174.375h222.609v163.25H144.696z"></path><path fill="white" d="M283.484 304.226c-26.637 0-48.232-21.594-48.232-48.232s21.594-48.232 48.232-48.232c8.306 0 16.12 2.1 22.943 5.797-10.703-10.467-25.341-16.927-41.494-16.927-32.784 0-59.362 26.577-59.362 59.362s26.578 59.362 59.362 59.362c16.154 0 30.791-6.461 41.494-16.927-6.822 3.698-14.636 5.797-22.943 5.797z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Maldives +960</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.331h512v341.337H0z"></path><path fill="#6DA544" d="M0 85.331h170.663v341.337H0z"></path><path fill="#D80027" d="M341.337 85.331H512v341.337H341.337z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Mali +223</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.331h512v341.326H0z"></path><path fill="#D80027" d="M256 85.331h256v341.337H256z"></path><path fill="#ACABB1" d="M208.231 138.671v-21.334h-21.332v21.334h-21.334v21.332h21.334v21.334h21.332v-21.334h21.334v-21.332z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Malta +356</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.337h512v341.326H0z"></path><g fill="white"><path d="M233.839 185.115l-20.844 9.803 11.1 20.187-22.633-4.33-2.868 22.864-15.765-16.816-15.766 16.816-2.867-22.864-22.634 4.33 11.1-20.187-20.843-9.803 20.843-9.805-11.1-20.185 22.633 4.328 2.869-22.864 15.765 16.816 15.765-16.816 2.868 22.864 22.634-4.328-11.1 20.186zM426.917 85.337L0 421.52v3.762L503.756 85.337z"></path></g><path fill="#FF9811" d="M512 85.337h-8.244L0 425.282v1.381h3.723L512 136.998z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Marshall Islands +692</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.331h512v341.337H0z"></path><g fill="white"><path d="M512 233.734v44.521H278.261v148.402h-44.522V278.255H0v-44.521h233.739V85.331h44.522v148.403z"></path><path d="M386.607 175.885a4.119 4.119 0 014.115-4.114h8.816c13.936 0 25.274-11.337 25.274-25.273 0-13.935-11.337-25.273-25.274-25.273h-8.372c-2.733-2.052-6.399-3.318-10.443-3.318-8.436 0-15.273 5.471-15.273 12.219 0 6.683 6.707 12.104 15.029 12.209l-.003.049h19.062c2.27 0 4.115 1.845 4.115 4.115s-1.845 4.114-4.115 4.114h-8.816c-13.936 0-25.273 11.337-25.273 25.273 0 13.935 11.336 25.273 25.273 25.273h34.09V180h-34.09a4.12 4.12 0 01-4.115-4.115zM108.346 175.885a4.119 4.119 0 014.115-4.114h8.816c13.936 0 25.274-11.337 25.274-25.273 0-13.935-11.337-25.273-25.274-25.273h-8.372c-2.733-2.052-6.399-3.318-10.443-3.318-8.436 0-15.273 5.471-15.273 12.219 0 6.683 6.707 12.104 15.029 12.209l-.003.049h19.062c2.27 0 4.115 1.845 4.115 4.115s-1.845 4.114-4.115 4.114h-8.816c-13.936 0-25.273 11.337-25.273 25.273 0 13.935 11.336 25.273 25.273 25.273h34.09V180h-34.09a4.12 4.12 0 01-4.115-4.115zM386.607 368.809a4.119 4.119 0 014.115-4.114h8.816c13.936 0 25.274-11.337 25.274-25.273 0-13.935-11.337-25.273-25.274-25.273h-8.372c-2.733-2.052-6.399-3.318-10.443-3.318-8.436 0-15.273 5.471-15.273 12.219 0 6.683 6.707 12.104 15.029 12.209l-.003.049h19.062c2.27 0 4.115 1.845 4.115 4.115s-1.845 4.114-4.115 4.114h-8.816c-13.936 0-25.273 11.337-25.273 25.273 0 13.935 11.336 25.273 25.273 25.273h34.09v-21.159h-34.09a4.119 4.119 0 01-4.115-4.115zM108.346 368.809a4.119 4.119 0 014.115-4.114h8.816c13.936 0 25.274-11.337 25.274-25.273 0-13.935-11.337-25.273-25.274-25.273h-8.372c-2.733-2.052-6.399-3.318-10.443-3.318-8.436 0-15.273 5.471-15.273 12.219 0 6.683 6.707 12.104 15.029 12.209l-.003.049h19.062c2.27 0 4.115 1.845 4.115 4.115s-1.845 4.114-4.115 4.114h-8.816c-13.936 0-25.273 11.337-25.273 25.273 0 13.935 11.336 25.273 25.273 25.273h34.09v-21.159h-34.09a4.119 4.119 0 01-4.115-4.115z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Martinique +596</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#496E2D" d="M0 85.331h512v341.337H0z"></path><g fill="#FFDA44"><path d="M256 298.851c-45.956 0-84.348-32.298-93.767-75.429A96.288 96.288 0 00160 243.994c0 53.02 42.979 96 96 96s96-42.98 96-96c0-7.066-.785-13.942-2.233-20.572-9.419 43.131-47.811 75.429-93.767 75.429z"></path><path d="M255.999 171.994l8.935 27.502h28.918l-23.394 16.996 8.936 27.503-23.395-16.998-23.394 16.998 8.937-27.503-23.394-16.996h28.915z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Mauritania +222</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.331h512v341.326H0z"></path><path fill="#D80027" d="M0 85.331h512v85.337H0z"></path><path fill="#0052B4" d="M0 170.657h512v85.337H0z"></path><path fill="#6DA544" d="M0 341.331h512v85.337H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Mauritius +230</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 90 60"><path fill="white" d="M0 0h90v60H0z"></path><path stroke="#7f7f7f" stroke-width=".25" fill="#ABABAB" d="M12.8 38.5s4 1.6 1.2-.5c-2.4-1.7-5 2.4-5 5.1s1.2 7 7.5 7c7.6 0 11.4-5.7 11.4-11.4 0-4.8-3.7-13.5-6.5-14.6-3.1-1.2-6.7-3.5-6.8-5 0-.5 1.4-.1 3.3.9 3.1 1.7 6.6 2.5 6.6 1.4s-2.9-3.1-4-4.6c-1.2-1.6-.9-5.5-3-5.5-7.6 0-9.9 7.7-7 11.7 1.9 2.6-4.3 1-4.3 1s0 5.3 3.2 7.3c3 1.8 4.8 3.9 4.8 3.9s-.2-4.6.5-3.9c.6.7 11.1 4.5 10.3 12-.3 3-4.5 5.4-8.5 5.2-4-.2-6.8-2.4-6.4-5.4.2-4.2 2.7-4.6 2.7-4.6zM77.2 38.5s-4 1.6-1.2-.5c2.4-1.8 5.1 2.3 5.1 5.1s-1.2 7-7.5 7c-7.6 0-11.4-5.7-11.4-11.4 0-4.8 3.7-13.5 6.5-14.6 3.1-1.2 6.7-3.5 6.8-5 0-.5-1.4-.1-3.3.9-3.1 1.7-6.6 2.5-6.6 1.4s2.9-3.1 4-4.6c1.2-1.6.9-5.5 3-5.5 7.6 0 9.9 7.7 7 11.7-1.9 2.6 4.3 1 4.3 1s0 5.3-3.2 7.3c-3 1.8-4.8 3.9-4.8 3.9s.2-4.6-.5-3.9c-.6.7-11.1 4.5-10.3 12 .3 3 4.5 5.4 8.5 5.2 4-.2 6.8-2.4 6.4-5.4-.3-4.2-2.8-4.6-2.8-4.6z"></path><path fill="#DE393A" d="M31 28.8v14c0 1.9 2.1 1.6 2.1 1.6h9.3c1.2 0 2.6 2.3 2.6 2.3s1.4-2.3 2.5-2.3h9.6s2 .2 2-1.8V28.7H31z"></path><path fill="#3951A3" d="M31 13.1h28v15.7H31z"></path><path fill="white" d="M50.1 16.5c-.4 2.4-2.5 4.2-5.1 4.2-2.5 0-4.6-1.8-5.1-4.2-.5.9-.8 1.9-.8 3 0 3.3 2.6 5.9 5.9 5.9 3.3 0 5.9-2.6 5.9-5.9 0-1.1-.3-2.1-.8-3z"></path><circle fill="#FEE05F" cx="39.1" cy="36.5" r="3"></circle><circle fill="#FEE05F" cx="50.9" cy="36.5" r="3"></circle></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Mayotte +262</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M341.334 85.33H0v341.332h512V85.33z"></path><path fill="#6DA544" d="M0 85.333h170.663V426.67H0z"></path><path fill="white" d="M170.663 85.333h170.663V426.67H170.663z"></path><path fill="#6DA544" d="M208 255.996c0 26.509 21.491 48 48 48s48-21.491 48-48v-16h-96v16z"></path><path fill="#FF9811" d="M320 223.996h-48c0-8.836-7.164-16-16-16s-16 7.164-16 16h-48c0 8.836 7.697 16 16.533 16H208c0 8.836 7.164 16 16 16 0 8.836 7.164 16 16 16h32c8.836 0 16-7.164 16-16 8.836 0 16-7.164 16-16h-.533c8.836 0 16.533-7.163 16.533-16z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Mexico +52</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#338AF3" d="M0 0h512v341.3H0z"></path><g fill="white"><path d="M256 37.9l10.1 31.2H299l-26.6 19.3 10.2 31.2-26.6-19.3-26.6 19.3 10.2-31.2L213 69.1h32.9zM123.2 170.7l31.2-10.2v-32.8l19.3 26.6 31.2-10.2-19.3 26.6 19.3 26.5-31.2-10.1-19.3 26.5v-32.8zM256 303.5l-10.1-31.2H213l26.6-19.3-10.2-31.3L256 241l26.6-19.3-10.2 31.3 26.6 19.3h-32.9zM388.8 170.7l-31.2 10.1v32.8l-19.3-26.5-31.2 10.1 19.3-26.5-19.3-26.6 31.2 10.2 19.3-26.6v32.8z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Micronesia, Federated States of Micronesia +691</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#FFDA44" d="M0 0h513v342H0z"></path><path fill="#D80027" d="M342 0h171v342H342z"></path><path fill="#0052B4" d="M0 0h171v342H0z"></path><path fill="#AF7F59" d="M206.2 129.1h33.2L256 79.3l16.6 49.8h33.2v99.6L256 262l-49.8-33.2v-99.7zm33.2 33.3v49.8h33.2v-49.8h-33.2z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Moldova +373</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.34h512v341.326H0z"></path><path fill="#D80027" d="M512 85.334v166.69L0 256.175V85.334z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Monaco +377</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.331h512v341.326H0z"></path><g fill="#A2001D"><path d="M330.207 85.331H512v341.337H330.207zM0 85.331h181.793v341.337H0z"></path></g><g fill="#FFDA44"><path d="M113.163 267.125h14.84v59.359h-14.84zM53.793 267.125h14.84v59.359h-14.84z"></path><circle cx="90.902" cy="289.386" r="14.84"></circle><circle cx="90.902" cy="237.44" r="7.421"></circle><path d="M76.054 311.647h29.682v14.84H76.054zM76.054 252.288h29.682v14.84H76.054zM90.897 185.502l5.255 16.173h17.006l-13.757 9.996 5.252 16.173-13.756-9.996-13.756 9.996 5.251-16.173-13.756-9.996h17.005z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Mongolia +976</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.337h512v341.326H0z"></path><path fill="#A2001D" d="M0 115.011h512v281.978H0z"></path><g fill="#FFDA44"><path d="M218.899 211.478h74.202v-29.681l-14.84 7.42L256 166.957l-22.261 22.26-14.84-7.42zM322.783 256h-37.088a17 17 0 002.3-8.543c0-9.458-7.668-17.124-17.124-17.124-6.534 0-12.209 3.661-15.096 9.041-2.887-5.38-8.562-9.041-15.096-9.041-9.456 0-17.124 7.666-17.124 17.124 0 3.114.846 6.026 2.3 8.543h-36.636c0 11.349 9.885 20.549 21.232 20.549h-.685c0 9.31 6.192 17.168 14.68 19.694l-16.678 16.678 15.741 15.741 22.329-22.329c.875.321 1.78.577 2.714.752l-13.492 30.464c6.466 2.629 13.531 4.088 20.941 4.088s14.475-1.46 20.941-4.088l-13.492-30.464a17.108 17.108 0 002.714-.752l22.329 22.329 15.741-15.741-16.678-16.678c8.488-2.526 14.68-10.385 14.68-19.694h-.685c11.347 0 21.232-9.2 21.232-20.549z"></path></g><path fill="#6DA544" d="M256 267.13l-24.116 11.131v22.261L256 315.362l24.116-14.84v-22.261z"></path><path fill="#0052B4" d="M231.88 256h48.228v29.682H231.88z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Montenegro +382</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.333h512V426.67H0z"></path><path fill="#338AF3" d="M334.222 191.996v78.221c0 38.103 49.777 49.779 49.777 49.779s49.778-11.675 49.778-49.779v-78.221h-99.555z"></path><path fill="#A2001D" d="M334.222 270.217c0 38.103 49.777 49.779 49.777 49.779s49.778-11.675 49.778-49.779h-99.555z"></path><path d="M405.334 227.552H391.11v-14.223h-14.222v14.223h-14.222v14.223h14.222v42.665h14.222v-42.665h14.224z"></path><path fill="white" d="M256 85.333v30.553l-45.167 25.099H256v59.359h-59.103L256 233.179v22.817h-26.68l-73.494-40.826v40.826h-55.652v-48.573l-87.43 48.573H0v-30.554l45.167-25.098H0v-59.359h59.103L0 108.139V85.333h26.68l73.494 40.825V85.333h55.652v48.572l87.43-48.572z"></path><path fill="#D80027" d="M144 85.33h-32v69.332H0v32h112v69.334h32v-69.334h112v-32H144z"></path><path fill="#0052B4" d="M155.826 200.344L256 255.996v-15.737l-71.847-39.915z"></path><path fill="white" d="M155.826 200.344L256 255.996v-15.737l-71.847-39.915z"></path><g fill="#D80027"><path d="M155.826 200.344L256 255.996v-15.737l-71.847-39.915zM71.846 200.344L0 240.259v15.737l100.174-55.652z"></path></g><path fill="#0052B4" d="M100.174 140.982L0 85.33v15.737l71.847 39.915z"></path><path fill="white" d="M100.174 140.982L0 85.33v15.737l71.847 39.915z"></path><g fill="#D80027"><path d="M100.174 140.982L0 85.33v15.737l71.847 39.915zM184.154 140.982L256 101.067V85.33l-100.174 55.652z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Montserrat +1664</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.337v341.326h512V85.337z"></path><path fill="#20661b" d="M352 226.484h-73.337L256 156.738l-22.663 69.748H160l59.331 43.107-22.663 69.749L256 296.232l59.332 43.107-22.663-69.749L352 226.484zm-116.063 37.711l7.663-23.585h24.8l7.663 23.585v.001L256 278.772l-20.063-14.577zm27.873-37.711h-15.619L256 202.447l7.81 24.037zm24.269 28.982l-4.827-14.856h25.274l-20.447 14.856zm-59.331-14.856l-4.827 14.856-20.447-14.856h25.274zm-5.211 61.748l7.81-24.036 12.636 9.181-20.446 14.855zm44.479-14.856l12.636-9.181 7.81 24.036-20.446-14.855z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Morocco +212</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#FFDA44" d="M0 322.783h512v103.88H0z"></path><path fill="#496E2D" d="M0 85.337h512v104.515H0z"></path><path d="M0 210.877h512v89.656H0z"></path><path fill="#A2001D" d="M256 256.006L0 426.668V85.331z"></path><path fill="#FFDA44" d="M83.477 195.132l15.107 46.498h48.894l-39.554 28.739 15.107 46.499-39.554-28.738-39.555 28.738 15.11-46.499-39.554-28.739H68.37z"></path><path fill="white" d="M39.268 256h88.42v40.578h-88.42z"></path><path d="M144.443 209.479l-14.347-14.347-46.618 46.618-46.617-46.618-14.347 14.347 46.658 46.577-46.658 46.658 14.347 14.154 46.617-46.534 46.618 46.534 14.347-14.154-46.659-46.658z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Mozambique +258</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#6DA544" d="M0 85.337h512v341.326H0z"></path><path fill="#FFDA44" d="M0 85.337h512v113.775H0z"></path><path fill="#D80027" d="M0 312.888h512v113.775H0z"></path><path fill="white" d="M384 227.261h-97.783L256 134.265l-30.217 92.997H128l79.108 57.475-30.217 92.998L256 320.925l79.108 56.81-30.217-92.998L384 227.261z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Myanmar +95</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#496E2D" d="M0 85.337h512v341.326H0z"></path><path fill="#0052B4" d="M0 426.663V85.337h512"></path><path fill="white" d="M512 152.222V85.337H411.67L0 359.778v66.885h100.33z"></path><path fill="#A2001D" d="M512 85.337v40.125L60.193 426.663H0v-40.125L451.807 85.337z"></path><path fill="#FFDA44" d="M187.737 189.212l-22.741 10.696 12.11 22.024-24.693-4.724-3.129 24.945-17.199-18.347-17.2 18.347-3.129-24.945-24.693 4.723 12.109-22.023-22.739-10.696 22.74-10.697-12.11-22.022 24.693 4.722 3.13-24.944 17.199 18.347 17.2-18.347 3.128 24.944 24.693-4.722-12.108 22.024z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Namibia +264</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.337h512v341.326H0z"></path><path fill="#FFDA44" d="M0 239.994h512v32H0z"></path><path fill="white" d="M174.802 341.329l-19.124 8.996 10.184 18.521-20.767-3.973-2.631 20.978L128 370.422l-14.465 15.429-2.63-20.978-20.767 3.973 10.183-18.521-19.123-8.996 19.124-8.995-10.184-18.52 20.766 3.971 2.632-20.978L128 312.236l14.465-15.429 2.63 20.978 20.767-3.971-10.183 18.521z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Nauru +674</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#0052B4" d="M0 426.663V85.337l280.419 174.75H87.61l183.576 166.576z"></path><path fill="#D80027" d="M244.769 249.888L10.199 103.71v312.754h234.57L61.193 249.888z"></path><g fill="white"><path d="M98.003 324.433l-14.589-6.863 7.77-14.13-15.844 3.03-2.008-16.005-11.035 11.772-11.036-11.772-2.008 16.005-15.843-3.031 7.77 14.131-14.591 6.863 14.591 6.862-7.77 14.13 15.844-3.029 2.007 16.004 11.036-11.772L73.332 358.4l2.008-16.004 15.843 3.03-7.769-14.13zM88.268 191.662l-10.612-4.991 5.651-10.278-11.523 2.205-1.461-11.641-8.026 8.561-8.026-8.561-1.46 11.641-11.525-2.205 5.652 10.278-10.613 4.991 25.972 5.194z"></path><path d="M93.462 191.662c0 17.212-13.953 31.165-31.165 31.165s-31.165-13.953-31.165-31.165"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Nepal +977</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#A2001D" d="M0 85.337h512v113.775H0z"></path><path fill="#0052B4" d="M0 312.888h512v113.775H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Netherlands +31</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 426.7"><path fill="#009543" d="M0 293h640v133.7H0V293z"></path><path fill="#ED4135" d="M0 132h640v161.3H0V132z"></path><path fill="#0035AD" d="M0 0h640v133.3H0V0z"></path><circle fill="#FAE600" stroke="black" stroke-width="5.3" cx="240" cy="213.3" r="157.3"></circle><path d="M307.9 354.5l-31.8 12-36.1 4.2-37.8-2.4-35.9-15.5s28.6-29.3 40.7-33.5c8.6-3 22.4-3.7 22.4-3.7V122l-.3-66H246l-.5 67.5v191.7s15.3 1.2 22.1 4.1c11.3 4.9 40.3 35.2 40.3 35.2z"></path><path d="M212.727 102.375l42.955-21.418 5.577 11.187-42.955 21.417z"></path><ellipse cx="237.8" cy="280.5" rx="16.8" ry="26.5"></ellipse><circle cx="237.4" cy="143.4" r="20.9"></circle><ellipse cx="238.4" cy="211.1" rx="19.9" ry="12.1"></ellipse><path d="M213.8 177h47v10h-47zM213.8 234h47v10h-47z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">New Caledonia +687</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><g fill="#338AF3"><path d="M0 85.337h512v113.775H0zM0 312.888h512v113.775H0z"></path></g><path fill="#FFDA44" d="M256 214.447c-22.949 0-41.553 18.603-41.553 41.553S233.05 297.553 256 297.553c22.949 0 41.553-18.603 41.553-41.553S278.949 214.447 256 214.447zm0 65.298c-13.114 0-23.745-10.631-23.745-23.745s10.631-23.745 23.745-23.745 23.745 10.631 23.745 23.745-10.631 23.745-23.745 23.745z"></path><path fill="#0052B4" d="M276.563 261.936L256 256l-20.563 5.936-6.855 11.873h54.836z"></path><path fill="#338AF3" d="M256 226.32l-13.709 23.744L256 256l13.709-5.936z"></path><path fill="#6DA544" d="M235.437 261.936h41.126l-6.854-11.872h-27.418z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Nicaragua +505</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#FF9811" d="M0 85.337h512v113.775H0z"></path><path fill="#6DA544" d="M0 312.888h512v113.775H0z"></path><circle fill="#FF9811" cx="256" cy="256" r="32"></circle></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Niger +227</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.331h512v341.337H0z"></path><g fill="#6DA544"><path d="M0 85.331h170.663v341.337H0zM341.337 85.331H512v341.337H341.337z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Nigeria +234</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.334h512v341.337H0z"></path><path fill="white" d="M0 85.334h256v170.663H0z"></path><g fill="#D80027"><path d="M144 85.33h-32v69.333H0v32h112v69.334h32v-69.334h112v-32H144z"></path><path d="M0 85.329v15.083l57.377 38.251H80z"></path></g><g fill="#2E52B2"><path d="M0 107.951v30.712h46.069zM96 85.331v48.913L22.628 85.331z"></path></g><path fill="#D80027" d="M256 85.329v15.083l-57.377 38.251H176z"></path><g fill="#2E52B2"><path d="M256 107.951v30.712h-46.069zM160 85.331v48.913l73.372-48.913z"></path></g><path fill="#D80027" d="M0 85.329v15.083l57.377 38.251H80z"></path><g fill="#2E52B2"><path d="M0 107.951v30.712h46.069zM96 85.331v48.913L22.628 85.331z"></path></g><path fill="#D80027" d="M256 85.329v15.083l-57.377 38.251H176z"></path><g fill="#2E52B2"><path d="M256 107.951v30.712h-46.069zM160 85.331v48.913l73.372-48.913z"></path></g><path fill="#D80027" d="M0 255.997v-15.082l57.377-38.252H80z"></path><g fill="#2E52B2"><path d="M0 233.376v-30.713h46.069zM96 255.994v-48.912l-73.372 48.912z"></path></g><path fill="#D80027" d="M256 255.997v-15.082l-57.377-38.252H176z"></path><g fill="#2E52B2"><path d="M256 233.376v-30.713h-46.069zM160 255.994v-48.912l73.372 48.912z"></path><circle cx="128" cy="170.66" r="22.627"></circle></g><g fill="#FFDA44"><path d="M128 154.663l3.97 12.222h12.854l-10.398 7.556 3.971 12.222L128 179.109l-10.398 7.554 3.972-12.222-10.398-7.556h12.853zM128 219.803l2.364 7.278h7.653l-6.19 4.498 2.364 7.278-6.191-4.498-6.191 4.498 2.364-7.278-6.19-4.498h7.652zM128 102.469l2.364 7.278h7.653l-6.19 4.498 2.364 7.278-6.191-4.498-6.191 4.498 2.364-7.278-6.19-4.498h7.652zM197.931 161.136l2.365 7.277h7.653l-6.192 4.499 2.365 7.279-6.191-4.498-6.191 4.498 2.365-7.279-6.191-4.499h7.652zM58.069 161.136l2.364 7.277h7.653l-6.191 4.499 2.364 7.279-6.19-4.498-6.191 4.498 2.365-7.279-6.192-4.499h7.653z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Niue +683</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.331h512v341.337H0z"></path><g fill="#6DA544"><path d="M0 85.331h170.663v341.337H0zM341.337 85.331H512v341.337H341.337zM304 311.995l-48-152.001-48 152.001h36v39.999h24v-39.999z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Norfolk Island +672</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.333h512V426.67H0z"></path><g fill="#D80027"><path d="M383.875 426.662L256 252.286l26.827 174.376zM133.565 85.33L256 252.286 230.314 85.33zM229.171 426.662L256 252.286 128.124 426.662zM0 85.33V212.9l256 39.386L28.333 85.33zM0 426.662h18.212L256 252.286 0 291.67zM256 252.286L512 212.9V85.33h-28.331zM281.686 85.33L256 252.286 378.434 85.33zM512 426.662V291.671l-256-39.385 237.787 174.376z"></path><circle cx="256" cy="252.29" r="59.359"></circle></g><circle fill="#FFDA44" cx="256" cy="252.29" r="44.522"></circle></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">North Macedonia +389</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 750 500"><path fill="#0071BC" d="M0 0h750v500H0V0z"></path><g fill="white" stroke="black" stroke-width="1.9"><circle cx="375" cy="245" r="225" fill="white"></circle><circle cx="375" cy="245" r="165" fill="#0071BC"></circle></g><g stroke="black"><path fill="#8C8A8C" stroke-width="1.9" d="M444.7 450c.7 11-7.8 20-18.8 20H323.6c-11 0-19.5-9-19-20l16.7-325c.6-11 10-20 21-20h61.4c11 0 20.5 9 21.2 20l19.8 325z"></path><path fill="white" stroke-width="2" stroke-linejoin="round" d="M373 114l30 93h97l-78 56 29 92-78-56-78 57 30-93-79-57h97l30-92z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Northern Mariana Islands +1670</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.334h512v341.337H0z"></path><path fill="white" d="M512 295.883H202.195v130.783H122.435V295.883H0V216.111h122.435V85.329H202.195v130.782H512V277.329z"></path><path fill="#2E52B2" d="M512 234.666v42.663H183.652v149.337h-42.674V277.329H0v-42.663h140.978V85.329h42.674v149.337z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Norway +47</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><g fill="#D80027"><path d="M0 85.331h512v341.326H0z"></path><path d="M0 85.331h512v341.337H0z"></path></g><g fill="white"><path d="M189.746 160.439l-15.739-15.741-10.494 10.494-10.493-10.494-15.741 15.741 10.494 10.493-10.495 10.494 15.74 15.741 10.494-10.494 10.495 10.494 15.739-15.741-10.494-10.494zM211.478 85.331H512v111.315H211.478z"></path></g><path fill="#6DA544" d="M211.478 315.353H512v111.304H211.478z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Oman +968</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><g fill="white"><path d="M393.508 170.516l17.512 18.875 23.363-10.821-12.541 22.487 17.513 18.876-25.263-4.978-12.539 22.488-3.073-25.564-25.263-4.978 23.363-10.82z"></path><path d="M0 85.343h512v341.326H0z"></path></g><path fill="#496E2D" d="M128 85.331h384v341.337H128z"></path><g fill="white"><path d="M361.909 298.793c-31.037 22.426-74.378 15.446-96.804-15.592-22.427-31.038-15.446-74.379 15.593-96.804 9.677-6.992 20.55-11.125 31.613-12.563-21.283-3.183-43.777 1.613-62.598 15.211-38.2 27.602-46.792 80.944-19.191 119.145 27.601 38.199 80.944 46.792 119.145 19.189 18.82-13.598 30.436-33.448 34.096-54.655-4.839 10.05-12.176 19.076-21.854 26.069zM360.58 172.889l17.484 18.842 23.322-10.802-12.519 22.447 17.483 18.844-25.219-4.968-12.519 22.45-3.067-25.521-25.22-4.969 23.323-10.802z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Pakistan +92</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#338AF3" d="M0 85.331h512v341.337H0z"></path><circle fill="#FFDA44" cx="218.902" cy="255.994" r="74.207"></circle></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Palau +680</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path d="M0 85.337h512v113.775H0z"></path><path fill="#6DA544" d="M0 312.888h512v113.775H0z"></path><path fill="#D80027" d="M256 256.006L0 426.668V85.331z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Palestine +970</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path d="M0 85.333h512V426.67H0z"></path><path fill="#A2001D" d="M0 85.33h512v341.332"></path><g fill="white"><path d="M204.631 326.488l2.762 8.504h8.941l-7.233 5.255 2.763 8.502-7.233-5.254-7.233 5.254 2.762-8.502-7.233-5.255h8.94zM181.797 244.866l4.605 14.172h14.901l-12.056 8.757 4.605 14.172-12.055-8.759-12.055 8.759 4.606-14.172-12.056-8.757h14.901zM181.797 348.749l4.604 14.173h14.902l-12.057 8.757 4.606 14.173-12.055-8.759-12.055 8.759 4.604-14.173-12.054-8.757h14.899zM225.363 281.967l4.606 14.172h14.901l-12.056 8.758 4.605 14.172-12.056-8.759-12.054 8.759 4.606-14.172-12.056-8.758h14.901zM138.23 281.967l4.606 14.172h14.899l-12.054 8.758 4.603 14.172-12.054-8.759-12.055 8.759 4.605-14.172-12.055-8.758h14.9z"></path></g><path fill="#FFDA44" d="M376.526 204.163c-7.628-7.628-17.538-12.133-28.189-12.908l31.88-24.795c-12.698-12.698-29.714-18.431-46.319-17.218a44.31 44.31 0 00-11.396-19.511l-12.593 25.186a18.47 18.47 0 00-3.148-4.197c-7.245-7.245-18.991-7.244-26.234 0s-7.245 18.99 0 26.234a18.536 18.536 0 004.197 3.148l-25.186 12.593a44.303 44.303 0 0019.519 11.399c-1.217 16.606 4.511 33.619 17.209 46.317L324.12 214.6a11.053 11.053 0 017.807-3.202c2.973 0 5.768 1.158 7.87 3.26a11.055 11.055 0 013.26 7.87c0 2.974-1.158 5.768-3.26 7.87l10.494 10.494c4.905-4.905 7.607-11.428 7.607-18.364 0-5.675-1.81-11.071-5.153-15.534a29.492 29.492 0 0113.288 7.662c11.573 11.572 11.573 30.403 0 41.975l10.494 10.494c8.409-8.409 13.039-19.59 13.039-31.481-.001-11.892-4.632-23.072-13.04-31.481z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Papua New Guinea +675</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#D80027" d="M0 85.337h512v113.775H0z"></path><path fill="#0052B4" d="M0 312.888h512v113.775H0z"></path><path fill="#6DA544" d="M289.579 216.738l-12.592 12.592c5.37 5.372 8.693 12.792 8.693 20.988 0 16.392-13.289 29.68-29.68 29.68-16.392 0-29.68-13.289-29.68-29.68 0-8.195 3.322-15.616 8.693-20.988l-12.592-12.592c-8.594 8.594-13.91 20.466-13.91 33.579 0 26.228 21.261 47.489 47.489 47.489s47.489-21.261 47.489-47.489c0-13.112-5.316-24.985-13.91-33.579z"></path><path fill="#FFDA44" d="M256 232.51l4.421 13.605h14.304l-11.573 8.408 4.421 13.604L256 259.719l-11.573 8.408 4.421-13.604-11.573-8.408h14.304z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Paraguay +595</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.331h512v341.326H0z"></path><g fill="#D80027"><path d="M0 85.331h170.663v341.337H0zM341.337 85.331H512v341.337H341.337z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Peru +51</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#0052B4" d="M512 85.337V256H256L0 85.337z"></path><path fill="#D80027" d="M512 256v170.663H0L256 256z"></path><g fill="#FFDA44"><path d="M161.908 256l-27.288-12.835 14.532-26.428-29.632 5.668-3.755-29.933-20.64 22.015-20.639-22.015-3.755 29.933-29.631-5.669 14.531 26.428L28.343 256l27.288 12.835L41.1 295.263l29.633-5.668 3.753 29.933 20.639-22.015 20.64 22.015 3.755-29.933 29.631 5.669-14.532-26.427zM21.789 117.607l9.081 12.696 14.879-4.714-9.268 12.56 9.081 12.694-14.809-4.932-9.268 12.559.117-15.608-14.809-4.934 14.88-4.712zM21.789 353.53l9.081 12.696 14.879-4.714-9.268 12.56 9.081 12.695-14.809-4.933-9.268 12.558.117-15.607-14.809-4.934 14.88-4.712zM210.395 235.569l-9.081 12.695-14.879-4.713 9.268 12.559-9.081 12.696 14.809-4.933 9.268 12.558-.117-15.607 14.809-4.934-14.88-4.713z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Philippines +63</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.333h512V426.67H0z"></path><path fill="#ACABB1" d="M400.696 219.822L384 225.387l-16.696-5.565-5.565-13.913 5.565-13.913h33.392l-5.566 13.913z"></path><path fill="#338AF3" d="M345.043 219.822v61.217c0 29.821 38.957 38.957 38.957 38.957s38.957-9.137 38.957-38.957v-61.217h-77.914z"></path><path fill="#6DA544" d="M348.555 295.541C358.131 313.927 384 319.996 384 319.996s25.869-6.069 35.445-24.455L384 236.518l-35.445 59.023z"></path><path fill="#FFDA44" d="M422.957 280.421L384 219.822l-38.957 60.599v.618c0 5.518 1.337 10.328 3.512 14.503L384 240.405l35.445 55.137c2.175-4.175 3.512-8.983 3.512-14.503v-.618z"></path><path fill="white" d="M256 85.333v30.553l-45.167 25.099H256v59.359h-59.103L256 233.179v22.817h-26.68l-73.494-40.826v40.826h-55.652v-48.573l-87.43 48.573H0v-30.554l45.167-25.098H0v-59.359h59.103L0 108.139V85.333h26.68l73.494 40.825V85.333h55.652v48.572l87.43-48.572z"></path><path fill="#D80027" d="M144 85.33h-32v69.332H0v32h112v69.334h32v-69.334h112v-32H144z"></path><path fill="#0052B4" d="M155.826 200.344L256 255.996v-15.737l-71.847-39.915z"></path><path fill="white" d="M155.826 200.344L256 255.996v-15.737l-71.847-39.915z"></path><g fill="#D80027"><path d="M155.826 200.344L256 255.996v-15.737l-71.847-39.915zM71.846 200.344L0 240.259v15.737l100.174-55.652z"></path></g><path fill="#0052B4" d="M100.174 140.982L0 85.33v15.737l71.847 39.915z"></path><path fill="white" d="M100.174 140.982L0 85.33v15.737l71.847 39.915z"></path><g fill="#D80027"><path d="M100.174 140.982L0 85.33v15.737l71.847 39.915zM184.154 140.982L256 101.067V85.33l-100.174 55.652z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Pitcairn +872</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><g fill="white"><path d="M0 85.337h512v341.326H0z"></path><path d="M0 85.337h512V256H0z"></path></g><path fill="#D80027" d="M0 256h512v170.663H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Poland +48</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.337h512v341.326H0z"></path><path fill="#6DA544" d="M196.641 85.337v341.326H0V85.337z"></path><circle fill="#FFDA44" cx="196.641" cy="256" r="64"></circle><path fill="#D80027" d="M160.638 224v40.001c0 19.882 16.118 36 36 36s36-16.118 36-36V224h-72z"></path><path fill="white" d="M196.638 276c-6.617 0-12-5.383-12-12v-16h24.001v16c-.001 6.616-5.385 12-12.001 12z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Portugal +351</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><g fill="#D80027"><path d="M0 85.337h512V153.6H0zM0 221.863h512v68.263H0zM0 358.4h512v68.263H0z"></path></g><path fill="#0052B4" d="M256 256.006L0 426.668V85.331z"></path><path fill="white" d="M83.477 195.132l15.107 46.498h48.894l-39.554 28.739 15.107 46.499-39.554-28.738-39.555 28.738 15.11-46.499-39.554-28.739H68.37z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Puerto Rico +1939</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#751A46" d="M2.216 86.076H512v339.848H2.216z"></path><path fill="white" d="M209.455 154.969l-50.236 25.267 50.236 25.257-50.236 25.267 50.236 25.257-50.236 25.266 50.236 25.257-50.236 25.268 50.236 25.257-50.236 25.267 50.236 25.268-36.45 18.33H0V86.07h172.939l36.516 18.364-50.236 25.267z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Qatar +974</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 26.666 640 426.666"><g fill-rule="evenodd" stroke-width="1pt"><path fill="white" d="M0 0h640v480H0z"></path><path fill="#00267f" d="M0 0h213.3v480H0z"></path><path fill="#f31830" d="M426.7 0H640v480H426.7z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Reunion +262</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.331h512v341.326H0z"></path><path fill="#0052B4" d="M0 85.331h170.663v341.337H0z"></path><path fill="#D80027" d="M341.337 85.331H512v341.337H341.337z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Romania +40</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.33v341.332h512V85.33z"></path><path fill="#0052B4" d="M0 85.333h512V426.67H0z"></path><path fill="white" d="M0 85.333h512v113.775H0z"></path><path fill="#D80027" d="M0 312.884h512v113.775H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Russia +7</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#338AF3" d="M0 85.331h512v341.337H0z"></path><path fill="#FFDA44" d="M0 255.994h512v81.619H0z"></path><path fill="#496E2D" d="M0 337.614h512v89.043H0z"></path><path fill="#FFDA44" d="M278.261 185.209l20.844 9.804-11.099 20.186 22.632-4.33 2.868 22.865 15.765-16.816 15.766 16.816 2.867-22.865 22.633 4.33-11.099-20.186 20.843-9.804-20.844-9.805 11.1-20.185-22.633 4.329-2.868-22.864-15.765 16.816-15.766-16.816-2.867 22.864-22.634-4.329 11.1 20.187z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Rwanda +250</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.33"><path fill="white" d="M0 0h512v341.33H0z"></path><path fill="#E6BC00" d="M157.31 199.76s-9.04 43.93-19.31 40.39c-10.62-3.54-17.53-18.76-17.53-18.76l-14.52 21.24s38.18 8.48 41.01 5.47c1.22-1.14 8.21-15.1 10.34-26.05v-22.29zm-56.13 60.57s-2.48 20.18-1.06 22.66c1.24 2.3 39.48 11.33 39.48 11.33s-24.96 16.46-29.74 20.54L91.8 284.94l-.71-24.61h10.09zM112.51 94.64s39.65 41.6 40.36 45.5c.71 3.72-4.25 3.19-4.25 3.19s-44.79-37.53-49.92-41.07c-5.31-3.55 13.81-7.62 13.81-7.62z"></path><path fill="#ADADAD" d="M99.41 104.73s16.99-.71 16.64-11.51c-.35-10.62-11.15-14.87-19.12-12.39-7.97 2.3-23.01 13.45-13.63 35.05 9.38 21.42 23.37 29.39 26.2 47.8 0 0-5.46 9.86-19.12.35-16.9-11.77-6.2-38.24-10.44-44.96-4.25-7.08-40.95-38.92-40.95-38.92s-30.24 39.37-18 74.92c16.95 49.21 51.74 31.98 64.61 36.76 0 0-42.13 61.96-49.57 67.09 0 0 24.08 8.32 47.8-18.76 0 0 5.84 9.74 7.08 20.18h10.27c4.78-26.2 51.51-64.26 49.92-82.32-1.77-21.25-49.21-49.39-51.69-73.29z"></path><path fill="#E6BC00" d="M359.17 201.27s8.96 42.43 19.23 38.89c10.62-3.54 17.53-18.76 17.53-18.76l14.52 21.24s-37 8.48-39.83 5.47c-1.21-1.14-9.32-13.79-11.52-24.66l.07-22.18zm56.05 59.06s2.48 20.18 1.06 22.66c-1.24 2.3-39.48 11.33-39.48 11.33s24.96 16.46 29.74 20.54l18.06-29.92.71-24.61h-10.09zM403.89 94.64s-39.65 41.6-40.36 45.5c-.71 3.72 4.25 3.19 4.25 3.19s44.79-37.53 49.92-41.07c5.14-3.55-13.81-7.62-13.81-7.62z"></path><path fill="#125ECC" d="M157.31 87.06H359.1v145.46c0 16.06-9.69 21.39-21.91 31.85l-45.92 39.41c-18.25 15.62-47.91 15.57-66.07 0l-46.01-39.43c-12.08-10.35-21.88-15.71-21.88-31.82V87.06z"></path><path fill="#FFE600" d="M200.55 147.71c-7.96 0-14.41-6.45-14.41-14.41s6.45-14.41 14.41-14.41 14.41 6.45 14.41 14.41-6.45 14.41-14.41 14.41zm57.65-3c-7.96 0-14.41-6.45-14.41-14.41s6.45-14.41 14.41-14.41 14.41 6.45 14.41 14.41-6.45 14.41-14.41 14.41zm57.65 3c-7.96 0-14.41-6.45-14.41-14.41s6.45-14.41 14.41-14.41 14.41 6.45 14.41 14.41-6.45 14.41-14.41 14.41zM214.96 274.43c-7.96 0-14.41-6.45-14.41-14.41s6.45-14.41 14.41-14.41 14.41 6.45 14.41 14.41c.01 7.96-6.45 14.41-14.41 14.41zm43.24 14.42c-7.96 0-14.41-6.45-14.41-14.41s6.45-14.41 14.41-14.41 14.41 6.45 14.41 14.41c0 7.95-6.45 14.41-14.41 14.41zm43.24-14.42c-7.96 0-14.41-6.45-14.41-14.41s6.45-14.41 14.41-14.41 14.41 6.45 14.41 14.41-6.45 14.41-14.41 14.41z"></path><path fill="#D60537" d="M157.31 175.36H359.1v57.65H157.31v-57.65z"></path><path fill="#EACE00" d="M142.9 43.82s57.65-14.41 115.31-14.41 115.31 14.41 115.31 14.41l-14.41 57.65s-50.45-14.41-100.89-14.41-100.89 14.41-100.89 14.41L142.9 43.82z"></path><path fill="#7A6920" d="M258.2 72.65c-7.96 0-14.41-6.45-14.41-14.41s6.45-14.41 14.41-14.41 14.41 6.45 14.41 14.41-6.45 14.41-14.41 14.41zm57.65 5c-7.96 0-14.41-6.45-14.41-14.41s6.45-14.41 14.41-14.41 14.41 6.45 14.41 14.41-6.45 14.41-14.41 14.41zm-115.3 0c-7.96 0-14.41-6.45-14.41-14.41s6.45-14.41 14.41-14.41 14.41 6.45 14.41 14.41-6.45 14.41-14.41 14.41z"></path><path fill="#ADADAD" d="M365.08 178.02c-1.59 18.06 45.14 56.12 49.92 82.32h10.27c1.24-10.44 7.08-20.18 7.08-20.18 23.72 27.09 47.8 18.76 47.8 18.76-7.44-5.13-49.57-67.09-49.57-67.09 12.88-4.78 47.67 12.45 64.61-36.76 12.24-35.55-18-74.92-18-74.92s-36.7 31.84-40.95 38.92c-4.25 6.73 6.46 33.2-10.44 44.96-13.66 9.51-19.12-.35-19.12-.35 2.83-18.41 16.82-26.38 26.2-47.8 9.38-21.6-5.66-32.75-13.63-35.05-7.97-2.48-18.76 1.77-19.12 12.39-.35 10.8 16.64 11.51 16.64 11.51-2.48 23.9-49.92 52.04-51.69 73.29z"></path><circle fill="white" cx="258.2" cy="204.19" r="16.93"></circle></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Saint Barthelemy +590</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#0052B4" d="M0 0h512v341.3H0z"></path><path fill="white" d="M256 0v117.4h-46.1l46.1 30.7v22.6h-22.6L160 121.8v48.9H96v-48.9l-73.4 48.9H0v-22.6l46.1-30.7H0v-64h46.1L0 22.7V0h22.6L96 48.9V0h64v48.9L233.4 0z"></path><g fill="#D80027"><path d="M144 0h-32v69.4H0v32h112v69.3h32v-69.3h112v-32H144z"></path><path d="M0 0v15.1l57.4 38.3H80zM256 0v15.1l-57.4 38.3H176z"></path></g><path fill="#2E52B2" d="M256 22.7v30.7h-46.1z"></path><g fill="#D80027"><path d="M0 0v15.1l57.4 38.3H80zM256 0v15.1l-57.4 38.3H176z"></path></g><path fill="#2E52B2" d="M256 22.7v30.7h-46.1z"></path><g fill="#D80027"><path d="M0 170.7v-15.1l57.4-38.2H80zM256 170.7v-15.1l-57.4-38.2H176z"></path></g><path fill="#29DBFF" d="M449 139.7c-.1 44.4-7.2 92.1-65 114.9-57.8-22.8-64.9-70.5-65-114.9h130z"></path><path fill="#ffda44" d="M449 139.7c0-16.7-.9-32.9-.5-47.1C426.9 83 398.4 81 383.9 81s-42.9 2-64.6 11.6c.4 14.2-.5 30.4-.5 47.1H449z"></path><path fill="#BF521B" d="M369.5 204.5l.3 10.3-12.8.2 4.9 13.2h-17.3c-18-20.2-23.4-42.4-24.9-68.1l9.1-9.7 8.3 14.3 10.8-12.8 7 7.8.8 15.7 13.8 29.1z"></path><path fill="#474747" d="M436.6 192.5l-8.6 18.3h-47l-29.2-19.5 25.7 10.5h25.1l3.7-6.5 7.2.2 2-3z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Saint Helena, Ascension and Tristan Da Cunha +290</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#D80027" d="M0 0h513v342H0z"></path><path fill="#6DA544" d="M512 0H0v342"></path><path fill="#FFDA44" d="M307.7 0L0 194.5V342h206.9L513 148.5V0z"></path><path d="M513 0H385.2L0 249.4V341l126.2 1L513 91.6z"></path><g fill="white"><path d="M141.1 187l31.2 24 32.3-22.2-13.1 37 31.1 23.9-39.2-1.1-13.2 37-11.1-37.6-39.2-1.1 32.3-22.2zM310.6 70.8l31.2 23.9 32.3-22.2-13.1 37 31.1 23.9-39.2-1.1-13.2 37-11.1-37.6-39.2-1.1 32.4-22.2z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Saint Kitts and Nevis +1869</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="#55B2FF" d="M0 0h513v342H0z"></path><path fill="#F3F3F3" d="M148.5 298.1h216l-108-254.2z"></path><path fill="#333" d="M186 272.7l70.5-160.3L327 272.7z"></path><path fill="#FFDA44" d="M148.5 298.1h216l-108-101.7z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Saint Lucia +1758</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 108 72"><path d="M0 0h108v72H0z" fill="#003787"></path><path d="M0 0h108L60 48v24H48V48z" fill="white"></path><circle cx="54" cy="30" r="8" fill="#f9d90f"></circle><path d="M44 30h20L54 48z" fill="white"></path><path d="M54 48L38 33h32z" fill="#cf142b"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Saint Martin +590</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 26.666 640 426.666"><g fill-rule="evenodd" stroke-width="1pt"><path fill="white" d="M0 0h640v480H0z"></path><path fill="#00267f" d="M0 0h213.3v480H0z"></path><path fill="#f31830" d="M426.7 0H640v480H426.7z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Saint Pierre and Miquelon +508</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.331h512v341.337H0z"></path><path fill="#338AF3" d="M0 85.331h170.663v341.337H0z"></path><g fill="#6DA544"><path d="M341.337 85.331H512v341.337H341.337zM214.261 283.82l-33.393-50.086 33.392-50.087 33.392 50.087zM297.739 283.82l-33.391-50.086 33.391-50.087 33.393 50.087zM256 350.603l-33.391-50.087L256 250.429l33.391 50.087z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Saint Vincent and the Grenadines +1784</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.331h512v341.337H0z"></path><path fill="#0052B4" d="M0 85.331h256v170.663H0z"></path><g fill="white"><path d="M165.483 181.79l2.764 8.504h8.939l-7.232 5.254 2.763 8.503-7.234-5.255-7.233 5.255 2.763-8.503-7.233-5.254h8.94zM120.579 115.007l4.606 14.173h14.9l-12.055 8.757 4.605 14.171-12.056-8.758-12.054 8.758 4.605-14.171-12.056-8.757h14.901zM165.101 129.848l4.606 14.172h14.9l-12.055 8.757 4.604 14.173-12.055-8.76-12.054 8.76 4.604-14.173-12.055-8.757h14.9zM129.909 189.211l4.606 14.172h14.9l-12.055 8.758 4.604 14.171-12.055-8.759-12.054 8.759 4.604-14.171-12.055-8.758h14.9zM90.899 152.108l4.605 14.173h14.9l-12.055 8.757 4.604 14.173-12.054-8.76-12.055 8.76 4.604-14.173-12.055-8.757h14.9z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Samoa +685</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#338AF3" d="M0 85.34h512v341.326H0z"></path><path fill="white" d="M512 85.334v166.69L0 256.175V85.334z"></path><path fill="#6DA544" d="M323.744 203.099L256 270.843l-67.744-67.744a81.156 81.156 0 00-13.879 45.483v22.261c0 35.744 23.097 66.193 55.148 77.213-4.277 8.385-3.556 18.848 2.712 26.671l24.258-19.439 24.258 19.439c6.342-7.915 7.011-18.534 2.564-26.968 31.614-11.261 54.308-41.485 54.308-76.916v-22.261a81.174 81.174 0 00-13.881-45.483z"></path><path fill="#FFDA44" d="M256 330.206c-32.732 0-59.362-26.63-59.362-59.362v-22.261c0-32.733 26.63-59.363 59.362-59.363s59.362 26.63 59.362 59.362v22.261c0 32.733-26.63 59.363-59.362 59.363z"></path><path fill="#338AF3" d="M293.101 270.843v-22.261c0-20.458-16.643-37.101-37.101-37.101s-37.101 16.643-37.101 37.101v22.261L256 278.264l37.101-7.421z"></path><path fill="#6DA544" d="M218.899 270.843c0 20.458 16.643 37.101 37.101 37.101s37.101-16.643 37.101-37.101h-74.202z"></path><path fill="#FFDA44" d="M300.522 189.22c0-12.295-9.966-22.261-22.261-22.261a22.173 22.173 0 00-14.84 5.672v-13.093h7.421v-14.84h-7.421v-7.421h-14.84v7.421h-7.421v14.84h7.421v13.093a22.177 22.177 0 00-14.841-5.672c-12.295 0-22.261 9.966-22.261 22.261 0 6.591 2.867 12.512 7.421 16.589v13.093h74.203v-13.093c4.552-4.077 7.419-9.997 7.419-16.589z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">San Marino +378</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.337h512v341.326H0z"></path><g fill="#6DA544"><path d="M0 85.337h512v113.775H0zM0 312.888h512v113.775H0z"></path></g><path fill="#D80027" d="M256 256.006L0 426.668V85.331z"></path><path d="M302.049 226.318l7.368 22.674h23.842l-19.288 14.016 7.366 22.674-19.288-14.015-19.287 14.015 7.366-22.674-19.288-14.016h23.842zM376.252 226.318l7.367 22.674h23.842l-19.288 14.016 7.367 22.674-19.288-14.015-19.288 14.015 7.367-22.674-19.288-14.016h23.842z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Sao Tome and Principe +239</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#6DA544" d="M0 85.331h512v341.337H0z"></path><g fill="white"><path d="M183.548 289.386c0 12.295 9.731 22.261 21.736 22.261h65.208c0 10.244 8.11 18.551 18.114 18.551h21.736c10.004 0 18.114-8.306 18.114-18.551v-22.261H183.548zM330.264 181.791v51.942c0 8.183-6.5 14.84-14.491 14.84v22.261c19.976 0 36.226-16.643 36.226-37.101v-51.942h-21.735zM174.491 233.734c0 8.183-6.5 14.84-14.491 14.84v22.261c19.976 0 36.226-16.643 36.226-37.101v-51.942H174.49v51.942z"></path><path d="M297.661 181.788h21.736v51.942h-21.736zM265.057 211.473c0 2.046-1.625 3.71-3.623 3.71-1.998 0-3.623-1.664-3.623-3.71v-29.682h-21.736v29.682c0 2.046-1.625 3.71-3.623 3.71s-3.623-1.664-3.623-3.71v-29.682h-21.736v29.682c0 14.32 11.376 25.971 25.358 25.971 5.385 0 10.38-1.733 14.491-4.677 4.11 2.944 9.106 4.677 14.491 4.677 1.084 0 2.15-.078 3.2-.215-1.54 6.499-7.255 11.345-14.068 11.345v22.261c19.976 0 36.226-16.643 36.226-37.101v-51.943h-21.736l.002 29.682z"></path><path d="M207.093 248.57h32.601v22.261h-32.601z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Saudi Arabia +966</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.331h512v341.326H0z"></path><path fill="#D80027" d="M330.207 85.331H512v341.337H330.207z"></path><g fill="#496E2D"><path d="M0 85.331h181.793v341.337H0zM255.999 196.632l14.733 45.347h47.685l-38.576 28.029 14.734 45.348-38.576-28.026-38.577 28.026 14.737-45.348-38.576-28.029h47.681z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Senegal +221</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.331h512v341.337H0z"></path><path fill="#D80027" d="M0 85.331h512v113.775H0z"></path><path fill="white" d="M0 312.882h512v113.775H0z"></path><path fill="#D80027" d="M129.468 181.793v85.136c0 48.429 63.267 63.267 63.267 63.267S256 315.356 256 266.929v-85.136H129.468z"></path><g fill="#FFDA44"><path d="M155.634 196.634h74.201v-29.681l-14.841 7.42-22.261-22.26-22.259 22.26-14.84-7.42zM241.16 278.782l-48.231-48.231-48.231 48.231 15.741 15.74 32.49-32.49 32.49 32.49z"></path></g><path fill="white" d="M241.16 233.734h-22.504a14.74 14.74 0 002.001-7.418c0-8.196-6.645-14.84-14.84-14.84-5.663 0-10.581 3.172-13.083 7.836-2.502-4.663-7.421-7.836-13.083-7.836-8.195 0-14.84 6.644-14.84 14.84 0 2.706.736 5.235 2.001 7.418h-22.114c0 8.196 7.139 14.84 15.334 14.84h-.494c0 8.196 6.644 14.84 14.84 14.84 0 7.257 5.211 13.286 12.094 14.576l-11.694 26.401a48.075 48.075 0 0018.149 3.544 48.079 48.079 0 0018.149-3.544l-11.694-26.401c6.883-1.29 12.094-7.319 12.094-14.576 8.196 0 14.84-6.644 14.84-14.84h-.494c8.199 0 15.338-6.644 15.338-14.84z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Serbia +381</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#FFDA44" d="M235.454 85.337L0 426.663 427.345 85.337z"></path><path fill="#6DA544" d="M512 329.393L0 426.663h512z"></path><path fill="#D80027" d="M512 85.337h-84.655L0 426.663l512-204.512z"></path><path fill="#0052B4" d="M0 85.337v341.326L235.454 85.337z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Seychelles +248</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#6DA544" d="M0 85.337h512v113.775H0z"></path><path fill="#338AF3" d="M0 312.888h512v113.775H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Sierra Leone +232</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.337h512v341.326H0z"></path><path fill="#D80027" d="M512 85.331v166.69L0 256.173V85.331z"></path><path fill="white" d="M256 256.006L0 426.668V85.331z"></path><g fill="#FFDA44"><path d="M59.621 256a59.546 59.546 0 00-.193 4.57c0 32.821 26.607 59.429 59.429 59.429s59.429-26.607 59.429-59.429c0-1.539-.078-3.061-.193-4.57H59.621z"></path><circle cx="118.862" cy="210.287" r="18.286"></circle></g><path fill="#D80027" d="M77.715 205.714v59.429c0 31.494 41.144 41.143 41.144 41.143s41.144-9.649 41.144-41.143v-59.429H77.715z"></path><path fill="#338AF3" d="M118.877 287.148c-7.632-2.746-22.876-9.767-22.876-22.006v-41.144h45.715v41.144c-.001 12.28-15.244 19.283-22.839 22.006z"></path><path fill="#F3F3F3" d="M128.001 246.856v-9.142l-9.144-4.571-9.142 4.571v9.142l-4.571 4.573v18.285h27.428v-18.285z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Sint Maarten +1721</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#0052B4" d="M0 196.641h512v118.717H0z"></path><path fill="#D80027" d="M0 315.359h512v111.304H0z"></path><path fill="white" d="M129.468 181.799v85.136c0 48.429 63.267 63.267 63.267 63.267S256 315.362 256 266.935v-85.136H129.468z"></path><path fill="#D80027" d="M146.126 184.294v81.941c0 5.472 1.215 10.64 3.623 15.485h85.97c2.408-4.844 3.623-10.012 3.623-15.485v-81.941h-93.216z"></path><path fill="white" d="M221.301 241.427h-21.425v-14.283h14.284v-14.283h-14.284v-14.284h-14.283v14.284h-14.282v14.283h14.282v14.283h-21.426v14.284h21.426v14.283h14.283v-14.283h21.425z"></path><path fill="#0052B4" d="M169.232 301.658c9.204 5.783 18.66 9.143 23.502 10.636 4.842-1.494 14.298-4.852 23.502-10.636 9.282-5.833 15.79-12.506 19.484-19.939a24.878 24.878 0 00-14.418-4.583c-1.956 0-3.856.232-5.682.657-3.871-8.796-12.658-14.94-22.884-14.94-10.227 0-19.013 6.144-22.884 14.94a25.048 25.048 0 00-5.682-.657 24.88 24.88 0 00-14.418 4.583c3.691 7.433 10.198 14.106 19.48 19.939z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Slovakia +421</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#0052B4" d="M0 199.112h512v113.775H0z"></path><path fill="#D80027" d="M0 312.888h512v113.775H0z"></path><path fill="white" d="M233.606 196.639v14.837c0 34.081-44.522 44.522-44.522 44.522s-44.522-10.44-44.522-44.522v-14.837l-.145-44.188 89.043-.266.146 44.454z"></path><path fill="#0052B4" d="M233.606 196.639v14.837c0 34.081-44.522 44.522-44.522 44.522s-44.522-10.44-44.522-44.522v-14.837l-.145-44.188 89.043-.266.146 44.454z"></path><path fill="white" d="M233.606 196.639v14.837c0 34.081-44.522 44.522-44.522 44.522s-44.522-10.44-44.522-44.522v-14.837l14.848 14.837 29.674-22.261 29.685 22.261 14.837-14.837z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Slovenia +386</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#496E2D" d="M0 85.334h512v341.337H0z"></path><path fill="#0052B4" d="M0 426.663V85.329h512"></path><path fill="#FFDA44" d="M0 396.494v30.169h45.255L512 115.499v-30.17h-45.255z"></path><g fill="white"><path d="M85.688 108.787l5.12 15.756h16.566l-13.403 9.737 5.12 15.757-13.403-9.738-13.405 9.738 5.12-15.757L64 124.543h16.567zM170.312 108.787l5.121 15.756H192l-13.403 9.737 5.12 15.757-13.405-9.738-13.403 9.738 5.12-15.757-13.403-9.737h16.566zM85.688 191.289l5.12 15.756h16.566l-13.403 9.738 5.12 15.757-13.403-9.739-13.405 9.739 5.12-15.757L64 207.045h16.567zM170.312 191.289l5.121 15.756H192l-13.403 9.738 5.12 15.757-13.405-9.739-13.403 9.739 5.12-15.757-13.403-9.738h16.566zM128 150.037l5.12 15.756h16.568l-13.405 9.738 5.12 15.758L128 181.55l-13.403 9.739 5.12-15.758-13.405-9.738h16.568z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Solomon Islands +677</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#338AF3" d="M0 85.331h512v341.337H0z"></path><path fill="white" d="M256 157.273l22.663 69.748H352l-59.332 43.106 22.664 69.749L256 296.769l-59.332 43.107 22.664-69.749L160 227.021h73.337z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Somalia +252</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path d="M114.024 256.001L0 141.926v228.17z"></path><path fill="#FFDA44" d="M161.192 256L0 94.7v47.226l114.024 114.075L0 370.096v47.138z"></path><path fill="#6DA544" d="M509.833 289.391c.058-.44.804-.878 2.167-1.318v-65.464H222.602L85.33 85.337H0V94.7L161.192 256 0 417.234v9.429h85.33l137.272-137.272h287.231z"></path><path fill="#0052B4" d="M503.181 322.783H236.433l-103.881 103.88H512v-103.88z"></path><path fill="#D80027" d="M503.181 189.217H512V85.337H132.552l103.881 103.88z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">South Africa +27</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#0052B4" d="M0 0h512v341.3H0z"></path><path fill="white" d="M256 0v117.4h-46.1l46.1 30.7v22.6h-22.6L160 121.8v48.9H96v-48.9l-73.4 48.9H0v-22.6l46.1-30.7H0v-64h46.1L0 22.7V0h22.6L96 48.9V0h64v48.9L233.4 0z"></path><path fill="#D80027" d="M144 0h-32v69.4H0v32h112v69.3h32v-69.3h112v-32H144z"></path><path fill="#2E52B2" d="M256 22.7v30.7h-46.1z"></path><path fill="#D80027" d="M0 170.7v-11l62.5-42.3h22.6L7.3 170.7zM7.3.1l77.8 53.2H62.5L0 11.1V.1zM256 .1v11l-62.5 42.3h-22.6L248.7.1zM248.7 170.7l-77.8-53.3h22.6l62.5 42.3v11z"></path><g><ellipse fill="white" cx="443.4" cy="233.6" rx="29" ry="43.5"></ellipse><ellipse fill="#FFCE00" cx="406.9" cy="317.7" rx="22" ry="9.3"></ellipse><ellipse fill="#FFCE00" cx="364" cy="317.7" rx="22" ry="9.3"></ellipse><path fill="#39B200" d="M342 190.1l43.4 86.9 43.5-86.9z"></path><ellipse fill="#9B9B9B" cx="327.5" cy="233.6" rx="29" ry="43.5"></ellipse><path fill="#757575" d="M371 175.6l-14.5 14.5h57.9l-14.5-14.5 14.5-43.5s-13-29-29-29-29 29-29 29l14.6 43.5z"></path><circle fill="#C6B56F" cx="385.4" cy="67" r="29"></circle><circle fill="#A54A00" cx="386" cy="88.7" r="29"></circle><circle fill="white" cx="443.4" cy="117.7" r="29"></circle><circle fill="#0049FF" cx="342.2" cy="146.7" r="29"></circle><circle fill="#0041F9" cx="429.8" cy="146.7" r="29"></circle><circle fill="#F7D71E" cx="386" cy="233.6" r="29"></circle><circle fill="#CEC851" cx="457.9" cy="190.1" r="29"></circle><circle fill="white" cx="385.4" cy="289.5" r="29"></circle><path fill="#7C0B29" d="M371 135.7l14.5-3.5 14.5 3.5c0 7.5-14.5 11-14.5 11s-14.5-3.5-14.5-11z"></path><circle fill="white" cx="327.5" cy="117.4" r="29"></circle></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">South Georgia and the South Sandwich Islands +500</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#496E2D" d="M0 322.783h512v103.88H0z"></path><path d="M0 85.337h512v104.515H0z"></path><path fill="#A2001D" d="M0 210.877h512v89.656H0z"></path><path fill="#0052B4" d="M256 256.006L0 426.668V85.331z"></path><path fill="#FFDA44" d="M73.178 209.188l20.831 29.067 34.084-10.83-21.207 28.795 20.83 29.069-33.939-11.271-21.208 28.794.234-35.762-33.94-11.273 34.083-10.83z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">South Sudan +211</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.331h512v341.337H0z"></path><g fill="#D80027"><path d="M0 85.331h512v113.775H0zM0 312.882h512v113.775H0z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Spain +34</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.329v341.337h512V85.329H0zm489.739 319.076h-267.13V107.59h267.13v296.815z"></path><path fill="#A2001D" d="M222.609 107.595h267.13V404.41h-267.13z"></path><path fill="#D80027" d="M22.261 107.595h200.348V404.41H22.261z"></path><path fill="#FFDA44" d="M200.348 85.334h22.261v341.337h-22.261z"></path><path fill="#6DA544" d="M22.261 107.595h89.043V404.41H22.261z"></path><path fill="#FF9811" d="M111.304 107.595h89.043V404.41h-89.043z"></path><g fill="#FFDA44"><path d="M358.675 250.438v-44.522c0-7.424-11.13-14.848-11.13-14.848s-11.13 7.424-11.13 14.848h-44.522v44.522h22.261v22.261c0 4.875.979 9.539 2.76 13.768l-10.184 8.493h-29.674V157.677c-12.299 0-22.261 9.973-22.261 22.261v96.467a22.19 22.19 0 007.413 16.584v35.361h14.848v-18.554h66.783v29.685H328.99v14.837h29.685v-29.685l13.601-14.837h44.288v29.685h-14.848v14.837h29.685v-29.685l13.601-14.837 12.552-40.259-11.038-19.1h-38.945c-14.169-.122-40.637.09-48.896.001z"></path><path d="M370.551 211.844v25.229h71.513v13.365h4.452v-17.817h-71.513v-16.325h75.965v-4.452zM222.609 107.595h22.261v22.261h-22.261zM467.478 107.595h22.261v22.261h-22.261zM222.609 382.138h22.261v22.261h-22.261zM467.478 382.138h22.261v22.261h-22.261z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Sri Lanka +94</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#D80027" d="M0 85.337h512v113.775H0z"></path><path d="M0 312.888h512v113.775H0z"></path><path fill="#496E2D" d="M0 426.668V85.331l256 170.675z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Sudan +249</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.331h512v341.337H0z"></path><path fill="#A2001D" d="M0 196.636h512v118.728H0z"></path><g fill="#6DA544"><path d="M0 352.462h512v74.207H0zM0 85.331h512v74.207H0z"></path></g><path fill="#FFDA44" d="M256.742 218.003l9.43 29.021h30.518L272 264.963l9.431 29.023-24.689-17.937-24.689 17.937 9.431-29.023-24.69-17.939h30.518z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Suriname +597</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.334h512v341.337H0z"></path><path fill="white" d="M512 295.883H202.195v130.783H122.435V295.883H0V216.111h122.435V85.329H202.195v130.782H512V277.329z"></path><path fill="#2E52B2" d="M512 234.666v42.663H183.652v149.337h-42.674V277.329H0v-42.663h140.978V85.329h42.674v149.337z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Svalbard and Jan Mayen +47</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.333h512V426.67H0z"></path><path fill="#FFDA44" d="M192 85.33h-64v138.666H0v64h128v138.666h64V287.996h320v-64H192z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Sweden +46</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.337h512v341.326H0z"></path><path fill="white" d="M356.174 222.609h-66.783v-66.783h-66.782v66.783h-66.783v66.782h66.783v66.783h66.782v-66.783h66.783z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Switzerland +41</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.331h512v341.337H0z"></path><path fill="#D80027" d="M0 85.331h512v113.775H0z"></path><path d="M0 312.882h512v113.775H0z"></path><g fill="#6DA544"><path d="M187.31 215.184l9.208 28.341h29.802l-24.11 17.518 9.209 28.342-24.109-17.516-24.11 17.516 9.209-28.342-24.109-17.518h29.801zM324.69 215.184l9.209 28.341H363.7l-24.109 17.518 9.209 28.342-24.11-17.516-24.109 17.516 9.209-28.342-24.11-17.518h29.802z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Syrian Arab Republic +963</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.337h512v341.326H0z"></path><path fill="#0052B4" d="M0 85.337h256V256H0z"></path><path fill="white" d="M186.435 170.669L162.558 181.9l12.714 23.125-25.927-4.961-3.286 26.192L128 206.993l-18.06 19.263-3.285-26.192-25.927 4.96 12.714-23.125-23.877-11.23 23.877-11.231-12.714-23.125 25.927 4.96 3.286-26.192L128 134.344l18.06-19.263 3.285 26.192 25.928-4.96-12.715 23.125z"></path><circle fill="#0052B4" cx="128" cy="170.674" r="29.006"></circle><path fill="white" d="M128 190.06c-10.692 0-19.391-8.7-19.391-19.391 0-10.692 8.7-19.391 19.391-19.391 10.692 0 19.391 8.7 19.391 19.391 0 10.691-8.699 19.391-19.391 19.391z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Taiwan +886</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#D80027" d="M0 85.337h512v113.775H0z"></path><path fill="#6DA544" d="M0 312.888h512v113.775H0z"></path><g fill="#FFDA44"><path d="M226.318 300.522h59.364v-25.23l-11.873 5.937L256 263.421l-17.809 17.808-11.873-5.937zM192.355 270.84l2.763 8.504h8.94l-7.233 5.255 2.763 8.502-7.233-5.255-7.234 5.255 2.763-8.502-7.233-5.255h8.94zM200.921 241.16l2.763 8.502h8.94l-7.233 5.255 2.763 8.504-7.233-5.256-7.234 5.256 2.763-8.504-7.233-5.255h8.94zM225.409 218.899l2.763 8.502h8.94l-7.233 5.255 2.763 8.504-7.233-5.256-7.234 5.256 2.763-8.504-7.233-5.255h8.94zM319.645 270.84l-2.763 8.504h-8.94l7.233 5.255-2.763 8.502 7.233-5.255 7.234 5.255-2.763-8.502 7.233-5.255h-8.94zM311.079 241.16l-2.763 8.502h-8.94l7.233 5.255-2.763 8.504 7.233-5.256 7.234 5.256-2.763-8.504 7.233-5.255h-8.94zM286.591 218.899l-2.763 8.502h-8.94l7.233 5.255-2.763 8.504 7.233-5.256 7.234 5.256-2.763-8.504 7.233-5.255h-8.94zM256 207.767l2.763 8.503h8.941l-7.234 5.256 2.763 8.502-7.233-5.254-7.233 5.254 2.763-8.502-7.234-5.256h8.941z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Tajikistan +992</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#338AF3" d="M0 85.337h512v341.326H0z"></path><path fill="#6DA544" d="M0 426.663V85.337h512"></path><path fill="#FFDA44" d="M512 152.222V85.337H411.67L0 359.778v66.885h100.33z"></path><path d="M512 85.337v40.125L60.193 426.663H0v-40.125L451.807 85.337z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Tanzania, United Republic of Tanzania +255</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.334h512V426.66H0z"></path><path fill="#0052B4" d="M0 194.056h512v123.882H0z"></path><g fill="#D80027"><path d="M0 85.334h512v54.522H0zM0 372.143h512v54.522H0z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Thailand +66</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.337h512v341.326H0z"></path><path fill="#FFDA44" d="M256 256L0 90.691v44.242L155.826 256 0 377.067v44.242z"></path><path d="M0 90.691v330.618L189.217 256z"></path><path fill="white" d="M44.184 213.36l24.912 23.577 30.121-16.41-14.723 30.98 24.911 23.575-34.012-4.43L60.67 301.63l-6.296-33.716-34.012-4.43 30.119-16.408z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Timor-Leste +670</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.337h512v341.326H0z"></path><g fill="#496E2D"><path d="M0 85.337h512V153.6H0zM0 358.4h512v68.263H0zM0 221.863h512v68.263H0z"></path></g><path fill="#D80027" d="M0 85.337h204.054v204.054H0z"></path><path fill="white" d="M102.026 133.938l13.26 40.812h42.916l-34.718 25.226 13.26 40.814-34.718-25.224-34.719 25.224 13.263-40.814-34.718-25.226h42.913z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Togo +228</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.337h512v341.326H0z"></path><g fill="white"><path d="M210.715 174.377l3.684 11.338h11.919l-9.643 7.006 3.684 11.337-9.644-7.007-9.644 7.007 3.684-11.337-9.645-7.006h11.921zM116.816 281.971l4.605 14.172h14.9l-12.055 8.757 4.606 14.173-12.056-8.76-12.055 8.76 4.604-14.173-12.054-8.757h14.899zM144.696 119.679l4.604 14.172h14.901l-12.056 8.758 4.606 14.171-12.055-8.759-12.056 8.759 4.606-14.171-12.055-8.758h14.9zM69.539 175.331l4.604 14.172h14.9l-12.055 8.758 4.606 14.171-12.055-8.758-12.056 8.758 4.606-14.171-12.055-8.758h14.9z"></path></g><g fill="#FFDA44"><path d="M483.386 354.503H117.801s109.234-88.562 310.593-220.938c.001 0-88.443 128.935 54.992 220.938zM117.801 366.089c-11.177 0-11.195 17.37 0 17.37h365.585c11.177 0 11.195-17.37 0-17.37H117.801z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Tokelau +690</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.331h512v341.337H0z"></path><path fill="white" d="M0 85.331h256v170.663H0z"></path><path fill="#D80027" d="M141.357 157.303V130.59h-26.714v26.713H87.93v26.713h26.713v26.713h26.714v-26.713h26.713v-26.713z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Tonga +676</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.337h512v341.326H0z"></path><path fill="white" d="M6.066 85.337l207.961 212.636 131.584 128.69h160.323L297.973 214.027 166.389 85.337z"></path><path d="M43.364 85.337L384.69 426.663h83.946L127.31 85.337z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Trinidad and Tobago +1868</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.331h512v341.337H0z"></path><circle fill="white" cx="256" cy="255.994" r="96"></circle><g fill="#D80027"><path d="M267.826 219.291l16.47 22.695 26.673-8.649-16.496 22.676 16.468 22.695-26.664-8.681-16.495 22.676.017-28.04-26.664-8.682 26.674-8.648z"></path><path d="M277.818 312.724c-31.33 0-56.727-25.397-56.727-56.727s25.397-56.727 56.727-56.727c9.769 0 18.96 2.47 26.985 6.819-12.589-12.31-29.804-19.909-48.803-19.909-38.558 0-69.818 31.259-69.818 69.818s31.26 69.818 69.818 69.818c18.999 0 36.215-7.599 48.803-19.909-8.026 4.347-17.216 6.817-26.985 6.817z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Tunisia +216</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 450 300"><path fill="#d80027" d="M0 150V0h450v300H0V150z"></path><path fill="white" d="M247.3 118.3l35.2 5.8L307.4 99l5.1 32.8L344 150l-31.5 18.2-4.9 33.5-25.1-25.9-35.2 5.8L263 150z"></path><path fill="white" d="M240.6 228.6c-43.3 0-78.3-35.1-78.3-78.3S197.4 72 240.6 72c8.1 0 15.8 1.2 23.2 3.5-17.3-15-39.8-24-64.5-24-54.4 0-98.6 44.1-98.6 98.6s44.1 98.6 98.6 98.6c24.2 0 46.3-8.7 63.4-23.1-7 1.9-14.4 3-22.1 3z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Turkey +90</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#496E2D" d="M0 85.337h512v341.326H0z"></path><g fill="white"><path d="M357.208 183.679c8.397-23.404-1.036-48.858-21.281-61.536a52.131 52.131 0 0110.884 2.621c27.002 9.688 41.038 39.428 31.35 66.431s-39.428 41.038-66.431 31.35a52.182 52.182 0 01-10.069-4.895c23.686 3.084 47.15-10.566 55.547-33.971zM310.637 115.729l-7.297 9.427-11.22-4.026 6.712 9.852-7.296 9.427 11.443-3.338 6.712 9.852.361-11.914 11.444-3.339-11.221-4.025z"></path><path d="M330.338 146.448l-7.296 9.427-11.221-4.026 6.712 9.852-7.296 9.427 11.443-3.339 6.712 9.853.36-11.915 11.445-3.34-11.221-4.024zM275.9 126.916l-7.296 9.427-11.219-4.024 6.711 9.851-7.296 9.426 11.443-3.338 6.712 9.852.361-11.915 11.444-3.337-11.221-4.027zM275.101 162.105l-7.296 9.427-11.221-4.026 6.712 9.852-7.296 9.427 11.444-3.338 6.711 9.852.362-11.915 11.443-3.338-11.22-4.026zM308.585 174.118l-7.296 9.427-11.22-4.026 6.712 9.853-7.297 9.426 11.444-3.338 6.712 9.852.36-11.915 11.443-3.338-11.219-4.025z"></path></g><path fill="#D80027" d="M83.478 85.337h89.043v341.326H83.478z"></path><path fill="white" d="M117.458 175.191l-14.908-11.105v-15.705l14.908-11.105h21.084l14.908 11.105v15.705l-14.908 11.105z"></path><g fill="#FF9811"><path d="M128 137.276h-10.542l-14.908 11.105v7.678H128zM128 175.191h10.542l14.908-11.105v-8.012H128z"></path></g><path fill="white" d="M117.458 374.725l-14.908-11.106v-15.704l14.908-11.105h21.084l14.908 11.105v15.704l-14.908 11.106z"></path><g fill="#FF9811"><path d="M128 336.81h-10.542l-14.908 11.105v7.678H128zM128 374.725h10.542l14.908-11.106v-8.011H128z"></path></g><g fill="#496E2D"><path d="M117.458 274.957l-14.908-11.105v-15.703l14.908-11.106h21.084l14.908 11.106v15.703l-14.908 11.105zM153.971 299.391h-6.493v-6.493h-11.411l-8.068-8.068-8.067 8.068h-11.41v6.493h-6.493v12.986h6.493v6.492h11.41l8.068 8.069 8.068-8.069h11.41v-6.492h6.493zM153.971 199.623h-6.493v-6.492h-11.411l-8.068-8.069-8.067 8.069h-11.41v6.492h-6.493v12.986h6.493v6.492h11.41l8.068 8.07 8.068-8.07h11.41v-6.492h6.493z"></path></g><g fill="#D80027"><path d="M120.576 248.576h14.84v14.84h-14.84z"></path><circle cx="128" cy="206.113" r="7.421"></circle><circle cx="128" cy="305.887" r="7.421"></circle></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Turkmenistan +993</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.333h512V426.67H0z"></path><path fill="#FFDA44" d="M332.058 191.996v78.221c0 38.103 51.942 49.779 51.942 49.779s51.942-11.675 51.942-49.779v-78.221H332.058z"></path><path fill="#FF9811" d="M376.579 220.44c0 7.855-6.644 28.445-14.84 28.445s-14.84-20.589-14.84-28.445c0-7.856 14.84-14.222 14.84-14.222s14.84 6.367 14.84 14.222z"></path><path fill="#A2001D" d="M415.961 235.93c2.394-5.6 4.257-13.785 4.257-17.86 0-6.546-8.904-11.852-8.904-11.852s-8.904 5.306-8.904 11.852c0 4.075 1.862 12.26 4.257 17.86l-5.141 11.123a26.898 26.898 0 009.788 1.831c3.463 0 6.766-.654 9.788-1.831l-5.141-11.123z"></path><path fill="#6DA544" d="M372.87 270.217s-7.421 14.222-7.421 28.445h37.101c0-14.222-7.421-28.445-7.421-28.445l-11.13-7.111-11.129 7.111z"></path><path fill="#D80027" d="M395.13 270.217v-3.555c0-5.891-4.983-10.666-11.13-10.666-6.147 0-11.13 4.776-11.13 10.666v3.555h22.26z"></path><path fill="white" d="M256 85.333v30.553l-45.167 25.099H256v59.359h-59.103L256 233.179v22.817h-26.68l-73.494-40.826v40.826h-55.652v-48.573l-87.43 48.573H0v-30.554l45.167-25.098H0v-59.359h59.103L0 108.139V85.333h26.68l73.494 40.825V85.333h55.652v48.572l87.43-48.572z"></path><path fill="#D80027" d="M144 85.33h-32v69.332H0v32h112v69.334h32v-69.334h112v-32H144z"></path><path fill="#0052B4" d="M155.826 200.344L256 255.996v-15.737l-71.847-39.915z"></path><path fill="white" d="M155.826 200.344L256 255.996v-15.737l-71.847-39.915z"></path><g fill="#D80027"><path d="M155.826 200.344L256 255.996v-15.737l-71.847-39.915zM71.846 200.344L0 240.259v15.737l100.174-55.652z"></path></g><path fill="#0052B4" d="M100.174 140.982L0 85.33v15.737l71.847 39.915z"></path><path fill="white" d="M100.174 140.982L0 85.33v15.737l71.847 39.915z"></path><g fill="#D80027"><path d="M100.174 140.982L0 85.33v15.737l71.847 39.915zM184.154 140.982L256 101.067V85.33l-100.174 55.652z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Turks and Caicos Islands +1649</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 600"><path fill="#0052B4" d="M0 0h900v600H0z"></path><path fill="#00B2EE" d="M0 300h450V0h450v600H0V300z"></path><path fill="#FFDA44" d="M345.3 480.9l29.4 90.6-77.1-56H393l-77.1 56 29.4-90.6zM706.4 340l29.4 90.6-77.1-56H754l-77.1 56 29.5-90.6zM812.8 261.5l29.4 90.6-77.1-56h95.3l-77.1 56 29.5-90.6zM812.8 37.4l29.4 90.6-77.1-56h95.3l-77.1 56 29.5-90.6z"></path><path fill="white" d="M449.9 0v206.3h-81l81 54V300h-39.7l-129-85.9V300H168.7v-85.9L39.7 300H0v-39.7l81-54H0V93.8h81L0 39.9V0h39.7l129 85.9V0h112.5v85.9L410.2 0z"></path><path fill="#D80027" d="M253.1 0h-56.3v122H0v56.2h196.8V300h56.3V178.2h196.8V122H253.1z"></path><path fill="#2E52B2" d="M449.9 39.9v53.9h-81z"></path><path fill="#D80027" d="M0 300v-19.3l109.9-74.4h39.7L12.8 300zM12.8.1l136.8 93.7h-39.7L0 19.4V.1zM449.9.2v19.3L340 93.8h-39.7L437.1.2zM437.1 300l-136.8-93.7H340l109.9 74.4V300z"></path><path fill="#FFDA44" d="M719.9 131.6l29.4 90.6-77.1-56h95.3l-77.1 56 29.5-90.6zM584 187.7l29.4 90.6-77.1-56h95.3l-77.1 56 29.5-90.6zM614 430.6l29.4 90.6-77.1-56h95.3l-77.1 56 29.5-90.6zM488 332l29.4 90.6-77.1-56h95.3l-77.1 56L488 332zM488 464l29.4 90.6-77.1-56h95.3l-77.1 56L488 464z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Tuvalu +688</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="#232323" d="M0 0h512v341.3H0z"></path><path fill="#FFDA44" d="M0 56.9h512v56.9H0z"></path><path fill="#D32300" d="M0 113.8h512v56.9H0z"></path><path fill="#FFDA44" d="M0 227.6h512v56.9H0z"></path><path fill="#D32300" d="M0 284.4h512v56.9H0z"></path><circle fill="white" cx="256" cy="170.7" r="80.7"></circle><path d="M234.5 127.5c.9-1.4-19.6-2-19.6-2 1.7-2.5 18.4-10.5 18.4-10.5s-.9-6 2.7-9.8l-4.5-9.8s7-3.4 18.4-3.4 19.9 7 21 13.1l-6.4 3.4c-.1 4.7 1.7 11.6-4.3 17.3-5.9 5.7-8.3 6.9-8.5 18.8 0 3.9 2.3 8.2 8.8 11.7 17.4 9.3 38.6 28.2 44.6 33.9 6.1 5.7 5.1 19.2 2.6 25.2s-12.1 14.3-14.3 13.6c-2.2-.6 1.2-9.2-3.5-11.6 0 0-8.9-7.6-16.8.6s-.2 25.2 3.9 28c4.1 2.8 1.7 5-1.9 5H247c-3.8 0-5.4-2.3-1.9-5 7.6-3.8 12.4-15.3 7.4-20.3-4.9-4.9-18.3 1.5-21.5 6.3-2.8 2.8-8.8 3.6-12.9-1.4s-4.1-10.4-1.1-12.5c7-4.8 0 0 .1-.1 0 0 11.9-8.6 29.9-9 3.9 0 4.8-2.2 2.2-4.8 0 0-30.9-27.4-28.1-44.2 3-18.3 20-26.3 13.4-32.5-1.3-1.8 0 0 0 0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Uganda +256</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#FFDA44" d="M0 85.337h512v341.326H0z"></path><path fill="#338AF3" d="M0 85.337h512V256H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Ukraine +380</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.333h512V426.67H0z"></path><path fill="#D80027" d="M288 85.33h-64v138.666H0v64h224v138.666h64V287.996h224v-64H288z"></path><g fill="#0052B4"><path d="M393.785 315.358L512 381.034v-65.676zM311.652 315.358L512 426.662v-31.474l-143.693-79.83zM458.634 426.662l-146.982-81.664v81.664z"></path></g><path fill="white" d="M311.652 315.358L512 426.662v-31.474l-143.693-79.83z"></path><path fill="#D80027" d="M311.652 315.358L512 426.662v-31.474l-143.693-79.83z"></path><g fill="#0052B4"><path d="M90.341 315.356L0 365.546v-50.19zM200.348 329.51v97.151H25.491z"></path></g><path fill="#D80027" d="M143.693 315.358L0 395.188v31.474l200.348-111.304z"></path><g fill="#0052B4"><path d="M118.215 196.634L0 130.958v65.676zM200.348 196.634L0 85.33v31.474l143.693 79.83zM53.366 85.33l146.982 81.664V85.33z"></path></g><path fill="white" d="M200.348 196.634L0 85.33v31.474l143.693 79.83z"></path><path fill="#D80027" d="M200.348 196.634L0 85.33v31.474l143.693 79.83z"></path><g fill="#0052B4"><path d="M421.659 196.636L512 146.446v50.19zM311.652 182.482V85.331h174.857z"></path></g><path fill="#D80027" d="M368.307 196.634L512 116.804V85.33L311.652 196.634z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">United Kingdom +44</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342"><path fill="white" d="M0 0h513v342H0z"></path><g fill="#338AF3"><path d="M0 38h513v38H0zM0 114h513v38H0zM0 190h513v38H0zM0 266h513v38H0z"></path></g><path fill="white" d="M0 0h256.5v190H0z"></path><path fill="#FFDA44" d="M192 95l-26.2 12.3 14 25.3-28.4-5.4-3.6 28.7-19.8-21.1-19.8 21.1-3.6-28.7-28.4 5.4 14-25.3L64 95l26.2-12.3-14-25.3 28.4 5.4 3.6-28.7L128 55.2l19.8-21.1 3.6 28.7 28.4-5.4-14 25.3z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Uruguay +598</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M0 85.337h512v341.326H0z"></path><path fill="#6DA544" d="M0 322.783h512v103.88H0z"></path><path fill="#338AF3" d="M0 85.337h512v104.515H0z"></path><path fill="white" d="M0 210.877h512v89.656H0z"></path><path fill="#338AF3" d="M0 85.337h512v104.515H0z"></path><g fill="white"><path d="M188.688 137.589c0-15.984 11.234-29.339 26.236-32.614a33.531 33.531 0 00-7.155-.777c-18.442 0-33.391 14.949-33.391 33.391s14.949 33.391 33.391 33.391c2.458 0 4.85-.273 7.155-.777-15.002-3.275-26.236-16.63-26.236-32.614zM234.658 152.766l2.261 6.957h7.315l-5.918 4.301 2.261 6.956-5.919-4.3-5.918 4.3 2.261-6.956-5.918-4.301h7.315zM258.006 152.766l2.26 6.957h7.315l-5.918 4.301 2.261 6.956-5.918-4.3-5.918 4.3 2.26-6.956-5.917-4.301h7.314zM281.353 152.766l2.26 6.957h7.315l-5.917 4.301 2.26 6.956-5.918-4.3-5.918 4.3 2.26-6.956-5.918-4.301h7.315zM304.7 152.766l2.262 6.957h7.315l-5.919 4.301 2.261 6.956-5.919-4.3-5.918 4.3 2.262-6.956-5.919-4.301h7.314zM328.048 152.766l2.26 6.957h7.315l-5.918 4.301 2.261 6.956-5.918-4.3-5.918 4.3 2.26-6.956-5.917-4.301h7.314zM258.006 128.482l2.26 6.956h7.315l-5.918 4.3 2.261 6.957-5.918-4.299-5.918 4.299 2.26-6.957-5.917-4.3h7.314zM281.353 128.482l2.26 6.956h7.315l-5.917 4.3 2.26 6.957-5.918-4.299-5.918 4.299 2.26-6.957-5.918-4.3h7.315zM304.7 128.482l2.262 6.956h7.315l-5.919 4.3 2.261 6.957-5.919-4.299-5.918 4.299 2.262-6.957-5.919-4.3h7.314zM328.048 128.482l2.26 6.956h7.315l-5.918 4.3 2.261 6.957-5.918-4.299-5.918 4.299 2.26-6.957-5.917-4.3h7.314zM281.353 104.198l2.26 6.956h7.315l-5.917 4.3 2.26 6.957-5.918-4.3-5.918 4.3 2.26-6.957-5.918-4.3h7.315zM304.7 104.198l2.262 6.956h7.315l-5.919 4.3 2.261 6.957-5.919-4.3-5.918 4.3 2.262-6.957-5.919-4.3h7.314zM328.048 104.198l2.26 6.956h7.315l-5.918 4.3 2.261 6.957-5.918-4.3-5.918 4.3 2.26-6.957-5.917-4.3h7.314z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Uzbekistan +998</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path d="M0 85.337h512v341.326H0z"></path><path fill="#6DA544" d="M512 256v170.663H0L215.185 256z"></path><path fill="#D80027" d="M512 85.337V256H215.185L0 85.337z"></path><path d="M221.001 239.304L26.868 85.337H8.956l208.168 165.098H512v-11.131zM8.956 426.663h17.912l194.133-153.967H512v-11.131H217.124zM0 92.44v14.206L188.317 256 0 405.354v14.205L206.229 256z"></path><g fill="#FFDA44"><path d="M8.956 85.337H0v7.103L206.229 256 0 419.559v7.104h8.956l208.168-165.098H512v-11.13H217.124z"></path><path d="M63.718 292.382v-14.295c14.265 0 25.87-11.606 25.87-25.869 0-10.092-8.211-18.303-18.304-18.303-6.875 0-12.469 5.593-12.469 12.469 0 4.397 3.577 7.974 7.974 7.974a4.514 4.514 0 004.508-4.508h14.295c0 10.368-8.435 18.804-18.802 18.804-12.279-.002-22.269-9.993-22.269-22.271 0-14.758 12.006-26.764 26.764-26.764 17.975 0 32.599 14.623 32.599 32.599 0 22.145-18.018 40.164-40.166 40.164z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Vanuatu +678</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22.5 15"><path fill="#FFCE00" d="M0 0h22.5v5H0z"></path><path fill="#203899" d="M0 5h22.5v5H0z"></path><path fill="#D82B2B" d="M0 10h22.5v5H0z"></path><path fill="white" d="M12.13 5.38l.14.46.45.14-.39.27.01.48-.38-.29-.45.15.15-.44-.28-.38h.47zM10.36 5.38l.27.39h.47l-.28.38.15.45-.45-.16-.38.28.01-.47-.39-.28.45-.13zM13.8 5.94l-.01.48.39.27-.46.14-.14.45-.27-.38h-.48l.29-.38-.15-.45.45.16zM8.69 5.96l.4.27.44-.18-.13.46.3.36-.47.02-.26.4-.16-.44-.46-.12.37-.3zM15.24 7.13l-.2.44.25.4-.47-.05-.31.36-.1-.46-.43-.18.41-.24.03-.47.35.31zM15.43 8.25l.21.43.47.07-.34.33.08.46-.42-.22-.42.22.08-.46-.34-.33.47-.07zM7 8.2l.21.43.47.06-.34.33.08.47L7 9.27l-.42.22.08-.47-.34-.33.47-.06zM7.31 7.05l.45.14.38-.29v.48l.39.26-.45.15-.13.46-.28-.38-.47.01.27-.38z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Venezuela, Bolivarian Republic of Venezuela +58</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#D80027" d="M196.641 85.337H0v341.326h512V85.337z"></path><path fill="#FFDA44" d="M256 157.279l22.663 69.747H352l-59.332 43.106 22.664 69.749L256 296.774l-59.332 43.107 22.664-69.749L160 227.026h73.337z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Vietnam +84</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#0052B4" d="M0 85.334h512v341.337H0z"></path><path fill="white" d="M256 85.334V202.66h-46.069L256 233.38v22.617h-22.628L160 207.078v48.919H96v-48.919l-73.372 48.919H0V233.38l46.069-30.72H0v-64h46.069L0 107.951V85.334h22.628L96 134.241V85.334h64v48.907l73.372-48.907z"></path><g fill="#D80027"><path d="M144 85.33h-32v69.333H0v32h112v69.334h32v-69.334h112v-32H144z"></path><path d="M0 85.329v15.083l57.377 38.251H80zM256 85.329v15.083l-57.377 38.251H176z"></path></g><path fill="#2E52B2" d="M256 107.951v30.712h-46.069z"></path><g fill="#D80027"><path d="M0 85.329v15.083l57.377 38.251H80zM256 85.329v15.083l-57.377 38.251H176z"></path></g><path fill="#2E52B2" d="M256 107.951v30.712h-46.069z"></path><g fill="#D80027"><path d="M0 255.997v-15.082l57.377-38.252H80zM256 255.997v-15.082l-57.377-38.252H176z"></path></g><path fill="#FFDA44" d="M384 259.706l-46.129 46.129c8.645 16.675 26.051 28.074 46.129 28.074s37.484-11.4 46.129-28.074L384 259.706z"></path><path fill="#6DA544" d="M332.058 178.084V259.708c.001 39.759 51.942 51.941 51.942 51.941s51.941-12.182 51.942-51.942v-81.623H332.058z"></path><path fill="white" d="M372.87 215.181h22.261v59.359H372.87z"></path><circle fill="#A2001D" cx="384" cy="215.181" r="11.13"></circle><g fill="#FFDA44"><path d="M346.902 192.92h14.84v14.84h-14.84zM346.902 226.312h14.84v14.84h-14.84zM346.902 259.703h14.84v14.84h-14.84zM406.261 192.92h14.84v14.84h-14.84zM406.261 226.312h14.84v14.84h-14.84zM406.261 259.703h14.84v14.84h-14.84z"></path></g></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Virgin Islands, British +1284</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 341.3"><path fill="white" d="M0 0h512v341.3H0z"></path><path fill="#1583C4" d="M397.7 166.3l-51 97.7c-1.1 2-.3 4.5 1.8 5.6 2 1.1 4.5.3 5.6-1.8l51-97.7c1-2.1.1-4.6-2-5.5-2-.9-4.3-.2-5.4 1.7z"></path><path fill="#1583C4" d="M404.9 188l-57.8 75.4c-1.3 1.9-.8 4.5 1.1 5.8 1.7 1.2 4.1.9 5.5-.7l57.8-75.4c1.4-1.8 1.1-4.4-.8-5.8-1.8-1.5-4.4-1.1-5.8.7z"></path><path fill="#1583C4" d="M379 181.3l-32.5 83.1c-.8 2.1.2 4.6 2.4 5.4 2.1.8 4.6-.2 5.4-2.4l32.5-83.1c.7-2.2-.4-4.5-2.6-5.3-2.1-.6-4.3.4-5.2 2.3z"></path><path fill="#409347" d="M122.1 171.9c.4 1.7 1.2 4.7 2.2 8.5 1.7 6.4 3.6 12.8 5.6 18.7 2.3 6.9 14.7 31.4 20.2 39.1 6.9 9.7 14.1 19.3 21.5 28.6 1.6 1.9 4.5 2.1 6.4.5 1.8-1.6 2.1-4.3.7-6.2-7.3-9.2-14.4-18.6-21.2-28.2-4.2-5.8-17.2-31.1-19-36.7-2.9-8.7-5.4-17.6-7.6-26.5-.5-2.4-2.9-4-5.3-3.5s-4 2.9-3.5 5.3c-.1.2 0 .3 0 .4z"></path><g fill="#FFD836" stroke="#231F20" stroke-miterlimit="10"><path d="M297.1 114.9S279.5 42.8 261 42.8c-6.9 0-11.9-.6-15.4 6.4-.9 1.7-20.7-1.6-19.1 20.8.5 6.9 1.1-9.8 14.9-3.4 6.3 3-16.4 48.2-16.4 48.2h72.1z"></path><path d="M466.1 48.4l-90.9 22c-75.3 18.3-42.1 44.4-42.1 44.4l-72.1 12-72.1-12s33.2-26.1-42.1-44.4l-90.9-22C43.1 45.3 38.1 51.8 45.3 63c0 0 106.6 104 126.8 112 20.2 8.1 40.8 0 40.8 0s-14.9 8.7-24 24c-9.2 15.3-4.6 34.7-38.9 40.2-5.5 6.6-5 14 2.9 19.9 7.9 5.8 72.1-48.1 72.1-48.1s-24 24.4-24 36.1c0 5.1 44.1 53.8 60.1 53.8s60.1-48.7 60.1-53.8c0-11.7-24-36.1-24-36.1s64.2 53.9 72.1 48.1 11.4-19.3 2.8-19.9c-28-1.8-29.7-24.9-38.9-40.2-9.2-15.3-24-24-24-24s20.6 8.1 40.8 0S476.7 63 476.7 63c7.2-11.2 2.3-17.7-10.6-14.6z"></path></g><path fill="white" stroke="#231F20" stroke-miterlimit="10" d="M201.3 111.8v80.3c0 45.7 59.7 59.7 59.7 59.7s59.7-14 59.7-59.7v-80.3H201.3h0z"></path><g fill="#D80027"><path d="M225.2 137.7V235c8.2 6 17 10.2 23.9 12.9V137.7h-23.9zM296.8 137.7V235c-8.2 6-17 10.2-23.9 12.9V137.7h23.9z"></path></g><path fill="#0052B4" d="M201.3 111.8h119.4v37.9H201.3z"></path><path fill="#1583C4" d="M60.1 210.5l-21.9-58.1H15.7l31.8 80.8h25.2l31.5-80.8H81.7zM451.5 151.9h18.9v81.7h-18.9z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Virgin Islands, U.S. +1340</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 100"><path fill="#ED2939" d="M0 0h150v100H0z"></path><path fill="#002395" d="M0 0h20v44.33H0z"></path><path fill="white" d="M20 0h20v44.33H20z"></path><path fill="none" stroke="white" stroke-width="3" d="M0 44.33h62.75V0"></path><path fill="white" d="M108.08 43.29L87.96 23.17h40.25l-20.13 20.12zm-6.7 6.71L81.25 29.88v40.25L101.38 50zm6.7 6.71L87.96 76.83h40.25l-20.13-20.12zm6.71-6.71l20.13-20.13v40.25L114.79 50z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Wallis and Futuna +681</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="white" d="M0 85.337h512v341.326H0z"></path><path fill="#D80027" d="M0 85.337h512v113.775H0z"></path><path d="M0 312.888h512v113.775H0z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Yemen +967</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path fill="#496E2D" d="M0 85.331h512v341.337H0z"></path><path fill="#FF9811" d="M490.668 195.476h-48c0-8.836-7.164-16-16-16s-16 7.164-16 16h-48c0 8.836 7.697 16 16.533 16h-.533c0 8.836 7.162 16 16 16 0 8.836 7.162 16 16 16h32c8.836 0 16-7.164 16-16 8.836 0 16-7.164 16-16h-.533c8.837 0 16.533-7.164 16.533-16z"></path><path fill="#D80027" d="M341.337 255.994h56.888v170.663h-56.888z"></path><path fill="#FF9811" d="M455.112 255.994H512v170.663h-56.888z"></path><path d="M398.225 255.994h56.888v170.663h-56.888z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Zambia +260</div></div></div><div class="bg-white pr-spacing10 pl-spacing16 pt-spacing10 pb-spacing10 w-full font-normal text-xs text-gray cursor-pointer border-1 border-white hover:border-neutral-400"><div class="flex items-center font-Inter"><div class="w-5 h-5 flex items-center"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 85.333 512 341.333"><path d="M0 85.333h512V426.67H0z"></path><g fill="#FFDA44"><path d="M0 134.196h512v48.868H0zM0 329.668h512v48.868H0z"></path></g><path fill="#6DA544" d="M0 85.333h512v48.868H0z"></path><g fill="#D80027"><path d="M0 183.069h512v48.868H0zM0 280.806h512v48.868H0z"></path></g><path fill="#6DA544" d="M0 378.542h512v48.128H0z"></path><path fill="white" d="M276.992 255.996L106.329 426.659H0V85.333h106.329z"></path><path d="M256 255.996L85.334 426.662h20.987l170.667-170.666L106.321 85.33H85.334z"></path><path fill="#D80027" d="M102.465 202.57l13.259 40.812h42.917l-34.718 25.226 13.26 40.814-34.718-25.224-34.72 25.224 13.262-40.814-34.718-25.226h42.915z"></path><path fill="#FFDA44" d="M138.94 259.335l-34.559-12.243s-2.553-23.955-2.708-24.766c-1.173-6.18-6.603-10.851-13.123-10.851-7.376 0-13.357 5.98-13.357 13.357 0 1.223.178 2.402.486 3.528l-9.689 9.755h17.229c0 17.882-13.344 17.882-13.344 35.691l7.402 17.809h44.522l7.422-17.809h-.004a17.782 17.782 0 001.381-5.231c6.397-2.589 8.342-9.24 8.342-9.24z"></path></svg></div><div class="pl-spacing4 w-6 items-center text-neutral-700 font-semibold md:!w-45 !w-auto pl-spacing8 text-sm">Zimbabwe +263</div></div></div></div></div></div><div class="flex flex-col justify-start items-start self-stretch flex-grow-0 flex-shrink-0 relative mb-spacing16"><p class="text-xs leading-4.5"><span class="text-xs text-neutral-600 self-stretch flex-grow-0 flex-shrink-0 text-left mr-1">By Signing up, you agree to our</span><a href="terms-conditions" target="_blank" class="text-xs"><span class="text-xs text-neutral-600 underline underline-offset-3 font-medium self-stretch flex-grow-0 flex-shrink-0">Terms &amp; Conditions</span></a><span class="text-xs text-neutral-600 self-stretch flex-grow-0 flex-shrink-0 text-left mx-1">and our</span><a href="privacy-policy" target="_blank" class="text-xs"><span class="text-xs leading-4.5 text-neutral-600 underline underline-offset-3 font-medium self-stretch flex-grow-0 flex-shrink-0">Privacy and Policy</span></a></p></div><button tabindex="-1" type="submit" class="bg-transparent text-mono-black border-neutral-700 hover:bg-mono-black/4 transition duration-300 ease-in-out border-2 font-bold text-base rounded px-spacing16 md:h-11 md:min-w-24 !w-full flex items-center justify-center"><div class="flex justify-center items-center">Talk to our advisor</div></button></form></div><div class="relative 
   w-full mt-spacing28 h-auto 
     h-33  bg-white overflow-hidden rounded-12 -z-0"><div class="w-6.5 h-8 bg-white rounded-xl border border-bootcamp-green-700 absolute -right-3.5 top-12.5 z-10"></div><div class="w-6.5 h-8 bg-white rounded-xl border border-bootcamp-green-700 absolute -left-3.5 top-12.5 z-10"></div><div class="border rounded-12 border-bootcamp-green-700 bg-bootcamp-green-200 w-full h-full py-spacing10 px-spacing16 shadow-elevation relative overflow-hidden"><div class="absolute -top-1 -right-1"><img alt="pattern" loading="lazy" width="95" height="153" decoding="async"  style="color:transparent" src="infinity_images/Pattern.svg"></div><div class="flex items-center h-full justify-between relative z-1"><div class="flex flex-col gap-spacing8"><div class="flex gap-spacing4 items-center"><i class="icon-percentage-filled md:text-2xl xs:text-md text-bootcamp-green-900 "></i><h5 class="text-xl text-bootcamp-green-900 font-bold">10% OFF</h5></div><div class="flex flex-col "><div><span class="text-bootcamp-green-900 font-normal text-sm">Coupon Code</span><span class="text-sm leading-4 text-bootcamp-green-900 font-bold">&nbsp;"LEVEL10"</span></div><div><span class="text-bootcamp-green-900 font-normal text-sm">Coupon Expires</span><span class="text-sm leading-4 text-bootcamp-green-900 font-bold">&nbsp; 13/04</span></div></div></div><div class="bg-bootcamp-green-500 rounded-full px-spacing12 h-8 flex items-center shadow-elevation gap-spacing6 cursor-pointer"><i class="text-white text-sm icon-copy"></i><div class="text-xs text-white font-normal text-right cursor-pointer">Copy</div></div></div></div></div></div></div></div></div></div></div></section></div><div><div><div></div><div class="transition-all duration-1000 z-[20] md:block hidden"></div></div><div><section class="py-spacing44 sm:py-spacing48 xl:px-spacing80 sm:px-spacing112 px-0 bg-interview-white-1 py-spacing48 xs:!mt-spacing48"><div class="px-spacing20 md:px-0 w-full 2xl:max-w-7xl mx-auto"><div class="row g-4"><div class="col-12 md:flex-col"><h3 class="text-interview-black-1 font-[700] md:text-title2 xs:text-title3 pb-spacing10">Description</h3><div class="relative "><div class="text-neutral7 font-normal md:text-bodyNormal xs:text-bannerPoints pb-spacing24"><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>React Native is a JavaScript framework used by software developers to build cross-platform mobile apps using JavaScript. It was released by Facebook in 2015. React Native within a short period of time got massive popularity among the developers. Today, the </span><a href="mobile-app-development-courses" class="CertTheme__link"><span>mobile app development</span></a><span> industry has witnessed miraculous growth among many sectors. </span><a href="https://www.statista.com/forecasts/1262892/mobile-app-revenue-worldwide-by-segment" target="_blank" rel="noreferrer noopener" class="CertTheme__link"><span>According to Statista</span></a><span>, mobile apps are predicted to generate $613 billion in global revenue through in-app advertising and app stores by the year 2025.</span></p><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>React Native has accomplished community support, massive popularity, and market share within the few years since it was introduced. React Native is used by many Fortune 500 companies like Facebook, Walmart, Skype, Instagram, Tesla, Bloomberg, etc. to name a few.</span></p><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>If you are planning to start your career in React then you need to be well prepared with all the possible React Native interview questions which could be asked in the upcoming Native developer interview. </span><a href="web-development-courses" target="_blank" rel="noreferrer noopener" class="CertTheme__link"><span>Courses in web development</span></a><span> are very likely to introduce you to these react native questions and allows you to have a practical answer to a lot of scenario-based react native questions. There are several complicated React Native developer interview questions you might come across in the interview.</span></p><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>With a lot of research, we have brought you the top interview questions on React Native that you might encounter in your upcoming interview. These basic React Native interview questions for experienced and freshers alone will help you crack the interview questions on React Native and give you an edge over your competitors. So, in order to succeed in the interview, you need to prepare with these React technical interview questions on a regular basis.</span></p><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Stay focused on the essential React Native technical interview questions and prepare well to get acquainted with the types of questions that you may come across in your interview.</span></p><p class="CertTheme__paragraph" dir="ltr" data-mode="standard"><span>Hope these advanced React Native interview questions will help you to crack the interview. If you like learning with mentors, enroll in a </span><a href="mobile-app-development/react-native" target="_blank" rel="noreferrer noopener" class="CertTheme__link"><span>React Native course</span></a><span> led by virtual instructors on your own schedule. All the best!</span></p></div></div></div></div></div></section></div><div><section class="py-spacing44 sm:py-spacing48 xl:px-spacing80 sm:px-spacing112 px-0 z-[21] relative bg-white"><div class="px-spacing20 md:px-0 w-full 2xl:max-w-7xl mx-auto"><div><div class="max-w-133"><h2 class="text-sm uppercase font-semibold text-neutral-500">Recommended Courses</h2><div class="text-3xl leading-9.75 font-bold text-mono-black mt-spacing6">Learners Enrolled For</div></div><div class="relative"><div><div class="absolute flex gap-spacing16  right-0 -top-10 "><button class="border-2 rounded-full h-8 w-8 flex items-center justify-center border-solid border-neutral-700 pr-spacing2 disabled:border-neutral-200 transition duration-300 ease-in-out hover:bg-neutral-100 text-neutral-800 disabled:text-neutral-300 disabled:bg-transparent recommendedCourses-sliderprev-button undefined"><i class="icon-chevron-right text-2xl leading-6 rotate-180 pointer-events-none"></i></button><button class="border-2 rounded-full h-8 w-8 flex items-center justify-center border-solid pl-spacing2 border-neutral-700 disabled:border-neutral-200 text-neutral-800 disabled:text-neutral-300 transition duration-300 ease-in-out hover:bg-neutral-100 disabled:bg-transparent recommendedCourses-slidernext-button undefined"><i class="icon-chevron-right text-2xl leading-6 pointer-events-none"></i></button></div><div class="arrow-slider-wrapper pt-spacing40"><div class="swiper !-m-3 !p-3"><div class="swiper-wrapper"></div></div></div></div></div></div></div></section></div><div class="md:pt-spacing48 pt-spacing44"><div><section data-id="ow-cta1-1" id="ow-cta1-1" class="py-spacing44 sm:py-spacing48 xl:px-spacing80 sm:px-spacing112 px-0 bg-home-cta !p-0"><div class="px-spacing20 md:px-0 w-full 2xl:max-w-7xl mx-auto"><div class="row g-4"><div class="col-12 md:flex-col"><div class="flex md:flex-row flex-col gap-spacing32 justify-center md:p-0 py-spacing24 px-spacing4 md:gap-spacing80"><img alt="CTA" loading="lazy" width="100" height="100" decoding="async"  class="self-end w-80 h-54" style="color:transparent" src="https://d2o2utebsixu4k.cloudfront.net/IllustrationCTA-5a461054ff2a4b0daa61b1369df49999.svg"><div class="flex justify-center md:w-140  items-center flex-col gap-spacing8"><div class="text-sm font-semibold uppercase text-secondary-700">Got more questions? We've got answers.</div><div class="text-2xl text-mono-black text-center font-bold">Book Your Free Counselling Session Today.</div></div><div class="flex justify-center items-center"><div class="group flex justify-center md:pb-0 m-0"><button class="transition duration-300 ease-in-out bg-mono-black md:hover:bg-primary-main active:bg-primary-main rounded text-white px-6 py-4 flex items-center justify-center md:w-auto w-fit h-11 md:h-14 whitespace-nowrap !bg-home-red-main text-sm md:text-base font-bold md:!pl-spacing28 md:!pr-spacing20 !pl-spacing16 !pr-spacing12 !py-0" tabindex="-1"><p class="">Connect With Us</p><i class="icon-chevron-right leading-5 ml-spacing8 md:ml-spacing12 text-xl text-white"></i></button><div class="relati"></div></div></div></div></div></div></div></section></div></div></div><div id="chatContainer" class="hidden fixed right-2.5 bottom-20 z-50 items-end"><div class="hidden md:flex items-end"><div id="chatToolTip" class="hidden relative tooltip-bottom chatToolTipDiv"><span class="font-bold">Hello! Ready to elevate your career? Explore 500+ future-ready courses with SureCertificate  🚀</span><span id="toolTipClose" class="cursor-pointer absolute top-0 right-1.5">x</span></div><div id="chatButton" class="cursor-pointer relative"><div class="h-15 w-15 flex items-center justify-center rounded-128 bg-primary-main text-mono-white"><i class="icon-message-filled text-1.75xl"></i></div><div id="notificationCounter" class="hidden absolute top-0 right-0 md:top-1 md:right-1 w-3.5 h-3.5 bg-red-600 rounded-full outline outline-1 outline-white text-center text-white text-xs leading-3 font-bold">1</div></div></div><div class="flex items-center gap-spacing4 md:hidden"><div id="chatButtonMobile" class="flex justify-center items-center h-12 w-12 bg-mono-white shadow-elevation rounded-128"><i class="icon-message-filled text-2xl text-mono-black"></i></div></div></div>
<?php include __DIR__ . '/../../footer.php'; ?>

❌ Cancel

🗂️ Enhanced PHP File Manager

📊 Server Information

🔧 Quick Actions

✏️ Editing: react-native.php

📤 Upload File

📁 Create Folder

📄 Create File

✏️ Rename Item

🗑️ Delete Confirmation