https://thedotnetblog.com/id/tags/visual-studio-code/Articles, tutorials and insights from the .NET community.Hugoid@thedotnetblog (The .NET Blog)@thedotnetblogWed, 27 May 2026 00:00:00 +0000https://thedotnetblog.com/id/news/emiliano-montesdeoca/dotnet-new-winui-templates-cli-vscode/Wed, 27 May 2026 00:00:00 +0000Emiliano Montesdeocahttps://thedotnetblog.com/id/news/emiliano-montesdeoca/dotnet-new-winui-templates-cli-vscode/Template proyek WinUI kini berfungsi dengan dotnet new — aplikasi kosong, pola NavigationView, dan lainnya. Dukungan VS Code, tidak perlu Visual Studio, dengan default Fluent Design sudah terintegrasi.<p>Pengembangan WinUI dahulu memerlukan Visual Studio. Itu berubah: Microsoft telah menerbitkan template proyek dan item open source untuk WinUI yang berfungsi dengan <code>dotnet new</code>, membawa pengembangan aplikasi Windows ke dalam alur kerja CLI standar.</p> <h2 id="mulai-dengan-tiga-perintah">Mulai dengan Tiga Perintah</h2> <div class="highlight"><pre tabindex="0" class="chroma"><code class="language-shell" data-lang="shell"><span class="line"><span class="cl"><span class="c1"># Instal template</span> </span></span><span class="line"><span class="cl">dotnet new install Microsoft.WindowsAppSDK.WinUI.CSharp.Templates </span></span><span class="line"><span class="cl"> </span></span><span class="line"><span class="cl"><span class="c1"># Buat aplikasi NavigationView</span> </span></span><span class="line"><span class="cl">dotnet new winui-navview -n MyApp </span></span><span class="line"><span class="cl"> </span></span><span class="line"><span class="cl"><span class="c1"># Jalankan</span> </span></span><span class="line"><span class="cl"><span class="nb">cd</span> MyApp </span></span><span class="line"><span class="cl">dotnet run </span></span></code></pre></div><p>Tanpa Visual Studio, tanpa pengaturan proyek manual. Aplikasi berjalan dengan <code>dotnet run</code>.</p> <h2 id="yang-termasuk-di-dalamnya">Yang Termasuk di Dalamnya</h2> <p><strong>Template kosong</strong> (<code>dotnet new winui</code>) — titik awal modern dengan bilah judul Fluent yang sudah terhubung, ikon aplikasi default yang diperbarui dengan aset <code>.ico</code>, dan default mode terang/gelap yang benar. Lebih baik dari template kosong lama yang membuat Anda mengonfigurasi dasar-dasar sendiri.</p> <p><strong>Template NavigationView</strong> (<code>dotnet new winui-navview</code>) — pola navigasi master-detail, sepenuhnya terhubung dengan NavigationView, bilah judul modern, dan struktur navigasi multi-halaman. Mengikuti siluet aplikasi Windows standar untuk aplikasi berbasis navigasi. Jika Anda membangun sesuatu dengan navigasi samping, mulai dari sini.</p> <p>Kedua template mengikuti <a href="https://learn.microsoft.com/windows/apps/design/basics/app-silhouette">siluet aplikasi Windows</a> — pola Fluent Design modern untuk tata letak, navigasi, dan struktur visual — langsung dari kotak.</p> <h2 id="mengapa-penting-bagi-developer-yang-tidak-menggunakan-visual-studio">Mengapa Penting bagi Developer yang Tidak Menggunakan Visual Studio</h2> <p>Developer WinUI yang menggunakan VS Code, Rider, atau alat baris perintah selama ini kurang diperhatikan. Template Visual Studio yang ada tidak dapat digunakan di luar VS — harus membuat ulang struktur proyek secara manual dan menghubungkan dasar-dasarnya.</p> <p>Template ini bersumber terbuka (lihat <a href="https://github.com/microsoft/WindowsAppSDK/pull/6407">WindowsAppSDK PR #6407</a>), dikembangkan dari <a href="https://github.com/microsoft/microsoft-ui-xaml/issues/10388">umpan balik komunitas</a>, dan tersedia sekarang. Dukungan Visual Studio sedang dalam pengerjaan — template yang sama ini pada akhirnya akan berfungsi di sana juga.</p> <p>Untuk tim yang ingin mengotomatiskan pengaturan proyek WinUI mereka, mengintegrasikannya ke dalam CI, atau sekadar menggunakan editor selain Visual Studio, ini adalah peningkatan yang berarti.</p> <p>Posting asli: <a href="https://devblogs.microsoft.com/ifdef-windows/introducing-dotnet-new-templates-for-winui/">Introducing dotnet new WinUI templates</a></p>