Visual Studio (bukan Visual Studio Code) memiliki banyak kemudahan yang dapat digunakan oleh software developer dalam menulis kode program. Kemudahan yang paling sering digunakan adalah template file, yang dapat digunakan untuk membuat file class, file konfigurasi dan file antarmuka seperti pada gambar di bawah ini.
Misal untuk membuat class Startup maka cukup memilih template yang sudah disediakan. Begitu juga jika ingin membuat file konfigurasi dan file komponen view. Kemudahan ini membuat software developer dapat dengan cepat membuat file yang dibutuhkan dengan cepat.
Lalu bagaimana dengan Visual Studio Code? Secara default, Visual Studio Code tidak memiliki fitur seperti itu. Tetapi fitur tersebut dapat tersedia pada Visual Studio Code jika menambahkan extension. Sebagai contoh, untuk mengembangkan aplikasi web dengan ASP.NET Core framework, maka dapat digunakan extension Yeoman & Generator ASP.NET. Pada posting sebelumnya di sini http://www.rezafaisal.net/?p=3113, telah dibahas bagaimana menyiapkan project ASP.NET Core dengan generator tersebut. Tetapi pada posting tersebut belum dijelaskan fitur lain dari extesion ini yang dapat digunakan untuk membuat file class, file komponen view seperti yang dimiliki oleh Visual Studio Code.
Fitur generator file dari Yeoman ini dapat dilakukan dengan menggunakan penulisan perintah pada Integrated Terminal pada Visual Studio Code. Jadi langkah yang harus dilakukan adalah mengaktifkan Terminal dengan memilih menu View > Integrated Terminal. Untuk mengetahui perintah-perintah dan file apa saja yang dapat dibuat oleh generator ini maka dapat diketikan perintah berikut pada terminal.
yo aspnet --help
Maka akan dapat dilihat output seperti berikut ini.
Usage: yo aspnet:app [options] [<type>] [<applicationName>] [<ui>]
Options:
-h, –help # Print the generator’s options and usage
–skip-cache # Do not remember prompt answers Default: false
Arguments:
type # the project type to create Type: String Required: false
applicationName # the name of the application Type: String Required: false
ui # the ui library to use (bootstrap OR semantic) Type: String Required: false
Description:
Creates a basic ASP.NET Core application
Subgenerators:
yo aspnet:angularcontroller [options] <name>
yo aspnet:angularcontrolleras [options] <name>
yo aspnet:angulardirective [options] <name>
yo aspnet:angularfactory [options] <name>
yo aspnet:angularmodule [options] <name>
yo aspnet:appsettings [options]
yo aspnet:bowerjson [options]
yo aspnet:class [options] <name>
yo aspnet:coffeescript [options] <name>
yo aspnet:dockerfile [options]
yo aspnet:gitignore [options]
yo aspnet:gruntfile [options]
yo aspnet:gulpfile [options] <name>
yo aspnet:htmlpage [options] <name>
yo aspnet:interface [options] <name>
yo aspnet:javascript [options] <name>
yo aspnet:json [options] <name>
yo aspnet:jsonschema [options] <name>
yo aspnet:middleware [options] <name>
yo aspnet:mvccontroller [options] <name>
yo aspnet:mvcview [options] <name>
yo aspnet:nuget [options]
yo aspnet:packagejson [options]
yo aspnet:program [options]
yo aspnet:startup [options]
yo aspnet:stylesheet [options] <name>
yo aspnet:stylesheetless [options] <name>
yo aspnet:stylesheetscss [options] <name>
yo aspnet:taghelper [options] <name>
yo aspnet:textfile [options] <name>
yo aspnet:tfignore [options]
yo aspnet:typescript [options] <name>
yo aspnet:typescriptconfig [options] <name>
yo aspnet:typescriptjsx [options] <name>
yo aspnet:usersecrets [options] <name>
yo aspnet:webapicontroller [options] <name>
Sedangkan jika ingin mendapatkan informasi bantuan tentang spesifik suatu perintah pembuatan file template (misal untuk membuat file mvcview) dapat digunakan perintah berikut ini.
yo aspnet:mvcview --help
Dan berikut adalah output dari perintah di atas.
Usage: yo aspnet:mvcview [options] <name>
Options:
-h, –help # Print the generator’s options and usage
–skip-cache # Do not remember prompt answers Default: false
Arguments:
name Type: String Required: true
Untuk mengembangkan aplikasi web dengan ASP.NET Core ada beberapa file yang sering dibuat adalah:
- File appsettings.json untuk menyimpan file konfigurasi.
- File class.
- File mvccontroller, file class komponen controller.
- File mvcview, file komponen view.
- File webapicontroller, file controller Web API.
- File stylesheet, file CSS.
- file htmlpage, file HTML.
{appsettings.json}
Untuk membuat file ini digunakan perintah berikut.
yo aspnet:appsettings
Hasilnya adalah file dengan nama appsettings.json dengan isi sebagai berikut.
{htmlpage}
Untuk membuat file HTML dengan nama Index.html digunakan perintah berikut.
yo aspnet:htmlpage Index.html
Hasilnya adalah file Index.html dengan isi sebagai berikut.
<!doctype html> <html lang=""> <head> <meta charset="utf-8" /> <title></title> <meta name="description" content="" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <!-- Place favicon.ico in the root directory --> </head> <body>
</body>
</html>
{stylesheetcss}
Untuk membuat file CSS dengan nama default.css maka digunakan perintah berikut ini.
yo aspnet:stylesheet default
{class}
Untuk membuat class HelloWorld maka digunakan perintah berikut ini.
yo aspnet:class HelloWorld
Dan berikut adalah file class HelloWorld.css sebagai berikut.
using System; using System.Collections.Generic; using System.Linq; using System.Threading.Tasks;
namespace HelloWorldASPNETCore
{
public class HelloWorld
{
public HelloWorld()
{
}
}
}
{mvccontroller}
Untuk membuat class controller HomeController digunakan perintah berikut ini.
yo aspnet:mvccontroller HomeController
Hasilnya adalah sebagai berikut.
using System; using System.Collections.Generic; using System.Linq; using System.Threading.Tasks; using Microsoft.AspNetCore.Mvc;
// For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
namespace HelloWorldASPNETCore
{
public class HomeController : Controller
{
// GET: /<controller>/
public IActionResult Index()
{
return View();
}
}
}
{mvcview}
Untuk membuat file view komponen dengan nama Index.chtml digunakan perintah berikut ini.
yo aspnet:mvcview Index.cshtml
Hasilnya adalah sebagai berikut.
@* For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860 *@ @{ // ViewBag.Title = "Index Page"; }
Dengan adanya fitur ini maka pembangunan aplikasi web ASP.NET Core akan lebih mudah dan cepat.
Semoga posting ini bermanfaat