{"id":28901,"date":"2019-03-26T00:00:00","date_gmt":"2019-03-25T23:00:00","guid":{"rendered":"https:\/\/blexin.com\/?p=28901"},"modified":"2021-01-13T09:40:41","modified_gmt":"2021-01-13T08:40:41","slug":"kestrel-lanciami-i-componenti","status":"publish","type":"post","link":"https:\/\/blexin.com\/it\/blog\/kestrel-lanciami-i-componenti\/","title":{"rendered":"Kestrel, lanciami i componenti!"},"content":{"rendered":"\n
\"\"<\/figure>\n\n\n\n

Durante il lavoro di porting effettuato sul nostro CMS “WebRight” da ASP.NET MVC 5.0 a ASP.NET Core, mi sono imbattuto in un bel problema: la gestione delle widget di WebRight. Infatti, queste\u00a0erano gestite utilizzando delle Partial View che venivano renderizzate all’interno delle view tramite l’helper\u00a0HTML.RenderAction<\/strong>. Purtroppo, quest’ultimo non \u00e8 pi\u00f9 utilizzabile in ASP.NET Core.<\/p>\n\n\n\n

Niente paura comunque: per gestire questi casi d’uso, ASP.NET Core introduce i View Components, ovvero una nuova feature che permette di renderizzare HTML da una pagina Razor. Questi sono generati da una classe C# che estende la classe base ViewComponent<\/strong>, e sono tipicamente associati ad un file Razor per generare il markup che ci serve.<\/p>\n\n\n\n

L’idea \u00e8 di raccontarvi come scrivere dei View Component, usando Visual Studio 2017 e ASP.NET CORE, e come poi abbiamo portato questa nuova funzionalit\u00e0 in WebRight.<\/p>\n\n\n\n

Il primo passo \u00e8 creare una nuova Web Application ASP.NET CORE<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Quando ci viene chiesto il tipo di Web App da creare, scegliamo\u00a0Applicazione Web<\/strong>, che ci creer\u00e0 un semplice website utilizzando le nuove ASP.NET Core Razor pages.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Il template scelto crea per noi una struttura di cartelle ben definita, all’interno della quale\u00a0c’\u00e8 la directory\u00a0Pages<\/strong>. In questa creeremo una sottocartella dove\u00a0saranno presenti i nostri View Component.\u00a0<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Creiamo a questo punto una cartella\u00a0TestViewComponent,<\/strong>\u00a0che conterr\u00e0 un file C# e una Razor View Page che andranno a comporre il nostro View Component, e che chiameremo TestViewComponent.cs e Default.cshtml:\u00a0<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Implementiamo il nostro View Component (la nostra classe base), che avr\u00e0 un costruttore vuoto e un methodo Invoke con solo un parametro.<\/p>\n\n\n

\nusing Microsoft.AspNetCore.Mvc;\n\u00a0\nnamespace ViewComponentsExample.Pages.Components.TestViewComponent\n{\n\u00a0\u00a0\u00a0\u00a0public class TestViewComponentViewComponent : ViewComponent\n\u00a0\u00a0\u00a0\u00a0{\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0public TestViewComponentViewComponent() { }\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0public IViewComponentResult Invoke(string nome)\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0{\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0return View("Default", nome);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0}\n}\n<\/pre><\/div>\n\n\n
La nostra view Razor sar\u00e0 molto semplice, formata da solo due righe di codice. La prima ci dice di che tipo sar\u00e0 il modello che verr\u00e0 passato alla view, e la seconda renderizzer\u00e0 il modello in un tag h2<\/p>\n\n\n
\n@model string\n<h2>@Model<\/h2>\n<\/pre><\/div>\n\n\n
A questo punto abbiamo un View Component completo. Per utilizzarlo, possiamo usare una pagina Razor, proprio come facevamo con\u00a0HTML.RenderAction<\/strong>, quindi creiamo una nuova Razor View che chiamiamo\u00a0TestViewComponentPage<\/strong><\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
Possiamo visualizzare il nostro View Component in due modi: il primo consiste nel richiamare la classe con il metodo InvokeAsync<\/strong> e il secondo \u00e8 un tag HTML custom.<\/p>\n\n\n\n
Il primo metodo che vediamo \u00e8\u00a0InvokeAsync<\/strong>: a questo dobbiamo passare in input un primo parametro con il nome del component (nome della classe senza il suffisso ViewComponent) e il secondo parametro \u00e8 un tipo anonimo. Questa \u00e8 la nostra pagina completa:<\/p>\n\n\n
\n@page\n@model ViewComponentsExample.Pages.TestViewComponentPageModel\n\u00a0\n<body>\n\u00a0\u00a0\u00a0\u00a0<h1>Demo component Async<\/h1>\n\u00a0\u00a0\u00a0\u00a0@await Component.InvokeAsync("TestViewComponent", new {\n\u00a0\u00a0\u00a0\u00a0nome = "Mio primo componente"\n\u00a0\u00a0\u00a0\u00a0})\n<\/body>\n<\/pre><\/div>\n\n\n
Se avviamo l’applicazione, ecco il risultato di quanto scritto fino ad ora:<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
Come gi\u00e0 anticipato, esiste un altro modo per poter utilizzare i View Component all’interno delle nostre pagine Razor: possiamo creare un tag HTML custom da inserire nella pagina, funzionalit\u00e0 di ASP.NET Core che \u00e8 chiamata Tag Helpers<\/em>.<\/p>\n\n\n\n
Diamo uno sguardo a come utilizzare i Tag Helper per invocare il nostro View Component. Ecco di seguito come cambia la nostra pagina Razor rispetto alla precedente.<\/p>\n\n\n
\n@page\n@model ViewComponentsExample.Pages.TestViewComponentPageModel\n\u00a0\n@addTagHelper *, ViewComponentsExample\n<!DOCTYPE html>\n<html>\n<head>\n\u00a0\u00a0\u00a0\u00a0<meta name="viewport" content="width=device-width" \/>\n\u00a0\u00a0\u00a0\u00a0<title>Demo component con Tag helper<\/title>\n<\/head>\n<body>\n\u00a0\u00a0\u00a0\u00a0<h1>Demo component con Tag helper<\/h1>\n\u00a0\u00a0\u00a0\u00a0<vc:test-view-component nome="mio componente con tag helper">\n\u00a0\u00a0\u00a0\u00a0<\/vc:test-view-component>\n<\/body>\n<\/html>\n<\/pre><\/div>\n\n\n
Tutto quello che ho dovuto fare \u00e8 stato aggiungere la riga @addTagHelper*, ViewComponentsExample<\/strong> che semplicemente dice di utilizzare tutti i Tag Helper definiti ovunque nel mio assembly. A questo punto, posso referenziare il mio component nel body HTML con il prefisso vc per i view component<\/strong>. Il nome del tag non \u00e8 altro che il nome del nostro View Component diviso in Kebab casing (test-view-component). La parte migliore di questo approccio \u00e8 che non ho dovuto fare alcuna modifica al codice della mia classe per permettere al Tag Helper di funzionare!<\/p>\n\n\n\n
Come abbiamo usato tutto questo in\u00a0WebRight<\/strong>? La nostra precedente implementazione\u00a0gestiva le widget direttamente dal controller unico presente nel core dell’applicazione, utilizzando questo semplice codice:<\/p>\n\n\n
\n[HttpGet]\n[Route("widget\/{widget_name}", Name = "WebRightWidgetDefaultGet")]\npublic PartialViewResult Widget(string widget_name, WebRightWidgetArguments arguments)\n{\n\u00a0\u00a0\u00a0\u00a0IWebRightWidget widget = this.widgetFactory.GetWidgetByName(widget_name);\n\u00a0\n\u00a0\u00a0\u00a0\u00a0return PartialView(\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0string.Format("_{0}{1}", widget_name, arguments.ViewVersionName),\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0widget.GetViewModel(getCurrentCultureName(), arguments.Parameters));\n}\n<\/pre><\/div>\n\n\n
Questo approccio ci permetteva di scrivere degli html helper, in cui andavamo a specificare il nome della widget da richiamare e passare gli eventuali parametri che potessero servire allo scopo della widget. Ecco un esempio di codice di un helper che richiama la widget del Menu:<\/p>\n\n\n
\npublic static MvcHtmlString Menu(this HtmlHelper html, string categoryName, string viewVersionName = "")\n{\n\u00a0\u00a0\u00a0\u00a0return html.Action(\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0"Widget", \n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0"WebRightCms", \n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0new\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0{\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0widget_name = "WebRightMenuWidget",\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0arguments = new WebRightWidgetArguments\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0{\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0ViewVersionName = viewVersionName,\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0Parameters = new object[] { categoryName }\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0});\n}\n<\/pre><\/div>\n\n\n
Queste due sezioni di codice presentate ci permettevano di renderizzare una widget in modo semplice in qualunque Page della nostra applicazione:<\/p>\n\n\n
\n@Html.Menu("mainNavigationMenu")\n<\/pre><\/div>\n\n\n
Come abbiamo modificato questo comportamento per utilizzare i nuovi View Component di ASP.NET Core? Di seguito il nostro View Component, che va a sostituire l’action Widget del controller che vi ho descritto:<\/p>\n\n\n
\npublic class WidgetViewComponent : ViewComponent\n{\n\u00a0\u00a0\u00a0\u00a0private readonly IWebRightWidgetFactory widgetFactory = null;\n\u00a0\n\u00a0\u00a0\u00a0\u00a0public WidgetViewComponent(IWebRightWidgetFactory wf)\n\u00a0\u00a0\u00a0\u00a0{\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0this.widgetFactory = wf;\n\u00a0\u00a0\u00a0\u00a0}\n\u00a0\n\u00a0\u00a0\u00a0\u00a0public async Task<IViewComponentResult> InvokeAsync(string name, string culture = null, string viewVersionName = null, object[] parameters = null)\n\u00a0\u00a0\u00a0\u00a0{\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0IWebRightWidget widget = this.widgetFactory.GetWidgetByName(name);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0return View($"{name + viewVersionName}", widget.GetViewModel(culture, parameters));\n\u00a0\u00a0\u00a0\u00a0}\n}\n<\/pre><\/div>\n\n\n
Come vedete, la classe \u00e8 relativamente semplice: ha un metodo InvokeAsync che viene richiamato con dei parametri (alcuni di questi erano quelli utilizzati sulla action Widget del controller).<\/p>\n\n\n\n
Quello che ci manca adesso \u00e8 sostituire l’utilizzo degli Html Helper. Anche questa modifica risulta abbastanza semplice:\u00a0tutto quello che serve \u00e8 richiamare il metodo InvokeAsync all’interno di una nostra pagina Razor, in modo da renderizzare la widget che ci serve.\u00a0Ecco un esempio di utilizzo:<\/p>\n\n\n
\n<h1>TEST PAGE ANCORA<\/h1>\n\u00a0\n@await Component.InvokeAsync("Widget", new { name = "TestWidget" })\n<\/pre><\/div>\n\n\n
Come spiegato precedentemente, preferisco l’approccio con i TagHelper per renderizzare i ViewComponent.\u00a0Facciamo, quindi, un’altra piccola modifica alla nostra page, che diventer\u00e0:<\/p>\n\n\n
\n<h1>TEST PAGE ANCORA<\/h1>\n\u00a0\n<vc:widget name="TestWidget"><\/vc:widget>\n<\/pre><\/div>\n\n\n
Per inizializzare i TagHelper non ho fatto altro che aggiungere questa riga nella pagina Layout dell’applicazione:<\/p>\n\n\n
\n@addTagHelper *, WebRight\n<\/pre><\/div>\n\n\n
Con questo concludiamo la panoramica sull’utilizzo dei View Component, spero di aver stimolato la vostra curiosit\u00e0 su questa funzionalit\u00e0 di ASP.NET Core.<\/p>\n\n\n\n
Alla prossima!<\/p>\n\n\n\n\n","protected":false},"excerpt":{"rendered":"
Convertiamo le Partial View di ASP.NET MVC con i View Component di ASP.NET Core<\/p>\n","protected":false},"author":196716246,"featured_media":28902,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"off","_et_pb_old_content":"","_et_gb_content_width":"","_coblocks_attr":"","_coblocks_dimensions":"","_coblocks_responsive_height":"","_coblocks_accordion_ie_support":"","_crdt_document":"","inline_featured_image":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_feature_clip_id":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2},"_wpas_customize_per_network":false,"jetpack_post_was_ever_published":false},"categories":[688637374],"tags":[688637414,688637441],"class_list":["post-28901","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog","tag-asp-net-core","tag-webright"],"yoast_head":"\nKestrel, lanciami i componenti! - Blexin<\/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:\/\/blexin.com\/it\/blog\/kestrel-lanciami-i-componenti\/\" \/>\n<meta property=\"og:locale\" content=\"it_IT\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Kestrel, lanciami i componenti! - Blexin\" \/>\n<meta property=\"og:description\" content=\"Convertiamo le Partial View di ASP.NET MVC con i View Component di ASP.NET Core\" \/>\n<meta property=\"og:url\" content=\"https:\/\/blexin.com\/it\/blog\/kestrel-lanciami-i-componenti\/\" \/>\n<meta property=\"og:site_name\" content=\"Blexin\" \/>\n<meta property=\"article:published_time\" content=\"2019-03-25T23:00:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-01-13T08:40:41+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/i2.wp.com\/blexin.com\/wp-content\/uploads\/2020\/12\/053fe30c-dd90-42a6-9036-c1a5269a7f43.png?fit=1024%2C608&ssl=1\" \/>\n\t<meta property=\"og:image:width\" content=\"1024\" \/>\n\t<meta property=\"og:image:height\" content=\"608\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Francesco de Vicariis\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Scritto da\" \/>\n\t<meta name=\"twitter:data1\" content=\"Francesco de Vicariis\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tempo di lettura stimato\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minuti\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/kestrel-lanciami-i-componenti\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/kestrel-lanciami-i-componenti\\\/\"},\"author\":{\"name\":\"Francesco de Vicariis\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/#\\\/schema\\\/person\\\/6f8514ed8b0d3be31369ca5436c4781f\"},\"headline\":\"Kestrel, lanciami i componenti!\",\"datePublished\":\"2019-03-25T23:00:00+00:00\",\"dateModified\":\"2021-01-13T08:40:41+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/kestrel-lanciami-i-componenti\\\/\"},\"wordCount\":854,\"image\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/kestrel-lanciami-i-componenti\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/blexin.com\\\/wp-content\\\/uploads\\\/2020\\\/12\\\/053fe30c-dd90-42a6-9036-c1a5269a7f43.png?fit=1024%2C608&ssl=1\",\"keywords\":[\"Asp.net core\",\"Webright\"],\"articleSection\":[\"Blog\"],\"inLanguage\":\"it-IT\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/kestrel-lanciami-i-componenti\\\/\",\"url\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/kestrel-lanciami-i-componenti\\\/\",\"name\":\"Kestrel, lanciami i componenti! - Blexin\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/kestrel-lanciami-i-componenti\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/kestrel-lanciami-i-componenti\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/blexin.com\\\/wp-content\\\/uploads\\\/2020\\\/12\\\/053fe30c-dd90-42a6-9036-c1a5269a7f43.png?fit=1024%2C608&ssl=1\",\"datePublished\":\"2019-03-25T23:00:00+00:00\",\"dateModified\":\"2021-01-13T08:40:41+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/#\\\/schema\\\/person\\\/6f8514ed8b0d3be31369ca5436c4781f\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/kestrel-lanciami-i-componenti\\\/#breadcrumb\"},\"inLanguage\":\"it-IT\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/kestrel-lanciami-i-componenti\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/kestrel-lanciami-i-componenti\\\/#primaryimage\",\"url\":\"https:\\\/\\\/i0.wp.com\\\/blexin.com\\\/wp-content\\\/uploads\\\/2020\\\/12\\\/053fe30c-dd90-42a6-9036-c1a5269a7f43.png?fit=1024%2C608&ssl=1\",\"contentUrl\":\"https:\\\/\\\/i0.wp.com\\\/blexin.com\\\/wp-content\\\/uploads\\\/2020\\\/12\\\/053fe30c-dd90-42a6-9036-c1a5269a7f43.png?fit=1024%2C608&ssl=1\",\"width\":1024,\"height\":608},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/kestrel-lanciami-i-componenti\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/blexin.com\\\/it\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Kestrel, lanciami i componenti!\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/#website\",\"url\":\"https:\\\/\\\/blexin.com\\\/it\\\/\",\"name\":\"Blexin\",\"description\":\"Con noi \u00e8 semplice\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/blexin.com\\\/it\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"it-IT\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/#\\\/schema\\\/person\\\/6f8514ed8b0d3be31369ca5436c4781f\",\"name\":\"Francesco de Vicariis\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/b3a3164fd0b28d429cd427aafae38a687a41a250a2bccf4ab3b0744138afd64e?s=96&d=identicon&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/b3a3164fd0b28d429cd427aafae38a687a41a250a2bccf4ab3b0744138afd64e?s=96&d=identicon&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/b3a3164fd0b28d429cd427aafae38a687a41a250a2bccf4ab3b0744138afd64e?s=96&d=identicon&r=g\",\"caption\":\"Francesco de Vicariis\"},\"url\":\"https:\\\/\\\/blexin.com\\\/it\\\/author\\\/francesco-devicariisblexin-com\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Kestrel, lanciami i componenti! - Blexin","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:\/\/blexin.com\/it\/blog\/kestrel-lanciami-i-componenti\/","og_locale":"it_IT","og_type":"article","og_title":"Kestrel, lanciami i componenti! - Blexin","og_description":"Convertiamo le Partial View di ASP.NET MVC con i View Component di ASP.NET Core","og_url":"https:\/\/blexin.com\/it\/blog\/kestrel-lanciami-i-componenti\/","og_site_name":"Blexin","article_published_time":"2019-03-25T23:00:00+00:00","article_modified_time":"2021-01-13T08:40:41+00:00","og_image":[{"width":1024,"height":608,"url":"https:\/\/i2.wp.com\/blexin.com\/wp-content\/uploads\/2020\/12\/053fe30c-dd90-42a6-9036-c1a5269a7f43.png?fit=1024%2C608&ssl=1","type":"image\/png"}],"author":"Francesco de Vicariis","twitter_card":"summary_large_image","twitter_misc":{"Scritto da":"Francesco de Vicariis","Tempo di lettura stimato":"5 minuti"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/blexin.com\/it\/blog\/kestrel-lanciami-i-componenti\/#article","isPartOf":{"@id":"https:\/\/blexin.com\/it\/blog\/kestrel-lanciami-i-componenti\/"},"author":{"name":"Francesco de Vicariis","@id":"https:\/\/blexin.com\/it\/#\/schema\/person\/6f8514ed8b0d3be31369ca5436c4781f"},"headline":"Kestrel, lanciami i componenti!","datePublished":"2019-03-25T23:00:00+00:00","dateModified":"2021-01-13T08:40:41+00:00","mainEntityOfPage":{"@id":"https:\/\/blexin.com\/it\/blog\/kestrel-lanciami-i-componenti\/"},"wordCount":854,"image":{"@id":"https:\/\/blexin.com\/it\/blog\/kestrel-lanciami-i-componenti\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/blexin.com\/wp-content\/uploads\/2020\/12\/053fe30c-dd90-42a6-9036-c1a5269a7f43.png?fit=1024%2C608&ssl=1","keywords":["Asp.net core","Webright"],"articleSection":["Blog"],"inLanguage":"it-IT"},{"@type":"WebPage","@id":"https:\/\/blexin.com\/it\/blog\/kestrel-lanciami-i-componenti\/","url":"https:\/\/blexin.com\/it\/blog\/kestrel-lanciami-i-componenti\/","name":"Kestrel, lanciami i componenti! - Blexin","isPartOf":{"@id":"https:\/\/blexin.com\/it\/#website"},"primaryImageOfPage":{"@id":"https:\/\/blexin.com\/it\/blog\/kestrel-lanciami-i-componenti\/#primaryimage"},"image":{"@id":"https:\/\/blexin.com\/it\/blog\/kestrel-lanciami-i-componenti\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/blexin.com\/wp-content\/uploads\/2020\/12\/053fe30c-dd90-42a6-9036-c1a5269a7f43.png?fit=1024%2C608&ssl=1","datePublished":"2019-03-25T23:00:00+00:00","dateModified":"2021-01-13T08:40:41+00:00","author":{"@id":"https:\/\/blexin.com\/it\/#\/schema\/person\/6f8514ed8b0d3be31369ca5436c4781f"},"breadcrumb":{"@id":"https:\/\/blexin.com\/it\/blog\/kestrel-lanciami-i-componenti\/#breadcrumb"},"inLanguage":"it-IT","potentialAction":[{"@type":"ReadAction","target":["https:\/\/blexin.com\/it\/blog\/kestrel-lanciami-i-componenti\/"]}]},{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/blexin.com\/it\/blog\/kestrel-lanciami-i-componenti\/#primaryimage","url":"https:\/\/i0.wp.com\/blexin.com\/wp-content\/uploads\/2020\/12\/053fe30c-dd90-42a6-9036-c1a5269a7f43.png?fit=1024%2C608&ssl=1","contentUrl":"https:\/\/i0.wp.com\/blexin.com\/wp-content\/uploads\/2020\/12\/053fe30c-dd90-42a6-9036-c1a5269a7f43.png?fit=1024%2C608&ssl=1","width":1024,"height":608},{"@type":"BreadcrumbList","@id":"https:\/\/blexin.com\/it\/blog\/kestrel-lanciami-i-componenti\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/blexin.com\/it\/"},{"@type":"ListItem","position":2,"name":"Kestrel, lanciami i componenti!"}]},{"@type":"WebSite","@id":"https:\/\/blexin.com\/it\/#website","url":"https:\/\/blexin.com\/it\/","name":"Blexin","description":"Con noi \u00e8 semplice","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/blexin.com\/it\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"it-IT"},{"@type":"Person","@id":"https:\/\/blexin.com\/it\/#\/schema\/person\/6f8514ed8b0d3be31369ca5436c4781f","name":"Francesco de Vicariis","image":{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/secure.gravatar.com\/avatar\/b3a3164fd0b28d429cd427aafae38a687a41a250a2bccf4ab3b0744138afd64e?s=96&d=identicon&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/b3a3164fd0b28d429cd427aafae38a687a41a250a2bccf4ab3b0744138afd64e?s=96&d=identicon&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/b3a3164fd0b28d429cd427aafae38a687a41a250a2bccf4ab3b0744138afd64e?s=96&d=identicon&r=g","caption":"Francesco de Vicariis"},"url":"https:\/\/blexin.com\/it\/author\/francesco-devicariisblexin-com\/"}]}},"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/blexin.com\/wp-content\/uploads\/2020\/12\/053fe30c-dd90-42a6-9036-c1a5269a7f43.png?fit=1024%2C608&ssl=1","jetpack_shortlink":"https:\/\/wp.me\/pcyUBx-7w9","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/posts\/28901","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/users\/196716246"}],"replies":[{"embeddable":true,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/comments?post=28901"}],"version-history":[{"count":8,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/posts\/28901\/revisions"}],"predecessor-version":[{"id":28923,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/posts\/28901\/revisions\/28923"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/media\/28902"}],"wp:attachment":[{"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/media?parent=28901"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/categories?post=28901"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/tags?post=28901"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}