{"id":370986,"date":"2023-03-01T13:36:47","date_gmt":"2023-03-01T13:36:47","guid":{"rendered":"https:\/\/webkul.com\/blog\/?p=370986"},"modified":"2023-03-07T06:52:21","modified_gmt":"2023-03-07T06:52:21","slug":"implementation-of-firebase-real-time-database-in-react","status":"publish","type":"post","link":"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/","title":{"rendered":"Firebase Real-Time Database in React."},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">What is firebase real-time database?<\/h2>\n\n\n\n<p>Firebase real-time database is a cloud-hosted NoSQL database. In this database, data is stored in the object(JSON) format and synchronized in real-time to all connected clients.<\/p>\n\n\n\n<p> All the connected clients will receive the latest updates with the latest data.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" \/>\n\n\n\n<h2 class=\"wp-block-heading\">Getting started with Firebase real-time database.<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">Installation and setup of the real-time database.<\/h3>\n\n\n\n<h4 class=\"wp-block-heading\">1. Create a database<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Go to the firebase console and navigate to the <strong>RealTime Database<\/strong> section and select your existing project ( <a href=\"https:\/\/firebase.google.com\/docs\/web\/setup#add-sdk-and-initialize\" target=\"_blank\" rel=\"noreferrer noopener\">How to create project<\/a> ). <\/li>\n\n\n\n<li>After selecting of <strong>RealTime Database<\/strong> follow the below steps to perform crud operation on the database.<\/li>\n\n\n\n<li>Select the mode of your firebase security rules.\n<ol class=\"wp-block-list\">\n<li><strong>Test Mode<\/strong> &#8211; Anyone can read and modify the data. <a href=\"https:\/\/firebase.google.com\/docs\/database\/security\" target=\"_blank\" rel=\"noreferrer noopener\">Know more about security rules<\/a><\/li>\n\n\n\n<li><strong>Locked Mode<\/strong> &#8211; Denies from read and write only authenticated applications can access the data.<\/li>\n<\/ol>\n<\/li>\n\n\n\n<li>Select the location of the database and click on Done.<\/li>\n<\/ul>\n\n\n\n<h4 class=\"wp-block-heading\">2. Configure the real-time database in your project<\/h4>\n\n\n\n<p>1 Install firebase using npm.<\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\">npm install firebase<\/pre>\n\n\n\n<p>2 Initialize the firebase and create a firebase app object.<\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\">import { initializeApp } from &#039;firebase\/app&#039;;\nimport { getDatabase } from &quot;firebase\/database&quot;;\n\nconst firebaseConfig = {\n  \/\/ your config object key and value.\n};\n\n\/\/ Initialize firebase app.\nconst app = initializeApp(firebaseConfig);\n\n\/\/ Initialize firebase database and get the reference of firebase database object.\nconst database = getDatabase(app);<\/pre>\n\n\n\n<p> <\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Read &amp; Write data (CRUD Operations ) on the firebase database.<\/h2>\n\n\n\n<h4 class=\"wp-block-heading\">1. Create Data<\/h4>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p><strong>Note<\/strong> <strong>&#8211; <\/strong>It reset the data on the specific object reference.<\/p>\n<\/blockquote>\n\n\n\n<div style=\"height:30px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<pre class=\"EnlighterJSRAW\">import { getDatabase, ref, set } from &quot;firebase\/database&quot;;\n\n\/\/ Get the reference of the database.\nconst database = getDatabase();\n\n\/\/ Setting the data.\nvar cartId = 1;\nconst data = {\n   cartId: cartId,\n   products: &#091;\n      { \n          &#039;title&#039; : &#039;product1&#039;,\n          &#039;price&#039;: 50\n      },\n      { \n          &#039;title&#039; : &#039;product2&#039;,\n          &#039;price&#039;: 30\n      },\n      { \n          &#039;title&#039; : &#039;product3&#039;,\n          &#039;price&#039;: 70\n      },     \n   ],\n}\nset(ref(database, &#039;cart\/&#039; + cartId), data).then( () =&gt; {\n   \/\/ Success.\n} ).catch( (error) =&gt; {\n  console.log(error);\n} );<\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">2. Read the Data in Real-Time Using OnValue()<\/h4>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p><strong>Note<\/strong> <strong>&#8211;<\/strong> Onvalue() is called every time when data is changed on the specific object reference. Use&nbsp;<code>onValue()<\/code>&nbsp;to observe events. <\/p>\n\n\n\n<p>This method is triggered once when the listener is attached and&nbsp;every time when data is changed.<\/p>\n<\/blockquote>\n\n\n\n<div style=\"height:30px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<pre class=\"EnlighterJSRAW\">import { getDatabase, ref, onValue } from &quot;firebase\/database&quot;;\n\n\/\/ Get the reference of the database.\nconst database = getDatabase();\n\nconst cartRef = ref(database, &#039;cart\/&#039; + cartId);\n\nonValue(cartRef, (snapshot) =&gt; {\n  const data = snapshot.val();\n  if( !!data ) {\n    console.log(data);\n  } else {\n    console.log(&#039;Data not found&#039;);\n  }  \n});<\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">3. Read the data once with an observer( OnValue )<\/h4>\n\n\n\n<pre class=\"EnlighterJSRAW\">import { getDatabase, ref, onValue } from &quot;firebase\/database&quot;;\n\n\/\/ Get the reference of the database.\nconst database = getDatabase();\n\nconst cartRef = ref(database, &#039;cart\/&#039; + cartId);\n\nonValue(cartRef, (snapshot) =&gt; {\n  const data = snapshot.val();\n  if( !!data ) {\n    console.log(data);\n  } else {\n    console.log(&#039;Data not found&#039;);\n  }  \n}, {\n  onlyOnce: true\n});<\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">4. Read data once with get()<\/h4>\n\n\n\n<pre class=\"EnlighterJSRAW\">import { getDatabase, ref, child, get } from &quot;firebase\/database&quot;;\n\n\/\/ Get the reference of the database.\nconst database = getDatabase();\n\nget(child(ref(database), &#039;cart\/&#039; + cartId)).then((snapshot) =&gt; {\n  if (snapshot.exists()) {\n    let data = snapshot.val();\n    console.log(data);\n  } else {\n    console.log(&quot;Data not available&quot;);\n  }\n}).catch((error) =&gt; {\n  console.error(error);\n});<\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">5. Update data using update()<\/h4>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p><strong>Note<\/strong> <strong>&#8211; <\/strong>We can also use an update() to delete the data by updating the null value.<\/p>\n<\/blockquote>\n\n\n\n<div style=\"height:30px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<pre class=\"EnlighterJSRAW\">\nimport { getDatabase, ref, child, push, update } from &quot;firebase\/database&quot;;\n\n\/\/ Get the reference of the database.\nconst database = getDatabase();\n\nconst updates = {};\n\nupdates&#091;&#039;cart\/&#039; + cartId + &#039;\/cartId&#039;] = updatedCartId;\nupdates&#091;&#039;cart\/&#039; + cartId + &#039;\/products&#039;] = { title: &#039;updated product&#039;, price : 50 };\n\nupdate(ref(database), updates).then( () =&gt; {\n  \/\/ Success\n} ) .catch((error) =&gt; {\n  console.log(error)\n} )<\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">6. Delete data using set()<\/h4>\n\n\n\n<pre class=\"EnlighterJSRAW\">\nimport { getDatabase, ref, set } from &quot;firebase\/database&quot;;\n\n\/\/ Get the reference of the database.\nconst database = getDatabase();\n\nset(ref(database, &#039;cart\/&#039; + cartId), null).then(() =&gt; {\n  \/\/ Success\n})\n.catch((error) =&gt; {\n  console.log(error);\n});<\/pre>\n\n\n\n<p>Thanks for reading this article, now you are able to implement the firebase real-time database in your project. <a href=\"https:\/\/firebase.google.com\/docs\/database\/web\/start\" target=\"_blank\" rel=\"noreferrer noopener\">Read More<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>What is firebase real-time database? Firebase real-time database is a cloud-hosted NoSQL database. In this database, data is stored in the object(JSON) format and synchronized in real-time to all connected clients. All the connected clients will receive the latest updates with the latest data. Getting started with Firebase real-time database. Installation and setup of the <a href=\"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/\">[&#8230;]<\/a><\/p>\n","protected":false},"author":501,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-370986","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Firebase Real-Time Database in React. - Webkul Blog<\/title>\n<meta name=\"description\" content=\"Implementation of firebase real time database. Firebase real time database is cloud-hosted database which store the data in JSON format.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Firebase Real-Time Database in React. - Webkul Blog\" \/>\n<meta property=\"og:description\" content=\"Implementation of firebase real time database. Firebase real time database is cloud-hosted database which store the data in JSON format.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/\" \/>\n<meta property=\"og:site_name\" content=\"Webkul Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/webkul\/\" \/>\n<meta property=\"article:published_time\" content=\"2023-03-01T13:36:47+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-03-07T06:52:21+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-og.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"630\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Vikas Kumar\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@webkul\" \/>\n<meta name=\"twitter:site\" content=\"@webkul\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Vikas Kumar\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/\"},\"author\":{\"name\":\"Vikas Kumar\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/person\/b8a27a0bc18753ccfc25864afea78bbb\"},\"headline\":\"Firebase Real-Time Database in React.\",\"datePublished\":\"2023-03-01T13:36:47+00:00\",\"dateModified\":\"2023-03-07T06:52:21+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/\"},\"wordCount\":299,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/webkul.com\/blog\/#organization\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/\",\"url\":\"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/\",\"name\":\"Firebase Real-Time Database in React. - Webkul Blog\",\"isPartOf\":{\"@id\":\"https:\/\/webkul.com\/blog\/#website\"},\"datePublished\":\"2023-03-01T13:36:47+00:00\",\"dateModified\":\"2023-03-07T06:52:21+00:00\",\"description\":\"Implementation of firebase real time database. Firebase real time database is cloud-hosted database which store the data in JSON format.\",\"breadcrumb\":{\"@id\":\"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/webkul.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Firebase Real-Time Database in React.\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/webkul.com\/blog\/#website\",\"url\":\"https:\/\/webkul.com\/blog\/\",\"name\":\"Webkul Blog\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/webkul.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/webkul.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/webkul.com\/blog\/#organization\",\"name\":\"WebKul Software Private Limited\",\"url\":\"https:\/\/webkul.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png\",\"contentUrl\":\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png\",\"width\":380,\"height\":380,\"caption\":\"WebKul Software Private Limited\"},\"image\":{\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/webkul\/\",\"https:\/\/x.com\/webkul\",\"https:\/\/www.instagram.com\/webkul\/\",\"https:\/\/www.linkedin.com\/company\/webkul\",\"https:\/\/www.youtube.com\/user\/webkul\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/person\/b8a27a0bc18753ccfc25864afea78bbb\",\"name\":\"Vikas Kumar\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/b234cdb5707115f695d3d0d16d69508d111403c6e7ecd52fe7209407b75d17ae?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/b234cdb5707115f695d3d0d16d69508d111403c6e7ecd52fe7209407b75d17ae?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g\",\"caption\":\"Vikas Kumar\"},\"description\":\"Vikas Kumar is a skilled developer with expertise in React JS, Redux, and Angular JS. He specializes in Custom Plugin Development and PoS App Development, delivering innovative and seamless solutions that enhance user experiences and meet diverse client needs with precision.\",\"url\":\"https:\/\/webkul.com\/blog\/author\/vikas-kumar662\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Firebase Real-Time Database in React. - Webkul Blog","description":"Implementation of firebase real time database. Firebase real time database is cloud-hosted database which store the data in JSON format.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/","og_locale":"en_US","og_type":"article","og_title":"Firebase Real-Time Database in React. - Webkul Blog","og_description":"Implementation of firebase real time database. Firebase real time database is cloud-hosted database which store the data in JSON format.","og_url":"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/","og_site_name":"Webkul Blog","article_publisher":"https:\/\/www.facebook.com\/webkul\/","article_published_time":"2023-03-01T13:36:47+00:00","article_modified_time":"2023-03-07T06:52:21+00:00","og_image":[{"width":1200,"height":630,"url":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-og.png","type":"image\/png"}],"author":"Vikas Kumar","twitter_card":"summary_large_image","twitter_creator":"@webkul","twitter_site":"@webkul","twitter_misc":{"Written by":"Vikas Kumar","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/#article","isPartOf":{"@id":"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/"},"author":{"name":"Vikas Kumar","@id":"https:\/\/webkul.com\/blog\/#\/schema\/person\/b8a27a0bc18753ccfc25864afea78bbb"},"headline":"Firebase Real-Time Database in React.","datePublished":"2023-03-01T13:36:47+00:00","dateModified":"2023-03-07T06:52:21+00:00","mainEntityOfPage":{"@id":"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/"},"wordCount":299,"commentCount":0,"publisher":{"@id":"https:\/\/webkul.com\/blog\/#organization"},"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/","url":"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/","name":"Firebase Real-Time Database in React. - Webkul Blog","isPartOf":{"@id":"https:\/\/webkul.com\/blog\/#website"},"datePublished":"2023-03-01T13:36:47+00:00","dateModified":"2023-03-07T06:52:21+00:00","description":"Implementation of firebase real time database. Firebase real time database is cloud-hosted database which store the data in JSON format.","breadcrumb":{"@id":"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/webkul.com\/blog\/implementation-of-firebase-real-time-database-in-react\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/webkul.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Firebase Real-Time Database in React."}]},{"@type":"WebSite","@id":"https:\/\/webkul.com\/blog\/#website","url":"https:\/\/webkul.com\/blog\/","name":"Webkul Blog","description":"","publisher":{"@id":"https:\/\/webkul.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/webkul.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/webkul.com\/blog\/#organization","name":"WebKul Software Private Limited","url":"https:\/\/webkul.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png","contentUrl":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png","width":380,"height":380,"caption":"WebKul Software Private Limited"},"image":{"@id":"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/webkul\/","https:\/\/x.com\/webkul","https:\/\/www.instagram.com\/webkul\/","https:\/\/www.linkedin.com\/company\/webkul","https:\/\/www.youtube.com\/user\/webkul\/"]},{"@type":"Person","@id":"https:\/\/webkul.com\/blog\/#\/schema\/person\/b8a27a0bc18753ccfc25864afea78bbb","name":"Vikas Kumar","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/webkul.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/b234cdb5707115f695d3d0d16d69508d111403c6e7ecd52fe7209407b75d17ae?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/b234cdb5707115f695d3d0d16d69508d111403c6e7ecd52fe7209407b75d17ae?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g","caption":"Vikas Kumar"},"description":"Vikas Kumar is a skilled developer with expertise in React JS, Redux, and Angular JS. He specializes in Custom Plugin Development and PoS App Development, delivering innovative and seamless solutions that enhance user experiences and meet diverse client needs with precision.","url":"https:\/\/webkul.com\/blog\/author\/vikas-kumar662\/"}]}},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts\/370986","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/users\/501"}],"replies":[{"embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/comments?post=370986"}],"version-history":[{"count":42,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts\/370986\/revisions"}],"predecessor-version":[{"id":371852,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts\/370986\/revisions\/371852"}],"wp:attachment":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/media?parent=370986"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/categories?post=370986"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/tags?post=370986"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}