{"id":19046,"date":"2017-11-01T12:14:34","date_gmt":"2017-11-01T10:14:34","guid":{"rendered":"https:\/\/www.webcodegeeks.com\/?p=19046"},"modified":"2017-11-01T10:19:22","modified_gmt":"2017-11-01T08:19:22","slug":"using-mustache-js-client-side-templating","status":"publish","type":"post","link":"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/","title":{"rendered":"Using Mustache.js for Client-Side Templating"},"content":{"rendered":"

Introduction<\/h2>\n

In this article, I will show you how to make use of Mustache.js<\/a> for client-side templating. In this approach, we get the JSON data from an API, developed by you or a 3rd party API and build the HTML required for rendering the data at the client side.<\/p>\n

We will make use of GitHub APIs to demonstrate this technique.<\/p>\n

Understanding GitHub APIs<\/h2>\n

We will use the following GitHub APIs:<\/p>\n

    \n
  1. Get user detail: this API will return the public information for a given user, for example, https:\/\/api.github.com\/users\/google<\/a><\/li>\n
  2. Get public repositories for user ordered by most stars first, for example, https:\/\/api.github.com\/search\/repositories?q=user:google&sort=stars&per_page=10<\/a><\/li>\n<\/ol>\n

    Setting up the Javascript and CSS Dependencies<\/h2>\n

    We will make use of the following CSS and Javascript dependencies:<\/p>\n

      \n
    1. Bootstrap based simple theme\u00a0https:\/\/bootswatch.com\/default\/<\/li>\n
    2. Font Awesome icons\u00a0http:\/\/fontawesome.io\/<\/li>\n
    3. jQuery\u00a0https:\/\/jquery.com<\/li>\n
    4. Mustache.js\u00a0https:\/\/github.com\/janl\/mustache.js<\/li>\n<\/ol>\n

      The basic HTML for this is given below:<\/p>\n

      <!DOCTYPE html>\r\n<html>\r\n    <head>\r\n        <title>Mustache Demo<\/title>\r\n        <link rel=\"stylesheet\" type=\"text\/css\" \r\n         href=\"https:\/\/bootswatch.com\/bower_components\/bootstrap\/dist\/css\/bootstrap.min.css\" \/>\r\n        <script src=\"https:\/\/use.fontawesome.com\/e344ad35b2.js\"><\/script>\r\n        <style type=\"text\/css\">\r\n            .git-user-avatar {\r\n                width: 100px;\r\n                height: 100px;\r\n            }\r\n            .center{\r\n                text-align: center;\r\n                padding-top: 5px;\r\n            }\r\n            .space{\r\n                margin-top: 10px;\r\n            }\r\n            .git-stars{\r\n                color: goldenrodyellow;\r\n            }\r\n        <\/style>\r\n    <\/head>\r\n    <body>\r\n        <div class=\"container\"><\/div>\r\n        <script src=\"https:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/3.2.1\/jquery.min.js\"><\/script>\r\n        <script src=\"https:\/\/bootswatch.classom\/bower_components\/bootstrap\/dist\/js\/bootstrap.min.js\"><\/script>\r\n        <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/mustache.js\/2.3.0\/mustache.min.js\"><\/script>\r\n    <\/body>\r\n<\/html><\/pre>\n
      GitHub Username Selection<\/h2>\n
      First, let us populate few usernames in a select<\/code> component as shown below:<\/p>\n
      <div class=\"row\">\r\n    <div class=\"col-md-offset-3 col-md-6\">\r\n        <h3>Select user<\/h3>\r\n        <select id=\"git-users\" class=\"form-control\">\r\n            <option value=\"\"><\/option>\r\n            <option value=\"facebook\">Facebook<\/option>\r\n            <option value=\"google\">Google<\/option>\r\n            <option value=\"netflix\">Netflix<\/option>\r\n            <option value=\"flipkart\">Flipkart<\/option>\r\n            <option value=\"amzn\">Amazon<\/option>\r\n            <option value=\"microsoft\">Microsoft<\/option>\r\n        <\/select>\r\n    <\/div>\r\n<\/div><\/pre>\n
      Next is to provide a onChange<\/code> event handler as shown below:<\/p>\n
      $(function() {\r\n    $(\"#git-users\").on('change', function(){\r\n        var username = $(this).val();\r\n        \/\/TODO: get user detail and most starred repos\r\n    });\r\n});<\/pre>\n
      Defining Mustache Template for User Detail<\/h2>\n
      Let us create a place holder for adding the user detail as shown:<\/p>\n
      <div class=\"row\">\r\n    <div class=\"col-md-offset-3 col-md-6\" id=\"git-user-detail\">\r\n    <\/div>\r\n<\/div><\/pre>\n
      Next up is to define the Mustache template as shown below:<\/p>\n
      <script type=\"text\/html\" id=\"git-user-detail-template\">\r\n    <div class=\"center\">\r\n        <img src=\"{{avatar_url}}\" class=\"git-user-avatar\" \/>\r\n        <div class=\"space\"><\/div>\r\n        Github User <a href=\"{{html_url}}\">{{login}}<\/a>\r\n        <div class=\"space\"><\/div>\r\n        Name <a href=\"{{blog}}\">{{name}}<\/a>\r\n        {{#bio}}\r\n        <div class=\"space\"><\/div>\r\n        {{bio}}\r\n        {{\/bio}}\r\n    <\/div>\r\n<\/script><\/pre>\n
      Let us write the javascript which does an Ajax call to GitHub API and renders the data using Mustache template created above:<\/p>\n
      function getUserDetail(username){    \r\n    $.getJSON('https:\/\/api.github.com\/users\/'+username, function(data){\r\n        var html = Mustache.to_html(\r\n          $(\"#git-user-detail-template\").html(), data);\r\n        $(\"#git-user-detail\").html(html);\r\n    });\r\n}<\/pre>\n
      Defining Mustache Template for User Repos<\/h2>\n
      First let us see the placeholder for the data:<\/p>\n
      <div class=\"row\">\r\n    <div class=\"col-md-offset-3 col-md-6\" \r\n        id=\"git-user-repos\">\r\n    <\/div>\r\n<\/div><\/pre>\n
      Next up is the Mustache template:<\/p>\n
      <script type=\"text\/html\" id=\"git-user-repos-template\">\r\n    <ul class=\"list-group\">\r\n        {{#items}}\r\n        <li class=\"list-group-item\">\r\n            <span class=\"badge\">\r\n                <i class=\"fa fa-star git-stars\"><\/i> {{stargazers_count}}\r\n            <\/span>\r\n            <a href=\"{{html_url}}\">{{full_name}}<\/a>\r\n        <\/li>\r\n        {{\/items}}\r\n    <\/ul>\r\n<\/script><\/pre>\n
      And finally the javascript code to load the data via Ajax and render the data using the above template:<\/p>\n
      function getMostStarredRepos(username){\r\n    $.getJSON('https:\/\/api.github.com\/search\/repositories?q=user:'\r\n        +username+'&sort=stars&per_page=10', function(data){\r\n        $(\"#git-user-repos\").html(Mustache.to_html(\r\n            $(\"#git-user-repos-template\").html(), data));\r\n    });\r\n}<\/pre>\n
      I created a small helper function and Mustache template for showing the loading message while we wait for the Ajax call to complete. The Mustache template for that is:<\/p>\n
      <script type=\"text\/html\" id=\"loading-template\">\r\n    <div class=\"alert alert-info center\">\r\n        <i class=\"fa fa-spinner fa-spin\"><\/i> Loading ...\r\n    <\/div>\r\n<\/script><\/pre>\n
      And the Javascript method that uses the above template and renders the message is:<\/p>\n
      function loading(target){\r\n    $(target).html(Mustache.to_html(\r\n        $(\"#loading-template\").html(), {}));\r\n}<\/pre>\n
      Conclusion<\/h2>\n
      In this small article, we saw how to make use of Mustache based client side templates to render the data obtained via REST APIs invoked asynchronously. The complete HTML for this can be found here<\/a>.<\/p>\n
      Some screenshots of the sample. Below is while loading the data:<\/p>\n
      \"\"<\/a><\/p>\n
      Below is after the data has been rendered using Mustache templates:<\/p>\n
      \"\"<\/a><\/p>\n
      \n\n\n\n
      Published on Web Code Geeks with permission by Mohamed Sanaulla, partner at our WCG program<\/a>. See the original article here: Using Mustache.js for Client-Side Templating<\/a><\/p>\n
      Opinions expressed by Web Code Geeks contributors are their own.<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n","protected":false},"excerpt":{"rendered":"
      Introduction In this article, I will show you how to make use of Mustache.js for client-side templating. In this approach, we get the JSON data from an API, developed by you or a 3rd party API and build the HTML required for rendering the data at the client side. We will make use of GitHub …<\/p>\n","protected":false},"author":3,"featured_media":920,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[9],"tags":[496],"class_list":["post-19046","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript","tag-mustache-js"],"yoast_head":"\nUsing Mustache.js for Client-Side Templating - Web Code Geeks - 2026<\/title>\n<meta name=\"description\" content=\"Introduction In this article, I will show you how to make use of Mustache.js for client-side templating. In this approach, we get the JSON data from an\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Using Mustache.js for Client-Side Templating - Web Code Geeks - 2026\" \/>\n<meta property=\"og:description\" content=\"Introduction In this article, I will show you how to make use of Mustache.js for client-side templating. In this approach, we get the JSON data from an\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/\" \/>\n<meta property=\"og:site_name\" content=\"Web Code Geeks\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/webcodegeeks\" \/>\n<meta property=\"article:published_time\" content=\"2017-11-01T10:14:34+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"150\" \/>\n\t<meta property=\"og:image:height\" content=\"150\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Mohamed Sanaulla\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@webcodegeeks\" \/>\n<meta name=\"twitter:site\" content=\"@webcodegeeks\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Mohamed Sanaulla\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/\"},\"author\":{\"name\":\"Mohamed Sanaulla\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/25d8251ab46cf28d12fa1ef1d02d22d1\"},\"headline\":\"Using Mustache.js for Client-Side Templating\",\"datePublished\":\"2017-11-01T10:14:34+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/\"},\"wordCount\":432,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg\",\"keywords\":[\"Mustache.js\"],\"articleSection\":[\"JavaScript\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/\",\"url\":\"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/\",\"name\":\"Using Mustache.js for Client-Side Templating - Web Code Geeks - 2026\",\"isPartOf\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg\",\"datePublished\":\"2017-11-01T10:14:34+00:00\",\"description\":\"Introduction In this article, I will show you how to make use of Mustache.js for client-side templating. In this approach, we get the JSON data from an\",\"breadcrumb\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/#primaryimage\",\"url\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg\",\"contentUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg\",\"width\":150,\"height\":150},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.webcodegeeks.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"JavaScript\",\"item\":\"https:\/\/www.webcodegeeks.com\/category\/javascript\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Using Mustache.js for Client-Side Templating\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#website\",\"url\":\"https:\/\/www.webcodegeeks.com\/\",\"name\":\"Web Code Geeks\",\"description\":\"Web Developers Resource Center\",\"publisher\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.webcodegeeks.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\",\"name\":\"Exelixis Media P.C.\",\"url\":\"https:\/\/www.webcodegeeks.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png\",\"contentUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png\",\"width\":864,\"height\":246,\"caption\":\"Exelixis Media P.C.\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/webcodegeeks\",\"https:\/\/x.com\/webcodegeeks\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/25d8251ab46cf28d12fa1ef1d02d22d1\",\"name\":\"Mohamed Sanaulla\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/64131fe9e9472b8852abf595cbbf3a8a2a5e86569fa1349eed92b2a32f9104c1?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/64131fe9e9472b8852abf595cbbf3a8a2a5e86569fa1349eed92b2a32f9104c1?s=96&d=mm&r=g\",\"caption\":\"Mohamed Sanaulla\"},\"sameAs\":[\"http:\/\/blog.sanaulla.info\"],\"url\":\"https:\/\/www.webcodegeeks.com\/author\/mohamed-sanaulla\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Using Mustache.js for Client-Side Templating - Web Code Geeks - 2026","description":"Introduction In this article, I will show you how to make use of Mustache.js for client-side templating. In this approach, we get the JSON data from an","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:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/","og_locale":"en_US","og_type":"article","og_title":"Using Mustache.js for Client-Side Templating - Web Code Geeks - 2026","og_description":"Introduction In this article, I will show you how to make use of Mustache.js for client-side templating. In this approach, we get the JSON data from an","og_url":"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/","og_site_name":"Web Code Geeks","article_publisher":"https:\/\/www.facebook.com\/webcodegeeks","article_published_time":"2017-11-01T10:14:34+00:00","og_image":[{"width":150,"height":150,"url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg","type":"image\/jpeg"}],"author":"Mohamed Sanaulla","twitter_card":"summary_large_image","twitter_creator":"@webcodegeeks","twitter_site":"@webcodegeeks","twitter_misc":{"Written by":"Mohamed Sanaulla","Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/#article","isPartOf":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/"},"author":{"name":"Mohamed Sanaulla","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/25d8251ab46cf28d12fa1ef1d02d22d1"},"headline":"Using Mustache.js for Client-Side Templating","datePublished":"2017-11-01T10:14:34+00:00","mainEntityOfPage":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/"},"wordCount":432,"commentCount":0,"publisher":{"@id":"https:\/\/www.webcodegeeks.com\/#organization"},"image":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/#primaryimage"},"thumbnailUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg","keywords":["Mustache.js"],"articleSection":["JavaScript"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/","url":"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/","name":"Using Mustache.js for Client-Side Templating - Web Code Geeks - 2026","isPartOf":{"@id":"https:\/\/www.webcodegeeks.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/#primaryimage"},"image":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/#primaryimage"},"thumbnailUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg","datePublished":"2017-11-01T10:14:34+00:00","description":"Introduction In this article, I will show you how to make use of Mustache.js for client-side templating. In this approach, we get the JSON data from an","breadcrumb":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/#primaryimage","url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg","contentUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg","width":150,"height":150},{"@type":"BreadcrumbList","@id":"https:\/\/www.webcodegeeks.com\/javascript\/using-mustache-js-client-side-templating\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.webcodegeeks.com\/"},{"@type":"ListItem","position":2,"name":"JavaScript","item":"https:\/\/www.webcodegeeks.com\/category\/javascript\/"},{"@type":"ListItem","position":3,"name":"Using Mustache.js for Client-Side Templating"}]},{"@type":"WebSite","@id":"https:\/\/www.webcodegeeks.com\/#website","url":"https:\/\/www.webcodegeeks.com\/","name":"Web Code Geeks","description":"Web Developers Resource Center","publisher":{"@id":"https:\/\/www.webcodegeeks.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.webcodegeeks.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.webcodegeeks.com\/#organization","name":"Exelixis Media P.C.","url":"https:\/\/www.webcodegeeks.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png","contentUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png","width":864,"height":246,"caption":"Exelixis Media P.C."},"image":{"@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/webcodegeeks","https:\/\/x.com\/webcodegeeks"]},{"@type":"Person","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/25d8251ab46cf28d12fa1ef1d02d22d1","name":"Mohamed Sanaulla","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/64131fe9e9472b8852abf595cbbf3a8a2a5e86569fa1349eed92b2a32f9104c1?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/64131fe9e9472b8852abf595cbbf3a8a2a5e86569fa1349eed92b2a32f9104c1?s=96&d=mm&r=g","caption":"Mohamed Sanaulla"},"sameAs":["http:\/\/blog.sanaulla.info"],"url":"https:\/\/www.webcodegeeks.com\/author\/mohamed-sanaulla\/"}]}},"_links":{"self":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts\/19046","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/comments?post=19046"}],"version-history":[{"count":0,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts\/19046\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/media\/920"}],"wp:attachment":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/media?parent=19046"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/categories?post=19046"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/tags?post=19046"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}