{"id":1243,"date":"2019-03-25T12:53:12","date_gmt":"2019-03-25T11:53:12","guid":{"rendered":"https:\/\/zaven.co\/blog\/?p=1243"},"modified":"2025-04-08T19:55:07","modified_gmt":"2025-04-08T17:55:07","slug":"angular-7-tutorial-learn-angular-7-by-example","status":"publish","type":"post","link":"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/","title":{"rendered":"Angular 7 tutorial: learn Angular 7 by example"},"content":{"rendered":"\n

Angular 7 – what are the new improvements and features? Keep on reading this Angular 7 tutorial and create your own web application with me to learn more about this modern web framework by example.<\/p>\n\n\n\n\n\n\n\n

When you\u2019re talking about modern web frameworks, it’s hard not to mention Angular. It belongs to one of the top most popular web technologies. The premiere of the latest version, Angular 7, induced me to write this article.<\/p>\n\n\n\n

Being the seventh version of a technology from Google may discourage you from learning – especially newer developers. Because, \u201cHey? What was so special about the previous six versions anyway?\u201d We don\u2019t necessarily have to worry about what and when something was added.<\/p>\n\n\n\n

However, Google programmers haven\u2019t wasted time. They have presented us with, maybe not a revolution<\/em>, but the evolution<\/em> of a solution that will surely appeal to you.<\/p>\n\n\n\n

How can you find out more? It’s best to create your own application and see the advantages and disadvantages of the technology for yourself. In the further part of the article, I will create such an application with you, so that you can see that new developers should not be afraid of Angular.<\/p>\n\n\n\n

Angular 7 tutorial: how to start<\/span>?<\/span><\/h2>\n\n\n\n

To start having fun with new Angular 7, it will be necessary to prepare the appropriate tools. The first and most important one is Node.js. We will need it to launch our application. It is worth mentioning, that by installing Node.js we gain access to the Node Packaged Module – in short: npm.<\/p>\n\n\n\n

The IDE editor will be the second crucial tool to work with. For your own convenience, I recommend one with a built-in terminal. If you use Visual Studio Code, I recommend installing the ‘Angular Extension Pack’ extension, which will definitely make your work easier.<\/p>\n\n\n\n

Angular 7 by example: Angular CLI<\/h2>\n\n\n\n

Angular CLI – what exactly is it? This is another tool that will make working with Angular simpler, faster and more enjoyable. The task of Angular CLI is to create and manage our project. It automates many activities using a dedicated command-line interface.<\/p>\n\n\n\n

Angular CLI installation:<\/p>\n\n\n\n

We have to first install it in order to use it. For this operation, we will need the aforementioned package manager. Just open the terminal and execute the command:<\/p>\n\n\n\n

npm install -g @angular\/cli<\/code><\/p>\n\n\n\n

Having our “command center”, we can now manage our application. First of all, you have to create it to be able to manage it. Here we will use one of the commands we acquired along with the command line installation of Angular.<\/p>\n\n\n\n

Angular 7 guide<\/span>: <\/span>create the project<\/span><\/h2>\n\n\n\n

Having prepared the environment, we can proceed to the creation of the project. We do this with the previously installed Angular CLI and one of its commands – namely:<\/p>\n\n\n\n

ng new <project-name><\/code><\/p>\n\n\n\n

We should enter the name of our project here <project-name><\/code>. In my case, it will be ‘application’.<\/p>\n\n\n\n

In doing this command, Angular CLI will ask us if we want to use angular routing.<\/p>\n\n\n\n

In this case, we will not use it as its presence will not be relevant to us. The answer to this question is therefore arbitrary.<\/p>\n\n\n\n

In the next question, we will have to choose our CSS precompiler. If you do not know what CSS precompilers are, then I encourage you to Google the phrase and get to know them; they really make our work more efficient! Here, I have chosen SCSS.<\/p>\n\n\n\n

After answering this question, the creation of our project is initiated. After a while, we should see a message regarding added dependencies and the creation of the whole project. To make sure everything has been done correctly, we can go to the directory with our application using the following command in the terminal: cd <project-name> and then executing the command: ng serve. In this way, we launch our application that has just been generated by Angular CLI. This is what it should look like in the terminal:<\/p>\n\n\n\n

\"Angular<\/figure><\/div>\n\n\n\n

As you can see, our application has been launched locally on port 4200. After going to the website: http:\/\/localhost:4200\/<\/a> , we should see the homepage of the Angular web app<\/em>, which looks like this:<\/p>\n\n\n\n

\"Angular<\/figure><\/div>\n\n\n\n

Bravo! You have taken your first step in Angular! However, do not rest on your laurels just yet; you still have to learn a lot of things about what the CLI has generated and how to manage it all.<\/p>\n\n\n\n

Angular 7 tutorial: file structure<\/h2>\n\n\n\n

Let’s talk about what has just been created in the directory of our application. Open it in the IDE and look at the file structure:<\/p>\n\n\n\n

\"Angular<\/figure><\/div>\n\n\n\n

First of all, I encourage you to read the README.md<\/code> file, where you will find all the necessary commands needed to work with the application as well as a link to the documentation of Angular.<\/p>\n\n\n\n

Apart from all this, you will see a very standard division: we have the ‘e2e’ folder where our UI tests are located as well as a directory with ‘node-modules’ dependencies, the content of which is controlled by the package.json<\/code> file. Let’s stop for a moment here. This is the place where we can find out what our application uses and in which version.<\/p>\n\n\n\n

\"dependencies\": { \n    \"@angular\/animations\": \"~7.0.0\", \n    \"@angular\/common\": \"~7.0.0\", \n    \"@angular\/compiler\": \"~7.0.0\", \n    \"@angular\/core\": \"~7.0.0\",\n    \"@angular\/forms\": \"~7.0.0\",\n    \"@angular\/http\": \"~7.0.0\", \n    \"@angular\/platform-browser\": \"~7.0.0\",\n    \"@angular\/platform-browser-dynamic\": \"~7.0.0\", \n    \"@angular\/router\": \"~7.0.0\",\n    \"core-js\": \"^2.5.4\",\n    \"rxjs\": \"~6.3.3\",\n    \"zone.js\": \"~0.8.26\"\n}<\/code><\/pre>\n\n\n\n
At this point, we can once again make sure that we are using the latest version of Angular.<\/p>\n\n\n\n
The third directory is the heart of our application: the ‘src’ folder. This is where we find the main controller, style files and the configuration file of our unit tests. We should pay attention to folders with components and especially the one called ‘app’.<\/p>\n\n\n\n
\"Angular<\/figure><\/div>\n\n\n\n
What does our Angular component consist of? By default, Angular CLI creates its view (.html) in the component’s directory. It corresponds to the style file (.scss) and the logic contained in the file with the .ts extension. These three files will be the most interesting for us at the moment.<\/p>\n\n\n\n
Perhaps you may be asking yourself now: Why such a division? What are these components designed for?<\/p>\n\n\n\n
Angular 7 tutorial: components<\/h2>\n\n\n\n
They have one goal: to keep order. It\u2019s easier for us to understand how a complicated system works if we look at each of its small parts separately, rather than if we analyze it as a monolithic whole.<\/p>\n\n\n\n
An analogy to Lego blocks works great here. Each Lego building has a finite number of individual blocks. The individual blocks combine into larger combinations creating elements of our construction. Cooperation between selected elements is also necessary; not all of them can be easily combined. In addition, pre-created combinations can be reused; for example, towers in the castle. Nothing prevents you from experimenting with different combinations.<\/p>\n\n\n\n
\"Angular<\/figure><\/div>\n\n\n\n
The creation of web applications<\/em> too can be so simple and natural. With this newly acquired knowledge, let’s take a look at the ‘app’ component again. Let’s color the background of its content blue:
<\/p>\n\n\n\n
In our case, the ‘app’ component is the only one in the application and it is responsible for displaying the entire page. How can we expand our structure? It\u2019s simple – all we need to do is return to our “command center”. Angular CLI<\/em> enables us to create new components from the terminal level. All you have to do is execute the following command in the directory of our project:<\/p>\n\n\n\n
ng generate component <component-name><\/code><\/p>\n\n\n\n
Here <component-name><\/code>, we enter the name of our new component. In my case, it will be ‘list’ because I would like to put my shopping list for tomorrow there. I would like to encourage you to read the documentation of Angular CLI<\/em> which you will find here. Let\u2019s return to our new component. After executing the aforementioned command in your ‘src’ directory, you should see the newly created component. I put my list in its view:<\/p>\n\n\n\n
<div style=\"background-color: bisque; border: 3px dashed black\">\n<ul>\n  <li>Coffee<\/li>\n  <li>Tea<\/li>\n  <li>Milk<\/li>\n  <li>Tomatoes<\/li>\n<\/ul>\n<\/div><\/code><\/pre>\n\n\n\n
Now, to make our component visible, we need to place it somewhere. It is assumed that the parent of all components is the ‘app’ component, which we already have. Let’s put our list in it and remove unnecessary logos and links at the same time:<\/p>\n\n\n\n
<div style=\"background-color: cornflowerblue; border: 3px dashed black;\">\n<div style=\"text-align:center\">\n<h1>\n   Welcome to {{ title }}!\n<\/h1>\n<\/div><\n<app-list><\/app-list>\n<\/div><\/code><\/pre>\n\n\n\n
\"Angular<\/figure><\/div>\n\n\n\n
Now we should have the following view:
<\/p>\n\n\n\n
This perfectly illustrates an example of nested components. We can easily distinguish a parent (the blue \u2018app\u2019 component) and its child (the \u2018list\u2019 component, which has a yellow background). In this way, we have created our first component.<\/p>\n\n\n\n
Angular 7 tutorial: summary<\/h2>\n\n\n\n
Congrats: you\u2019ve created your first web application in Angular 7<\/em>! I hope you know more about this modern web framework now. How do you like it? Let me know in the comments below. Please have a look at other web development article<\/a> on our blog. In the next part of this Angular 7<\/em> guide, we’ll deal with the data display in the components, based on the directives available in the latest Angular.<\/p>\n","protected":false},"excerpt":{"rendered":"
Angular 7 – what are the new improvements and features? Keep on reading this Angular 7 tutorial and create your own web application with me to learn more about this modern web framework by example.<\/p>\n","protected":false},"author":17,"featured_media":1240,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5,58],"tags":[134,132,135,8,41,149,120],"class_list":["post-1243","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutorials","category-web-development","tag-angular","tag-angular-7","tag-angular-7-tutorial","tag-tutorial","tag-web-app","tag-web-applications","tag-web-development"],"yoast_head":"\nAngular 7. Tutorial, guide by example - step by step | Zaven Blog<\/title>\n<meta name=\"description\" content=\"Angular 7, a popular JavaScript framework, has brand new features which may become unclear for developer. If you need guidance, check our tutorial to find out more.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Angular 7. Tutorial, guide by example - step by step | Zaven Blog\" \/>\n<meta property=\"og:description\" content=\"Angular 7, a popular JavaScript framework, has brand new features which may become unclear for developer. If you need guidance, check our tutorial to find out more.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/\" \/>\n<meta property=\"og:site_name\" content=\"Zaven Blog\" \/>\n<meta property=\"article:published_time\" content=\"2019-03-25T11:53:12+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-04-08T17:55:07+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/zaven.co\/blog\/wp-content\/uploads\/2019\/02\/cover-photo.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1100\" \/>\n\t<meta property=\"og:image:height\" content=\"670\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Krzysztof Drozdowski\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Krzysztof Drozdowski\" \/>\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\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/\",\"url\":\"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/\",\"name\":\"Angular 7. Tutorial, guide by example - step by step | Zaven Blog\",\"isPartOf\":{\"@id\":\"https:\/\/zaven.co\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/zaven.co\/blog\/wp-content\/uploads\/2019\/02\/cover-photo.png\",\"datePublished\":\"2019-03-25T11:53:12+00:00\",\"dateModified\":\"2025-04-08T17:55:07+00:00\",\"author\":{\"@id\":\"https:\/\/zaven.co\/blog\/#\/schema\/person\/ce9c43181e836f7b725ab870a313d932\"},\"description\":\"Angular 7, a popular JavaScript framework, has brand new features which may become unclear for developer. If you need guidance, check our tutorial to find out more.\",\"breadcrumb\":{\"@id\":\"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/#primaryimage\",\"url\":\"https:\/\/zaven.co\/blog\/wp-content\/uploads\/2019\/02\/cover-photo.png\",\"contentUrl\":\"https:\/\/zaven.co\/blog\/wp-content\/uploads\/2019\/02\/cover-photo.png\",\"width\":1100,\"height\":670,\"caption\":\"Angular 7 tutorial\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/zaven.co\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Angular 7 tutorial: learn Angular 7 by example\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/zaven.co\/blog\/#website\",\"url\":\"https:\/\/zaven.co\/blog\/\",\"name\":\"Zaven Blog\",\"description\":\"Software development blog. Generative AI, web & mobile applications.\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/zaven.co\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/zaven.co\/blog\/#\/schema\/person\/ce9c43181e836f7b725ab870a313d932\",\"name\":\"Krzysztof Drozdowski\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/zaven.co\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/d21608fdf3830e2637a3795eacfb34f2?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/d21608fdf3830e2637a3795eacfb34f2?s=96&d=mm&r=g\",\"caption\":\"Krzysztof Drozdowski\"},\"description\":\"Krzysztof is our front-end developer who mostly develops web applications at Zaven. Recently, he has been testing the latest version of Angular in practice. And he is taking his first steps as a blogger too!\",\"sameAs\":[\"https:\/\/www.linkedin.com\/in\/krzysztof-drozdowski-24b9ba14b\/?originalSubdomain=pl\"],\"url\":\"https:\/\/zaven.co\/blog\/author\/krzysztof\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Angular 7. Tutorial, guide by example - step by step | Zaven Blog","description":"Angular 7, a popular JavaScript framework, has brand new features which may become unclear for developer. If you need guidance, check our tutorial to find out more.","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:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/","og_locale":"en_US","og_type":"article","og_title":"Angular 7. Tutorial, guide by example - step by step | Zaven Blog","og_description":"Angular 7, a popular JavaScript framework, has brand new features which may become unclear for developer. If you need guidance, check our tutorial to find out more.","og_url":"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/","og_site_name":"Zaven Blog","article_published_time":"2019-03-25T11:53:12+00:00","article_modified_time":"2025-04-08T17:55:07+00:00","og_image":[{"width":1100,"height":670,"url":"https:\/\/zaven.co\/blog\/wp-content\/uploads\/2019\/02\/cover-photo.png","type":"image\/png"}],"author":"Krzysztof Drozdowski","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Krzysztof Drozdowski","Est. reading time":"8 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/","url":"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/","name":"Angular 7. Tutorial, guide by example - step by step | Zaven Blog","isPartOf":{"@id":"https:\/\/zaven.co\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/#primaryimage"},"image":{"@id":"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/#primaryimage"},"thumbnailUrl":"https:\/\/zaven.co\/blog\/wp-content\/uploads\/2019\/02\/cover-photo.png","datePublished":"2019-03-25T11:53:12+00:00","dateModified":"2025-04-08T17:55:07+00:00","author":{"@id":"https:\/\/zaven.co\/blog\/#\/schema\/person\/ce9c43181e836f7b725ab870a313d932"},"description":"Angular 7, a popular JavaScript framework, has brand new features which may become unclear for developer. If you need guidance, check our tutorial to find out more.","breadcrumb":{"@id":"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/#primaryimage","url":"https:\/\/zaven.co\/blog\/wp-content\/uploads\/2019\/02\/cover-photo.png","contentUrl":"https:\/\/zaven.co\/blog\/wp-content\/uploads\/2019\/02\/cover-photo.png","width":1100,"height":670,"caption":"Angular 7 tutorial"},{"@type":"BreadcrumbList","@id":"https:\/\/zaven.co\/blog\/angular-7-tutorial-learn-angular-7-by-example\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/zaven.co\/blog\/"},{"@type":"ListItem","position":2,"name":"Angular 7 tutorial: learn Angular 7 by example"}]},{"@type":"WebSite","@id":"https:\/\/zaven.co\/blog\/#website","url":"https:\/\/zaven.co\/blog\/","name":"Zaven Blog","description":"Software development blog. Generative AI, web & mobile applications.","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/zaven.co\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/zaven.co\/blog\/#\/schema\/person\/ce9c43181e836f7b725ab870a313d932","name":"Krzysztof Drozdowski","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/zaven.co\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/d21608fdf3830e2637a3795eacfb34f2?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/d21608fdf3830e2637a3795eacfb34f2?s=96&d=mm&r=g","caption":"Krzysztof Drozdowski"},"description":"Krzysztof is our front-end developer who mostly develops web applications at Zaven. Recently, he has been testing the latest version of Angular in practice. And he is taking his first steps as a blogger too!","sameAs":["https:\/\/www.linkedin.com\/in\/krzysztof-drozdowski-24b9ba14b\/?originalSubdomain=pl"],"url":"https:\/\/zaven.co\/blog\/author\/krzysztof\/"}]}},"_links":{"self":[{"href":"https:\/\/zaven.co\/blog\/wp-json\/wp\/v2\/posts\/1243","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/zaven.co\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/zaven.co\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/zaven.co\/blog\/wp-json\/wp\/v2\/users\/17"}],"replies":[{"embeddable":true,"href":"https:\/\/zaven.co\/blog\/wp-json\/wp\/v2\/comments?post=1243"}],"version-history":[{"count":25,"href":"https:\/\/zaven.co\/blog\/wp-json\/wp\/v2\/posts\/1243\/revisions"}],"predecessor-version":[{"id":69934,"href":"https:\/\/zaven.co\/blog\/wp-json\/wp\/v2\/posts\/1243\/revisions\/69934"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/zaven.co\/blog\/wp-json\/wp\/v2\/media\/1240"}],"wp:attachment":[{"href":"https:\/\/zaven.co\/blog\/wp-json\/wp\/v2\/media?parent=1243"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/zaven.co\/blog\/wp-json\/wp\/v2\/categories?post=1243"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/zaven.co\/blog\/wp-json\/wp\/v2\/tags?post=1243"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}