{"id":32865,"date":"2024-11-01T09:12:04","date_gmt":"2024-11-01T09:12:04","guid":{"rendered":"http:\/\/atmokpo.com\/w\/?p=32865"},"modified":"2024-11-01T11:21:42","modified_gmt":"2024-11-01T11:21:42","slug":"react-course-creating-a-react-app","status":"publish","type":"post","link":"https:\/\/atmokpo.com\/w\/32865\/","title":{"rendered":"React Course: Creating a React App"},"content":{"rendered":"<p>React is currently one of the most popular JavaScript libraries, offering an efficient and flexible way to build user interfaces (UI). This course will guide you step-by-step in creating a simple web application using React. By completing this course, you will understand the fundamental concepts of React and be equipped to build real-world applications.<\/p>\n<h2>1. What is React?<\/h2>\n<p>React is an open-source JavaScript library developed by Facebook. It is primarily used for creating single-page applications (SPA). React provides a component-based structure that enhances code reusability and simplifies application maintenance. In addition, it can maximize performance by using a virtual DOM.<\/p>\n<h2>2. Key Features of React<\/h2>\n<ul>\n<li><strong>Component-based Structure:<\/strong> React divides the UI into independent components. Each component can have its own state and properties.<\/li>\n<li><strong>Virtual DOM:<\/strong> React processes changes in the virtual DOM before accessing the actual DOM, significantly improving performance.<\/li>\n<li><strong>Unidirectional Data Flow:<\/strong> Data flows from parent components to child components. This clarifies the data flow and makes debugging easier.<\/li>\n<li><strong>JSX:<\/strong> React provides JSX, which allows mixing JavaScript and HTML, making the code more readable.<\/li>\n<\/ul>\n<h2>3. Installing React<\/h2>\n<p>To use React, you first need to set up the development environment. Let&#8217;s proceed with the installation as follows.<\/p>\n<h3>3.1 Installing Node.js and npm<\/h3>\n<p>React runs in a Node.js environment. Therefore, you must first install Node.js and npm (Node Package Manager). Node.js can be downloaded from the <a href=\"https:\/\/nodejs.org\/en\/download\/\" target=\"_blank\" rel=\"noopener\">official website<\/a>.<\/p>\n<h3>3.2 Creating a New Project with Create React App<\/h3>\n<p>Now, let&#8217;s use Create React App to easily create a React project. Type the following command in the terminal to create a new project:<\/p>\n<pre><code>npx create-react-app my-app<\/code><\/pre>\n<p>When you enter the above command, a new React project folder named &#8220;my-app&#8221; will be created. Once the creation is complete, use the following command to navigate to the project folder.<\/p>\n<pre><code>cd my-app<\/code><\/pre>\n<h3>3.3 Running the Application<\/h3>\n<p>Now let&#8217;s run the application. Enter the following command:<\/p>\n<pre><code>npm start<\/code><\/pre>\n<p>The browser will open automatically, and you can check the application at <strong>http:\/\/localhost:3000<\/strong>.<\/p>\n<h2>4. Basic Concepts of React<\/h2>\n<p>To understand React, you need to learn a few basic concepts.<\/p>\n<h3>4.1 Components<\/h3>\n<p>Components are the basic building blocks of a React application. Each component can include HTML, CSS, and JavaScript. Here is an example of a simple functional component:<\/p>\n<pre><code>function Welcome() {\n    return &lt;h1&gt;Hello, World!&lt;\/h1&gt;;\n}<\/code><\/pre>\n<h3>4.2 State Management<\/h3>\n<p>In React, state is a way to manage a component&#8217;s data. Whenever the state changes, React re-renders the component.<\/p>\n<p>Here\u2019s how to define and update the state:<\/p>\n<pre><code>import React, { useState } from 'react';\n\nfunction Counter() {\n    const [count, setCount] = useState(0);\n\n    return (\n        &lt;div&gt;\n            &lt;p&gt;Clicked {count} times&lt;\/p&gt;\n            &lt;button onClick={() =&gt; setCount(count + 1)}&gt;Click me&lt;\/button&gt;\n        &lt;\/div&gt;\n    );\n}<\/code><\/pre>\n<h3>4.3 Props<\/h3>\n<p>Props are the way to pass data between components. Information can be passed from parent components to child components.<\/p>\n<pre><code>function Greeting(props) {\n    return &lt;h1&gt;Hello, {props.name}!&lt;\/h1&gt;;\n}\n\nfunction App() {\n    return &lt;Greeting name=\"Alice\" \/&gt;;\n}<\/code><\/pre>\n<h2>5. Creating a React App<\/h2>\n<p>Now let&#8217;s dive into creating a React app. This project will be about making a simple To-Do List application.<\/p>\n<h3>5.1 Project Structure<\/h3>\n<p>First, let&#8217;s define the necessary components. Our project will have the following structure:<\/p>\n<ul>\n<li>src\/\n<ul>\n<li>components\/\n<ul>\n<li>Todo.js<\/li>\n<li>TodoList.js<\/li>\n<\/ul>\n<\/li>\n<li>App.js<\/li>\n<li>index.js<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<h3>5.2 Creating the Todo Component<\/h3>\n<p>Create a file named Todo.js and define a component that displays each to-do item.<\/p>\n<pre><code>import React from 'react';\n\nfunction Todo({ todo, onToggle }) {\n    return (\n        &lt;div onClick={onToggle}&gt;\n            &lt;span style={{ textDecoration: todo.completed ? 'line-through' : 'none' }}&gt;\n                {todo.text}\n            &lt;\/span&gt;\n        &lt;\/div&gt;\n    );\n}\n\nexport default Todo;<\/code><\/pre>\n<h3>5.3 Creating the TodoList Component<\/h3>\n<p>Create a file named TodoList.js and make a list that displays multiple Todo components.<\/p>\n<pre><code>import React from 'react';\nimport Todo from '.\/Todo';\n\nfunction TodoList({ todos, onToggle }) {\n    return (\n        &lt;div&gt;\n            {todos.map(todo =&gt; (\n                &lt;Todo key={todo.id} todo={todo} onToggle={() =&gt; onToggle(todo.id)} \/&gt;\n            ))}\n        &lt;\/div&gt;\n    );\n}\n\nexport default TodoList;<\/code><\/pre>\n<h3>5.4 Updating the App Component<\/h3>\n<p>In the App.js file, let&#8217;s add logic to manage the state and render the TodoList.<\/p>\n<pre><code>import React, { useState } from 'react';\nimport TodoList from '.\/components\/TodoList';\n\nfunction App() {\n    const [todos, setTodos] = useState([\n        { id: 1, text: 'Learn React', completed: false },\n        { id: 2, text: 'Practice Frontend Development', completed: false },\n    ]);\n\n    const toggleTodo = (id) =&gt; {\n        const updatedTodos = todos.map(todo =&gt;\n            todo.id === id ? { ...todo, completed: !todo.completed } : todo\n        );\n        setTodos(updatedTodos);\n    };\n\n    return &lt;TodoList todos={todos} onToggle={toggleTodo} \/&gt;;\n}\n\nexport default App;<\/code><\/pre>\n<h3>5.5 Finally Running the App<\/h3>\n<p>After writing the code above, run the application again, and a to-do list will be displayed, allowing you to click each item to toggle its completion status.<\/p>\n<h2>6. Optimizing React Apps<\/h2>\n<p>Optimizing the application is an important task to enhance user experience and improve performance. Here are some ways to optimize React apps:<\/p>\n<ul>\n<li><strong>React.memo:<\/strong> You can memoize components to avoid unnecessary re-renders.<\/li>\n<li><strong>useCallback:<\/strong> Memoizing functions prevents child components from re-rendering unnecessarily.<\/li>\n<li><strong>useMemo:<\/strong> Memoizing computationally expensive values optimizes performance.<\/li>\n<\/ul>\n<h2>7. Using React Router<\/h2>\n<p>To implement multiple pages in a React application, you can use React Router. Here\u2019s how to install React Router and set up basic routing:<\/p>\n<pre><code>npm install react-router-dom<\/code><\/pre>\n<h3>7.1 Setting Up Basic Routing<\/h3>\n<p>Edit the App.js file to set up routing.<\/p>\n<pre><code>import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';\n\n\/\/ Import other components\nimport Home from '.\/components\/Home';\nimport About from '.\/components\/About';\n\nfunction App() {\n    return (\n        &lt;Router&gt;\n            &lt;Switch&gt;\n                &lt;Route path=\"\/\" exact component={Home} \/&gt;\n                &lt;Route path=\"\/about\" component={About} \/&gt;\n            &lt;\/Switch&gt;\n        &lt;\/Router&gt;\n    );\n}<\/code><\/pre>\n<h2>8. Conclusion<\/h2>\n<p>In this course, we learned how to create a simple to-do list application using React. Through the process of understanding the basic concepts of React, creating components, managing state, and setting up routing, you probably felt the appeal of React. As a powerful and flexible library, React has limitless potential for various projects. I hope you continue to develop your React skills through more projects.<\/p>\n<h2>Appendix: Additional Resources<\/h2>\n<p>Here are some materials where you can study the concepts mentioned in this course more deeply:<\/p>\n<ul>\n<li><a href=\"https:\/\/reactjs.org\/docs\/getting-started.html\" target=\"_blank\" rel=\"noopener\">Official React Documentation<\/a><\/li>\n<li><a href=\"https:\/\/reactrouter.com\/\" target=\"_blank\" rel=\"noopener\">Official React Router Documentation<\/a><\/li>\n<li><a href=\"https:\/\/redux.js.org\/\" target=\"_blank\" rel=\"noopener\">Official Redux Documentation<\/a><\/li>\n<\/ul>\n<p>Thank you. I hope your learning of React is enjoyable and beneficial!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>React is currently one of the most popular JavaScript libraries, offering an efficient and flexible way to build user interfaces (UI). This course will guide you step-by-step in creating a simple web application using React. By completing this course, you will understand the fundamental concepts of React and be equipped to build real-world applications. 1. &hellip; <a href=\"https:\/\/atmokpo.com\/w\/32865\/\" class=\"more-link\">\ub354 \ubcf4\uae30<span class=\"screen-reader-text\"> &#8220;React Course: Creating a React App&#8221;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[123],"tags":[],"class_list":["post-32865","post","type-post","status-publish","format-standard","hentry","category-react-basics-course"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.2 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>React Course: Creating a React App - \ub77c\uc774\ube0c\uc2a4\ub9c8\ud2b8<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/atmokpo.com\/w\/32865\/\" \/>\n<meta property=\"og:locale\" content=\"ko_KR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"React Course: Creating a React App - \ub77c\uc774\ube0c\uc2a4\ub9c8\ud2b8\" \/>\n<meta property=\"og:description\" content=\"React is currently one of the most popular JavaScript libraries, offering an efficient and flexible way to build user interfaces (UI). This course will guide you step-by-step in creating a simple web application using React. By completing this course, you will understand the fundamental concepts of React and be equipped to build real-world applications. 1. &hellip; \ub354 \ubcf4\uae30 &quot;React Course: Creating a React App&quot;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/atmokpo.com\/w\/32865\/\" \/>\n<meta property=\"og:site_name\" content=\"\ub77c\uc774\ube0c\uc2a4\ub9c8\ud2b8\" \/>\n<meta property=\"article:published_time\" content=\"2024-11-01T09:12:04+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-11-01T11:21:42+00:00\" \/>\n<meta name=\"author\" content=\"root\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@bebubo4\" \/>\n<meta name=\"twitter:site\" content=\"@bebubo4\" \/>\n<meta name=\"twitter:label1\" content=\"\uae00\uc4f4\uc774\" \/>\n\t<meta name=\"twitter:data1\" content=\"root\" \/>\n\t<meta name=\"twitter:label2\" content=\"\uc608\uc0c1 \ub418\ub294 \ud310\ub3c5 \uc2dc\uac04\" \/>\n\t<meta name=\"twitter:data2\" content=\"5\ubd84\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/atmokpo.com\/w\/32865\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/atmokpo.com\/w\/32865\/\"},\"author\":{\"name\":\"root\",\"@id\":\"https:\/\/atmokpo.com\/w\/#\/schema\/person\/91b6b3b138fbba0efb4ae64b1abd81d7\"},\"headline\":\"React Course: Creating a React App\",\"datePublished\":\"2024-11-01T09:12:04+00:00\",\"dateModified\":\"2024-11-01T11:21:42+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/atmokpo.com\/w\/32865\/\"},\"wordCount\":758,\"publisher\":{\"@id\":\"https:\/\/atmokpo.com\/w\/#organization\"},\"articleSection\":[\"React basics course\"],\"inLanguage\":\"ko-KR\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/atmokpo.com\/w\/32865\/\",\"url\":\"https:\/\/atmokpo.com\/w\/32865\/\",\"name\":\"React Course: Creating a React App - \ub77c\uc774\ube0c\uc2a4\ub9c8\ud2b8\",\"isPartOf\":{\"@id\":\"https:\/\/atmokpo.com\/w\/#website\"},\"datePublished\":\"2024-11-01T09:12:04+00:00\",\"dateModified\":\"2024-11-01T11:21:42+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/atmokpo.com\/w\/32865\/#breadcrumb\"},\"inLanguage\":\"ko-KR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/atmokpo.com\/w\/32865\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/atmokpo.com\/w\/32865\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"\ud648\",\"item\":\"https:\/\/atmokpo.com\/w\/en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"React Course: Creating a React App\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/atmokpo.com\/w\/#website\",\"url\":\"https:\/\/atmokpo.com\/w\/\",\"name\":\"\ub77c\uc774\ube0c\uc2a4\ub9c8\ud2b8\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/atmokpo.com\/w\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/atmokpo.com\/w\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"ko-KR\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/atmokpo.com\/w\/#organization\",\"name\":\"\ub77c\uc774\ube0c\uc2a4\ub9c8\ud2b8\",\"url\":\"https:\/\/atmokpo.com\/w\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"ko-KR\",\"@id\":\"https:\/\/atmokpo.com\/w\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/atmokpo.com\/w\/wp-content\/uploads\/2024\/11\/logo.png\",\"contentUrl\":\"https:\/\/atmokpo.com\/w\/wp-content\/uploads\/2024\/11\/logo.png\",\"width\":400,\"height\":400,\"caption\":\"\ub77c\uc774\ube0c\uc2a4\ub9c8\ud2b8\"},\"image\":{\"@id\":\"https:\/\/atmokpo.com\/w\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/x.com\/bebubo4\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/atmokpo.com\/w\/#\/schema\/person\/91b6b3b138fbba0efb4ae64b1abd81d7\",\"name\":\"root\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"ko-KR\",\"@id\":\"https:\/\/atmokpo.com\/w\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/708197b41fc6435a7ce22d951b25d4a47e9e904270cb1f04682d4f025066f80c?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/708197b41fc6435a7ce22d951b25d4a47e9e904270cb1f04682d4f025066f80c?s=96&d=mm&r=g\",\"caption\":\"root\"},\"sameAs\":[\"http:\/\/atmokpo.com\/w\"],\"url\":\"https:\/\/atmokpo.com\/w\/author\/root\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"React Course: Creating a React App - \ub77c\uc774\ube0c\uc2a4\ub9c8\ud2b8","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:\/\/atmokpo.com\/w\/32865\/","og_locale":"ko_KR","og_type":"article","og_title":"React Course: Creating a React App - \ub77c\uc774\ube0c\uc2a4\ub9c8\ud2b8","og_description":"React is currently one of the most popular JavaScript libraries, offering an efficient and flexible way to build user interfaces (UI). This course will guide you step-by-step in creating a simple web application using React. By completing this course, you will understand the fundamental concepts of React and be equipped to build real-world applications. 1. &hellip; \ub354 \ubcf4\uae30 \"React Course: Creating a React App\"","og_url":"https:\/\/atmokpo.com\/w\/32865\/","og_site_name":"\ub77c\uc774\ube0c\uc2a4\ub9c8\ud2b8","article_published_time":"2024-11-01T09:12:04+00:00","article_modified_time":"2024-11-01T11:21:42+00:00","author":"root","twitter_card":"summary_large_image","twitter_creator":"@bebubo4","twitter_site":"@bebubo4","twitter_misc":{"\uae00\uc4f4\uc774":"root","\uc608\uc0c1 \ub418\ub294 \ud310\ub3c5 \uc2dc\uac04":"5\ubd84"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/atmokpo.com\/w\/32865\/#article","isPartOf":{"@id":"https:\/\/atmokpo.com\/w\/32865\/"},"author":{"name":"root","@id":"https:\/\/atmokpo.com\/w\/#\/schema\/person\/91b6b3b138fbba0efb4ae64b1abd81d7"},"headline":"React Course: Creating a React App","datePublished":"2024-11-01T09:12:04+00:00","dateModified":"2024-11-01T11:21:42+00:00","mainEntityOfPage":{"@id":"https:\/\/atmokpo.com\/w\/32865\/"},"wordCount":758,"publisher":{"@id":"https:\/\/atmokpo.com\/w\/#organization"},"articleSection":["React basics course"],"inLanguage":"ko-KR"},{"@type":"WebPage","@id":"https:\/\/atmokpo.com\/w\/32865\/","url":"https:\/\/atmokpo.com\/w\/32865\/","name":"React Course: Creating a React App - \ub77c\uc774\ube0c\uc2a4\ub9c8\ud2b8","isPartOf":{"@id":"https:\/\/atmokpo.com\/w\/#website"},"datePublished":"2024-11-01T09:12:04+00:00","dateModified":"2024-11-01T11:21:42+00:00","breadcrumb":{"@id":"https:\/\/atmokpo.com\/w\/32865\/#breadcrumb"},"inLanguage":"ko-KR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/atmokpo.com\/w\/32865\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/atmokpo.com\/w\/32865\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"\ud648","item":"https:\/\/atmokpo.com\/w\/en\/"},{"@type":"ListItem","position":2,"name":"React Course: Creating a React App"}]},{"@type":"WebSite","@id":"https:\/\/atmokpo.com\/w\/#website","url":"https:\/\/atmokpo.com\/w\/","name":"\ub77c\uc774\ube0c\uc2a4\ub9c8\ud2b8","description":"","publisher":{"@id":"https:\/\/atmokpo.com\/w\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/atmokpo.com\/w\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"ko-KR"},{"@type":"Organization","@id":"https:\/\/atmokpo.com\/w\/#organization","name":"\ub77c\uc774\ube0c\uc2a4\ub9c8\ud2b8","url":"https:\/\/atmokpo.com\/w\/","logo":{"@type":"ImageObject","inLanguage":"ko-KR","@id":"https:\/\/atmokpo.com\/w\/#\/schema\/logo\/image\/","url":"https:\/\/atmokpo.com\/w\/wp-content\/uploads\/2024\/11\/logo.png","contentUrl":"https:\/\/atmokpo.com\/w\/wp-content\/uploads\/2024\/11\/logo.png","width":400,"height":400,"caption":"\ub77c\uc774\ube0c\uc2a4\ub9c8\ud2b8"},"image":{"@id":"https:\/\/atmokpo.com\/w\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/x.com\/bebubo4"]},{"@type":"Person","@id":"https:\/\/atmokpo.com\/w\/#\/schema\/person\/91b6b3b138fbba0efb4ae64b1abd81d7","name":"root","image":{"@type":"ImageObject","inLanguage":"ko-KR","@id":"https:\/\/atmokpo.com\/w\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/708197b41fc6435a7ce22d951b25d4a47e9e904270cb1f04682d4f025066f80c?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/708197b41fc6435a7ce22d951b25d4a47e9e904270cb1f04682d4f025066f80c?s=96&d=mm&r=g","caption":"root"},"sameAs":["http:\/\/atmokpo.com\/w"],"url":"https:\/\/atmokpo.com\/w\/author\/root\/"}]}},"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack-related-posts":[],"_links":{"self":[{"href":"https:\/\/atmokpo.com\/w\/wp-json\/wp\/v2\/posts\/32865","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/atmokpo.com\/w\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/atmokpo.com\/w\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/atmokpo.com\/w\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/atmokpo.com\/w\/wp-json\/wp\/v2\/comments?post=32865"}],"version-history":[{"count":1,"href":"https:\/\/atmokpo.com\/w\/wp-json\/wp\/v2\/posts\/32865\/revisions"}],"predecessor-version":[{"id":32866,"href":"https:\/\/atmokpo.com\/w\/wp-json\/wp\/v2\/posts\/32865\/revisions\/32866"}],"wp:attachment":[{"href":"https:\/\/atmokpo.com\/w\/wp-json\/wp\/v2\/media?parent=32865"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/atmokpo.com\/w\/wp-json\/wp\/v2\/categories?post=32865"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/atmokpo.com\/w\/wp-json\/wp\/v2\/tags?post=32865"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}