{"id":109405,"date":"2024-05-29T09:12:00","date_gmt":"2024-05-29T16:12:00","guid":{"rendered":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/?post_type=power-apps&#038;p=109405"},"modified":"2024-06-12T20:16:43","modified_gmt":"2024-06-13T03:16:43","slug":"introducing-code-view-in-power-apps-studio-public-preview","status":"publish","type":"power-apps","link":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/","title":{"rendered":"Introducing Code View in Power Apps Studio (Public Preview)"},"content":{"rendered":"\n<p>The goal of&nbsp;<a href=\"https:\/\/learn.microsoft.com\/power-platform\/developer\/fusion-development\">fusion development<\/a>&nbsp;is to create an environment where Citizen Developers, Professional developers (aka code-first) and IT Professional can collaborate seamlessly. We want to create great experience for makers creating an app for the first time and for code-first developers that want to have the transparency of the source code for their Power Apps.<\/p>\n\n\n\n<p><strong>We are proud to announce the public preview of a Code View in Power Apps Studio.<\/strong><\/p>\n\n\n\n<p>Developers can now view and use the source code, in readable YAML + Power Fx format.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2024\/05\/PowerApps-code-view.png\" alt=\"Power Apps Code View\" class=\"wp-image-27970\"\/><\/figure>\n\n\n\n<p>You can select any screen or specific control and visualize the underlying code.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"copy-and-paste-with-yaml-code\">Copy and paste with YAML code<\/h2>\n\n\n\n<p>Having the source code available will also allow new experiences. Developers can now copy any control in a code format. You can copy any visual control within Studio as a YAML Code.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2024\/05\/PAStudio-CopyCode.gif\" alt=\"\" class=\"wp-image-27975\"\/><\/figure>\n\n\n\n<p>With the copy from Power Apps Studio, you can paste it to a text or to a code editor like Visual Studio Code to do small edits. Once you are done, you can paste it back to Power Apps Studio to create a new control.<\/p>\n\n\n\n<p>You can share code snippets over Instant Message (like Microsoft Teams), email, post the code on a blog, use it to ask or answer questions in a forum or community.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2024\/05\/PAStudio-PasteCode.gif\" alt=\"\" class=\"wp-image-27976\"\/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"what-is-next\">What is next?<\/h2>\n\n\n\n<p>Code view and copying and pasting with code&nbsp;<a href=\"https:\/\/learn.microsoft.com\/en-us\/power-apps\/maker\/canvas-apps\/code-view\">is available in Preview<\/a>&nbsp;today.<\/p>\n\n\n\n<p>The copy used in this sample is below. Try to paste it to you Power App now!<\/p>\n\n\n\n<blockquote class=\"wp-block-quote blockquote is-layout-flow wp-block-quote blockquote-is-layout-flow\">\n<pre class=\"wp-block-preformatted\">- Header1:\n   Control: Header\n   Properties:\n      IsLogoVisible: =false\n      Title: =$\"Welcome to Code View, {User().FullName}\"\n<\/pre>\n<\/blockquote>\n\n\n\n<p>This is just the first step to create more experiences for code-first developers in Power Apps Studio. We\u2019ll support editing directly in the Studio soon as well, keep an eye out. Your code is also going to be available natively to your source code solutions, giving you transparency around changes like any other software project.<\/p>\n\n\n\n<p><strong>More content from Microsoft Build 2024<\/strong><\/p>\n\n\n\n<p><a href=\"https:\/\/build.microsoft.com\/en-US\/sessions\/2d980cc3-f5bf-4afc-8636-999e88ab758a\">Using Power Platform to accelerate full-stack software development<\/a>&nbsp;\u2013 To learn more about Code first development with Power Platform.<\/p>\n\n\n\n<p><a href=\"https:\/\/build.microsoft.com\/en-US\/sessions\/22ed7e6c-d529-4ee0-badb-3e3671b9ce28?source=sessions\">Enable every developer to collaborate with low code + pro code<\/a>&nbsp;\u2013 To learn more about Low code and Pro code collaboration.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>The goal of&nbsp;fusion development&nbsp;is to create an environment where Citizen Developers, Professional developers (aka code-first) and IT Professional can collaborate seamlessly. We want to create great experience for makers creating an app for the first time and for code-first developers that want to have the transparency of the source code for their Power Apps. We<\/p>\n","protected":false},"author":32,"featured_media":0,"comment_status":"closed","ping_status":"closed","template":"","power-apps-category":[1549,1563,1664,1671],"power-apps-tag":[],"coauthors":[2362],"class_list":["post-109405","power-apps","type-power-apps","status-publish","hentry","power-apps-category-building-power-apps","power-apps-category-prodev","power-apps-category-uncategorized","power-apps-category-power-fx"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Introducing Code View in Power Apps Studio (Public Preview) - Microsoft Power Platform Blog<\/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:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Introducing Code View in Power Apps Studio (Public Preview) - Microsoft Power Platform Blog\" \/>\n<meta property=\"og:description\" content=\"The goal of&nbsp;fusion development&nbsp;is to create an environment where Citizen Developers, Professional developers (aka code-first) and IT Professional can collaborate seamlessly. We want to create great experience for makers creating an app for the first time and for code-first developers that want to have the transparency of the source code for their Power Apps. We\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/\" \/>\n<meta property=\"og:site_name\" content=\"Microsoft Power Platform Blog\" \/>\n<meta property=\"article:modified_time\" content=\"2024-06-13T03:16:43+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2024\/05\/PowerApps-code-view.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 min read\" \/>\n\t<meta name=\"twitter:label2\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data2\" content=\"Marcel Ferreira\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/\",\"url\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/\",\"name\":\"Introducing Code View in Power Apps Studio (Public Preview) - Microsoft Power Platform Blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2024\/05\/PowerApps-code-view.png\",\"datePublished\":\"2024-05-29T16:12:00+00:00\",\"dateModified\":\"2024-06-13T03:16:43+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/#primaryimage\",\"url\":\"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2024\/05\/PowerApps-code-view.png\",\"contentUrl\":\"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2024\/05\/PowerApps-code-view.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Power Apps\",\"item\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Introducing Code View in Power Apps Studio (Public Preview)\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#website\",\"url\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/\",\"name\":\"Microsoft Power Platform Blog\",\"description\":\"Innovate with Business Apps\",\"publisher\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#organization\",\"name\":\"Microsoft Power Platform Blog\",\"url\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/Microsoft-Logo-e1685482038800.png\",\"contentUrl\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/Microsoft-Logo-e1685482038800.png\",\"width\":194,\"height\":145,\"caption\":\"Microsoft Power Platform Blog\"},\"image\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Introducing Code View in Power Apps Studio (Public Preview) - Microsoft Power Platform Blog","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.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/","og_locale":"en_US","og_type":"article","og_title":"Introducing Code View in Power Apps Studio (Public Preview) - Microsoft Power Platform Blog","og_description":"The goal of&nbsp;fusion development&nbsp;is to create an environment where Citizen Developers, Professional developers (aka code-first) and IT Professional can collaborate seamlessly. We want to create great experience for makers creating an app for the first time and for code-first developers that want to have the transparency of the source code for their Power Apps. We","og_url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/","og_site_name":"Microsoft Power Platform Blog","article_modified_time":"2024-06-13T03:16:43+00:00","og_image":[{"url":"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2024\/05\/PowerApps-code-view.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"1 min read","Written by":"Marcel Ferreira"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/","url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/","name":"Introducing Code View in Power Apps Studio (Public Preview) - Microsoft Power Platform Blog","isPartOf":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/#primaryimage"},"image":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/#primaryimage"},"thumbnailUrl":"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2024\/05\/PowerApps-code-view.png","datePublished":"2024-05-29T16:12:00+00:00","dateModified":"2024-06-13T03:16:43+00:00","breadcrumb":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/#primaryimage","url":"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2024\/05\/PowerApps-code-view.png","contentUrl":"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2024\/05\/PowerApps-code-view.png"},{"@type":"BreadcrumbList","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/introducing-code-view-in-power-apps-studio-public-preview\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/"},{"@type":"ListItem","position":2,"name":"Power Apps","item":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/"},{"@type":"ListItem","position":3,"name":"Introducing Code View in Power Apps Studio (Public Preview)"}]},{"@type":"WebSite","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#website","url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/","name":"Microsoft Power Platform Blog","description":"Innovate with Business Apps","publisher":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#organization","name":"Microsoft Power Platform Blog","url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/Microsoft-Logo-e1685482038800.png","contentUrl":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/Microsoft-Logo-e1685482038800.png","width":194,"height":145,"caption":"Microsoft Power Platform Blog"},"image":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#\/schema\/logo\/image\/"}}]}},"distributor_meta":false,"distributor_terms":false,"distributor_media":false,"distributor_original_site_name":"Microsoft Power Platform Blog","distributor_original_site_url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog","push-errors":false,"_links":{"self":[{"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/power-apps\/109405"}],"collection":[{"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/power-apps"}],"about":[{"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/types\/power-apps"}],"author":[{"embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/users\/32"}],"replies":[{"embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/comments?post=109405"}],"version-history":[{"count":1,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/power-apps\/109405\/revisions"}],"predecessor-version":[{"id":109408,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/power-apps\/109405\/revisions\/109408"}],"wp:attachment":[{"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/media?parent=109405"}],"wp:term":[{"taxonomy":"power-apps-category","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/power-apps-category?post=109405"},{"taxonomy":"power-apps-tag","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/power-apps-tag?post=109405"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/coauthors?post=109405"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}