A code editor of your choice<\/li>\n<\/ul>\nSetting up the basic HTML structure<\/h2>\n
To start building our quiz app, we need to set up the basic HTML structure. Open your code editor and create a new HTML file. Let’s name it index.html<\/code>.<\/p>\nIn the index.html<\/code> file, start by adding the HTML doctype declaration and the opening and closing <html><\/code> tags. Inside the <html><\/code> tags, add the <head><\/code> and <body><\/code> tags.<\/p>\n<!DOCTYPE html>\n<html>\n<head>\n <title>Quiz App<\/title>\n<\/head>\n<body>\n\n<\/body>\n<\/html>\n<\/code><\/pre>\nInside the <body><\/code> tag, add a <header><\/code> element to hold the title of the quiz app.<\/p>\n<body>\n <header>\n <h1>Quiz App<\/h1>\n <\/header>\n<\/body>\n<\/code><\/pre>\nNext, we will add a container to hold the quiz questions and answers. Add a <div><\/code> element with the class name container<\/code>. Inside the container, we will add the quiz questions and answers dynamically using JavaScript.<\/p>\n<body>\n <header>\n <h1>Quiz App<\/h1>\n <\/header>\n\n <div class=\"container\">\n\n <\/div>\n<\/body>\n<\/code><\/pre>\nStyling the app with CSS<\/h2>\n
Now that we have set up the basic HTML structure, let’s style our quiz app using CSS. Create a new CSS file called style.css<\/code> and link it to your HTML file by adding the following <link><\/code> tag inside the <head><\/code> tag of index.html<\/code>.<\/p>\n<!DOCTYPE html>\n<html>\n<head>\n <title>Quiz App<\/title>\n <link rel=\"stylesheet\" href=\"style.css\">\n<\/head>\n<body>\n <!-- HTML code goes here -->\n<\/body>\n<\/html>\n<\/code><\/pre>\nInside style.css<\/code>, let’s start by adding some basic styles to our app. We will center align the text, set a maximum width for the container, and add some padding and margin to give it some spacing.<\/p>\nbody {\n text-align: center;\n}\n\n.container {\n max-width: 600px;\n margin: 0 auto;\n padding: 20px;\n}\n<\/code><\/pre>\nSave both index.html<\/code> and style.css<\/code> files and open index.html<\/code> in your web browser. You should see the app title centered on the page with some spacing around it.<\/p>\nCreating the quiz questions and answers<\/h2>\n
Now that we have set up the basic structure and styling of our app, let’s move on to creating the quiz questions and answers.<\/p>\n
Inside the container <div><\/code> tag, add a <div><\/code> element with a class name of question<\/code>. This element will display the current quiz question.<\/p>\n<div class=\"container\">\n <div class=\"question\">\n\n <\/div>\n<\/div>\n<\/code><\/pre>\nInside the question<\/code> <div><\/code>, add an <h2><\/code> tag to display the question text.<\/p>\n<div class=\"container\">\n <div class=\"question\">\n <h2>Question Text<\/h2>\n <\/div>\n<\/div>\n<\/code><\/pre>\nNext, we will add the answer options for each question. Inside the question<\/code> <div><\/code>, add a <ul><\/code> element to hold the answer options.<\/p>\n<div class=\"container\">\n <div class=\"question\">\n <h2>Question Text<\/h2>\n <ul class=\"options\">\n\n <\/ul>\n <\/div>\n<\/div>\n<\/code><\/pre>\nInside the options<\/code> <ul><\/code>, add a <li><\/code> element for each answer option. Add a <label><\/code> element inside each <li><\/code>, followed by an <input type=\"radio\"><\/code> element. The <label><\/code> will display the answer text, and the <input><\/code> will allow users to select an answer.<\/p>\n<div class=\"container\">\n <div class=\"question\">\n <h2>Question Text<\/h2>\n <ul class=\"options\">\n <li>\n <label>\n <input type=\"radio\">\n Answer 1\n <\/label>\n <\/li>\n <li>\n <label>\n <input type=\"radio\">\n Answer 2\n <\/label>\n <\/li>\n <li>\n <label>\n <input type=\"radio\">\n Answer 3\n <\/label>\n <\/li>\n <li>\n <label>\n <input type=\"radio\">\n Answer 4\n <\/label>\n <\/li>\n <\/ul>\n <\/div>\n<\/div>\n<\/code><\/pre>\nSave your changes and preview index.html<\/code> in your web browser. You should see a question with four answer options displayed on the page.<\/p>\nImplementing the scoring system and feedback<\/h2>\n
Now that we have created the quiz questions and answers, let’s implement the scoring system and feedback mechanism.<\/p>\n
First, we need to keep track of the user’s selected answer for each question. Add a new <script><\/code> tag at the bottom of index.html<\/code> to add JavaScript code to handle the quiz functionality.<\/p>\n<script src=\"script.js\"><\/script>\n<\/body>\n<\/html>\n<\/code><\/pre>\nNext, create a new JavaScript file called script.js<\/code>. This is where we will write the JavaScript code to handle the quiz functionality.<\/p>\nInside script.js<\/code>, let’s start by defining an array of objects to store the quiz questions and answer options. Each object in the array will represent a question and its associated answer options.<\/p>\nconst quizData = [\n {\n question: \"Question 1\",\n options: [\"Answer 1\", \"Answer 2\", \"Answer 3\", \"Answer 4\"],\n answer: 1\n },\n {\n question: \"Question 2\",\n options: [\"Answer 1\", \"Answer 2\", \"Answer 3\", \"Answer 4\"],\n answer: 2\n },\n \/\/ Add more questions here\n];\n<\/code><\/pre>\nYou can customize the number of questions, answer options, and correct answers to fit your specific quiz requirements.<\/p>\n
Next, we will use JavaScript to dynamically populate the quiz questions and answer options inside the HTML. Add the following code to the script.js<\/code> file.<\/p>\nconst questionContainer = document.querySelector(\".question\");\nconst optionsContainer = document.querySelector(\".options\");\nlet currentQuestion = 0;\n\nfunction showQuestion() {\n const question = quizData[currentQuestion];\n questionContainer.innerHTML = `<h2>${question.question}<\/h2>`;\n\n let optionsHtml = \"\";\n question.options.forEach((option, index) => {\n optionsHtml += `\n <li>\n <label>\n <input type=\"radio\" name=\"option\" value=\"${index}\">\n ${option}\n <\/label>\n <\/li>\n `;\n });\n\n optionsContainer.innerHTML = optionsHtml;\n}\n\nshowQuestion();\n<\/code><\/pre>\nThe showQuestion()<\/code> function retrieves the current question object from the quizData<\/code> array and dynamically updates the HTML with the question and answer options.<\/p>\nSave your changes and preview index.html<\/code> in your web browser. You should see the first question and its answer options displayed on the page.<\/p>\nAdding interactivity with JavaScript<\/h2>\n
Now that we have populated the quiz questions and answer options, let’s add some interactive elements and functionality.<\/p>\n
First, we need to add a button to the bottom of the quiz page to allow users to submit their answers.<\/p>\n
Inside the container<\/code> <div><\/code>, add a <div><\/code> element with a class name of actions<\/code>. Inside the actions<\/code> <div><\/code>, add a <button><\/code> element with the text “Submit”.<\/p>\n<div class=\"container\">\n <div class=\"question\">\n <h2>Question Text<\/h2>\n <ul class=\"options\">\n <!-- Answer options go here -->\n <\/ul>\n <\/div>\n\n <div class=\"actions\">\n <button class=\"submit\">Submit<\/button>\n <\/div>\n<\/div>\n<\/code><\/pre>\nNext, let’s add the JavaScript code to handle the submission of answers and display the feedback to the user.<\/p>\n
Inside script.js<\/code>, add the following code.<\/p>\nconst submitButton = document.querySelector(\".submit\");\nlet score = 0;\n\nsubmitButton.addEventListener(\"click\", () => {\n const selectedOption = optionsContainer.querySelector(\"input[name='option']:checked\");\n\n if (selectedOption) {\n const selectedAnswer = parseInt(selectedOption.value);\n\n if (selectedAnswer === quizData[currentQuestion].answer) {\n score++;\n }\n\n currentQuestion++;\n\n if (currentQuestion < quizData.length) {\n showQuestion();\n } else {\n showResult();\n }\n }\n});\n\nfunction showResult() {\n questionContainer.innerHTML = `<h2>You have completed the quiz!<\/h2>`;\n optionsContainer.innerHTML = `<p>Your score: ${score}\/${quizData.length}<\/p>`;\n}\n<\/code><\/pre>\nThe event listener is attached to the submit button, and when clicked, it retrieves the selected answer option and checks if it matches the correct answer. If the answer is correct, the score is incremented by one.<\/p>\n
The currentQuestion<\/code> variable is then incremented, and if there are remaining questions, the showQuestion()<\/code> function is called to display the next question. If there are no more questions, the showResult()<\/code> function is called to display the final score.<\/p>\nSave your changes and preview index.html<\/code> in your web browser. You should be able to submit answers and see the score and completion message at the end of the quiz.<\/p>\nConclusion<\/h2>\n
Congratulations! You have successfully built a quiz app using HTML, CSS, and JavaScript. You can further customize the app by adding more quiz questions and answer options, styling the app to match your branding, and adding additional features like timers or leaderboards.<\/p>\n
Feel free to experiment with the code and add your own creative touches to the quiz app. Happy coding!<\/p>\n","protected":false},"excerpt":{"rendered":"
How to Build a Quiz App with HTML, CSS, and JavaScript In this tutorial, we will guide you through the process of building a quiz app using HTML, CSS, and JavaScript. We will cover the following topics: Setting up the basic HTML structure Styling the app with CSS Creating the Continue Reading<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_import_markdown_pro_load_document_selector":0,"_import_markdown_pro_submit_text_textarea":"","footnotes":""},"categories":[1],"tags":[1483,431,430,156,36,49,1482],"yoast_head":"\nHow to Build a Quiz App with HTML, CSS and JavaScript - Pantherax Blogs<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Build a Quiz App with HTML, CSS and JavaScript\" \/>\n<meta property=\"og:description\" content=\"How to Build a Quiz App with HTML, CSS, and JavaScript In this tutorial, we will guide you through the process of building a quiz app using HTML, CSS, and JavaScript. We will cover the following topics: Setting up the basic HTML structure Styling the app with CSS Creating the Continue Reading\" \/>\n<meta property=\"og:url\" content=\"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/\" \/>\n<meta property=\"og:site_name\" content=\"Pantherax Blogs\" \/>\n<meta property=\"article:published_time\" content=\"2023-11-04T23:14:06+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-11-05T05:47:58+00:00\" \/>\n<meta name=\"author\" content=\"Panther\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Panther\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"8 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\n\t \"@context\": \"https:\/\/schema.org\",\n\t \"@graph\": [\n\t {\n\t \"@type\": \"Article\",\n\t \"@id\": \"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/#article\",\n\t \"isPartOf\": {\n\t \"@id\": \"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/\"\n\t },\n\t \"author\": {\n\t \"name\": \"Panther\",\n\t \"@id\": \"http:\/\/localhost:10003\/#\/schema\/person\/b63d816f4964b163e53cbbcffaa0f3d7\"\n\t },\n\t \"headline\": \"How to Build a Quiz App with HTML, CSS and JavaScript\",\n\t \"datePublished\": \"2023-11-04T23:14:06+00:00\",\n\t \"dateModified\": \"2023-11-05T05:47:58+00:00\",\n\t \"mainEntityOfPage\": {\n\t \"@id\": \"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/\"\n\t },\n\t \"wordCount\": 917,\n\t \"publisher\": {\n\t \"@id\": \"http:\/\/localhost:10003\/#organization\"\n\t },\n\t \"keywords\": [\n\t \"\\\"build a quiz app\\\"\",\n\t \"\\\"css\\\"\",\n\t \"\\\"html\\\"\",\n\t \"\\\"JavaScript\\\"\",\n\t \"\\\"tutorial\\\"]\",\n\t \"\\\"Web development\\\"\",\n\t \"[\\\"Quiz App\\\"\"\n\t ],\n\t \"inLanguage\": \"en-US\"\n\t },\n\t {\n\t \"@type\": \"WebPage\",\n\t \"@id\": \"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/\",\n\t \"url\": \"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/\",\n\t \"name\": \"How to Build a Quiz App with HTML, CSS and JavaScript - Pantherax Blogs\",\n\t \"isPartOf\": {\n\t \"@id\": \"http:\/\/localhost:10003\/#website\"\n\t },\n\t \"datePublished\": \"2023-11-04T23:14:06+00:00\",\n\t \"dateModified\": \"2023-11-05T05:47:58+00:00\",\n\t \"breadcrumb\": {\n\t \"@id\": \"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/#breadcrumb\"\n\t },\n\t \"inLanguage\": \"en-US\",\n\t \"potentialAction\": [\n\t {\n\t \"@type\": \"ReadAction\",\n\t \"target\": [\n\t \"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/\"\n\t ]\n\t }\n\t ]\n\t },\n\t {\n\t \"@type\": \"BreadcrumbList\",\n\t \"@id\": \"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/#breadcrumb\",\n\t \"itemListElement\": [\n\t {\n\t \"@type\": \"ListItem\",\n\t \"position\": 1,\n\t \"name\": \"Home\",\n\t \"item\": \"http:\/\/localhost:10003\/\"\n\t },\n\t {\n\t \"@type\": \"ListItem\",\n\t \"position\": 2,\n\t \"name\": \"How to Build a Quiz App with HTML, CSS and JavaScript\"\n\t }\n\t ]\n\t },\n\t {\n\t \"@type\": \"WebSite\",\n\t \"@id\": \"http:\/\/localhost:10003\/#website\",\n\t \"url\": \"http:\/\/localhost:10003\/\",\n\t \"name\": \"Pantherax Blogs\",\n\t \"description\": \"\",\n\t \"publisher\": {\n\t \"@id\": \"http:\/\/localhost:10003\/#organization\"\n\t },\n\t \"potentialAction\": [\n\t {\n\t \"@type\": \"SearchAction\",\n\t \"target\": {\n\t \"@type\": \"EntryPoint\",\n\t \"urlTemplate\": \"http:\/\/localhost:10003\/?s={search_term_string}\"\n\t },\n\t \"query-input\": \"required name=search_term_string\"\n\t }\n\t ],\n\t \"inLanguage\": \"en-US\"\n\t },\n\t {\n\t \"@type\": \"Organization\",\n\t \"@id\": \"http:\/\/localhost:10003\/#organization\",\n\t \"name\": \"Pantherax Blogs\",\n\t \"url\": \"http:\/\/localhost:10003\/\",\n\t \"logo\": {\n\t \"@type\": \"ImageObject\",\n\t \"inLanguage\": \"en-US\",\n\t \"@id\": \"http:\/\/localhost:10003\/#\/schema\/logo\/image\/\",\n\t \"url\": \"http:\/\/localhost:10003\/wp-content\/uploads\/2023\/11\/cropped-9e7721cb-2d62-4f72-ab7f-7d1d8db89226.jpeg\",\n\t \"contentUrl\": \"http:\/\/localhost:10003\/wp-content\/uploads\/2023\/11\/cropped-9e7721cb-2d62-4f72-ab7f-7d1d8db89226.jpeg\",\n\t \"width\": 1024,\n\t \"height\": 1024,\n\t \"caption\": \"Pantherax Blogs\"\n\t },\n\t \"image\": {\n\t \"@id\": \"http:\/\/localhost:10003\/#\/schema\/logo\/image\/\"\n\t }\n\t },\n\t {\n\t \"@type\": \"Person\",\n\t \"@id\": \"http:\/\/localhost:10003\/#\/schema\/person\/b63d816f4964b163e53cbbcffaa0f3d7\",\n\t \"name\": \"Panther\",\n\t \"image\": {\n\t \"@type\": \"ImageObject\",\n\t \"inLanguage\": \"en-US\",\n\t \"@id\": \"http:\/\/localhost:10003\/#\/schema\/person\/image\/\",\n\t \"url\": \"http:\/\/2.gravatar.com\/avatar\/b8c0eda5a49f8f31ec32d0a0f9d6f838?s=96&d=mm&r=g\",\n\t \"contentUrl\": \"http:\/\/2.gravatar.com\/avatar\/b8c0eda5a49f8f31ec32d0a0f9d6f838?s=96&d=mm&r=g\",\n\t \"caption\": \"Panther\"\n\t },\n\t \"sameAs\": [\n\t \"http:\/\/localhost:10003\"\n\t ],\n\t \"url\": \"http:\/\/localhost:10003\/author\/pepethefrog\/\"\n\t }\n\t ]\n\t}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"How to Build a Quiz App with HTML, CSS and JavaScript - Pantherax Blogs","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":"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/","og_locale":"en_US","og_type":"article","og_title":"How to Build a Quiz App with HTML, CSS and JavaScript","og_description":"How to Build a Quiz App with HTML, CSS, and JavaScript In this tutorial, we will guide you through the process of building a quiz app using HTML, CSS, and JavaScript. We will cover the following topics: Setting up the basic HTML structure Styling the app with CSS Creating the Continue Reading","og_url":"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/","og_site_name":"Pantherax Blogs","article_published_time":"2023-11-04T23:14:06+00:00","article_modified_time":"2023-11-05T05:47:58+00:00","author":"Panther","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Panther","Est. reading time":"8 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/#article","isPartOf":{"@id":"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/"},"author":{"name":"Panther","@id":"http:\/\/localhost:10003\/#\/schema\/person\/b63d816f4964b163e53cbbcffaa0f3d7"},"headline":"How to Build a Quiz App with HTML, CSS and JavaScript","datePublished":"2023-11-04T23:14:06+00:00","dateModified":"2023-11-05T05:47:58+00:00","mainEntityOfPage":{"@id":"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/"},"wordCount":917,"publisher":{"@id":"http:\/\/localhost:10003\/#organization"},"keywords":["\"build a quiz app\"","\"css\"","\"html\"","\"JavaScript\"","\"tutorial\"]","\"Web development\"","[\"Quiz App\""],"inLanguage":"en-US"},{"@type":"WebPage","@id":"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/","url":"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/","name":"How to Build a Quiz App with HTML, CSS and JavaScript - Pantherax Blogs","isPartOf":{"@id":"http:\/\/localhost:10003\/#website"},"datePublished":"2023-11-04T23:14:06+00:00","dateModified":"2023-11-05T05:47:58+00:00","breadcrumb":{"@id":"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/"]}]},{"@type":"BreadcrumbList","@id":"http:\/\/localhost:10003\/how-to-build-a-quiz-app-with-html-css-and-javascript\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"http:\/\/localhost:10003\/"},{"@type":"ListItem","position":2,"name":"How to Build a Quiz App with HTML, CSS and JavaScript"}]},{"@type":"WebSite","@id":"http:\/\/localhost:10003\/#website","url":"http:\/\/localhost:10003\/","name":"Pantherax Blogs","description":"","publisher":{"@id":"http:\/\/localhost:10003\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"http:\/\/localhost:10003\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"http:\/\/localhost:10003\/#organization","name":"Pantherax Blogs","url":"http:\/\/localhost:10003\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"http:\/\/localhost:10003\/#\/schema\/logo\/image\/","url":"http:\/\/localhost:10003\/wp-content\/uploads\/2023\/11\/cropped-9e7721cb-2d62-4f72-ab7f-7d1d8db89226.jpeg","contentUrl":"http:\/\/localhost:10003\/wp-content\/uploads\/2023\/11\/cropped-9e7721cb-2d62-4f72-ab7f-7d1d8db89226.jpeg","width":1024,"height":1024,"caption":"Pantherax Blogs"},"image":{"@id":"http:\/\/localhost:10003\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"http:\/\/localhost:10003\/#\/schema\/person\/b63d816f4964b163e53cbbcffaa0f3d7","name":"Panther","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"http:\/\/localhost:10003\/#\/schema\/person\/image\/","url":"http:\/\/2.gravatar.com\/avatar\/b8c0eda5a49f8f31ec32d0a0f9d6f838?s=96&d=mm&r=g","contentUrl":"http:\/\/2.gravatar.com\/avatar\/b8c0eda5a49f8f31ec32d0a0f9d6f838?s=96&d=mm&r=g","caption":"Panther"},"sameAs":["http:\/\/localhost:10003"],"url":"http:\/\/localhost:10003\/author\/pepethefrog\/"}]}},"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"","_links":{"self":[{"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/posts\/4152"}],"collection":[{"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/comments?post=4152"}],"version-history":[{"count":1,"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/posts\/4152\/revisions"}],"predecessor-version":[{"id":4368,"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/posts\/4152\/revisions\/4368"}],"wp:attachment":[{"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/media?parent=4152"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/categories?post=4152"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/tags?post=4152"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}