Tutorial ini terdiri dari lima bagian.

• Bagian 1 membahas tentang Authentication, Registration, dan Database [Tutorial ini].
• Bagian 2 berisi tentang Authorization.
• Bagian 3 berfokus pada User Management.
• Bagian 4 tentang File Upload dan Email Notification.
• Bagian 5 mengenai Deployment. (Coming soon)

Sebagai seorang developer, terkadang kita menemui dan membangun aplikasi web dengan format yang sama secara berulang-ulang. Contohnya, kita memulai pengembangan aplikasi dengan membuat fitur login dan logout selanjutnya dibuat halaman profil hingga fitur-fitur utama yang dibutuhkan oleh sebuah aplikasi.

Sebagai langkah untuk mempermudah dan mempercepat proses yang biasanya berulang, kita dapat membuat sebuah boilerplate untuk aplikasi web. Boilerplate ini merupakan kumpulan kode yang bisa kita gunakan kembali sebagai dasar untuk membuat sebuah aplikasi.

Ada banyak contoh boilerplate di sekitar kita misalnya ketika teman-teman menggunakan command dotnet new list akan muncul boilerplate yang sudah disusun oleh Microsoft untuk memulai pembuatan aplikasi.

Nah, pada tutorial ini, mari kita menyusun sebuah boilerplate untuk aplikasi web dengan menggunakan ASP.NET Core.

Fitur Dasar Boilerplate

Pertama, mari kita petakan fitur-fitur yang lazim digunakan pada sebuah aplikasi. Fitur ini juga bisa merupakan fitur yang esensial pada aplikasi web. Berikut ini daftar fitur yang akan kita buat.

• Authentication (Login, Logout, Forgot Password)
• Registration (Register User, Account Confirmation)
• Authorization (Role-Based Access)
• Search
• Database (Migration, Seeder, Configuration)
• File Upload (Storage, Configuration)
• Email Notification (Email Service)
• Deployment

Daftar diatas merupakan fitur-fitur yang biasanya kita temui saat membuat aplikasi. Misalnya login dan logout sering dibutuhkan pada sebuah aplikasi. Kemudian file upload juga merupakan fitur yang biasanya dibutuhkan juga. Misalkan teman-teman sudah ada boilerplate dengan fitur-fitur ini, maka teman-teman bisa mempercepat durasi pada saat pengembangan aplikasi.

Boilerplate: Authentication & Database

Selanjutnya, mari kita susun boilerplate untuk aplikasi web. Pada artikel ini, kita akan membuat sebuah aplikasi web dengan ASP.NET Core Razor Pages dengan fitur authentication, registration serta database.

Pertama mari kita buat terlebih dahulu proyek web dengan command ini.

dotnet new webapp --auth Individual -o BoilerplateWebApp

Command ini akan menghasilkan sebuah solution yang berisi alur untuk login, register, logout, dan registrasi user beserta halamannya menggunakan Bootstrap. Kemudian argument --auth Individual menghasilkan database sqlite yaitu app.db.

Selanjutnya kita buat solution untuk aplikasi web ini.

dotnet new sln && dotnet sln add BoilerplateWebApp.csproj

Database yang kita gunakan kali ini yaitu sqlite. Sqlite sendiri sudah cukup untuk production. Namun ada beberapa catatan ketika menggunakan sqlite (Sumber)[https://www.sqlite.org/whentouse.html], misalnya database ini akan efektif apabila tidak melakukan scaling secara horizontal dan fitur aplikasi kita tidak terlalu kompleks.

Sqlite ini akan kita integrasikan dengan Litestream yang akan bertugas untuk melakukan replikasi database ke cloud storage sehingga database kita bisa berjalan dengan baik serta terdapat backup database secara berkala.

Selanjutnya jalankan aplikasi boilerplate ini.

cd BoilerplateWebApp && dotnet run

Buka aplikasi di browser sesuai port, misal http://localhost:5230/. Lalu teman-teman bisa melakukan test untuk register, login, dan logout. Langkah pertama untuk authentication sudah kita aplikasikan.

Selanjutnya, matikan aplikasi dengan ctrl + c lalu buka direktori ini di Code Editor favorit teman-teman.

Apabila teman-teman ingin melakukan edit pada halaman login atau register, maka teman-teman harus generate terlebih dahulu template halaman tersebut. Pertama, install ASP.NET Core Generator.

dotnet tool install -g dotnet-aspnet-codegenerator

Tambahkan juga package ini agar generator bisa berjalan dengan baik.

dotnet add package Microsoft.VisualStudio.Web.CodeGeneration.Design

Selanjutnya, kita buat halaman-halaman tadi melalui perintah ini.

dotnet aspnet-codegenerator identity -dc BoilerplateWebApp.Data.ApplicationDbContext --files "Account.Manage._Layout;Account.Manage._ManageNav;Account.Manage._StatusMessage;Account.Manage.ChangePassword;Account.Manage.DeletePersonalData;Account.Manage.Disable2fa;Account.Manage.DownloadPersonalData;Account.Manage.EnableAuthenticator;Account.Manage.ExternalLogins;Account.Manage.GenerateRecoveryCodes;Account.Manage.Index;Account.Manage.PersonalData;Account.Manage.ResetAuthenticator;Account.Manage.SetPassword;Account.Manage.TwoFactorAuthentication" --useSqLite

Pada folder Areas/Identity/Pages/Account akan ada beberapa file yang berfungsi untuk proses otentifikasi. Dari folder ini, teman-teman bisa memilih file untuk edit sesuai dengan kebutuhan teman-teman.

Langkah selanjutnya, kita akan melakukan tes sederhana dengan menggunakan halaman yang hanya bisa diakses ketika user sedang login saja.

Pada folder Pages, mari kita modifikasi halaman Privacy sehingga hanya bisa diakses oleh user yang login. Buka Privacy.cshtml.cs dan tambahkan [Authorize] pada class PrivacyModel menjadi seperti ini.

using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;

namespace BoilerplateWebApp.Pages;

[Authorize] // Penambahan info protected page
public class PrivacyModel : PageModel
{
    private readonly ILogger<PrivacyModel> _logger;

    public PrivacyModel(ILogger<PrivacyModel> logger)
    {
        _logger = logger;
    }

    public void OnGet()
    {
    }
}

Lalu jalankan aplikasi melalui dotnet run. Ketika teman-teman mengunjungi halaman Privacy, maka teman-teman harus login terlebih dahulu sehingga hal ini sudah membuktikan bahwa proses untuk authentication & protected page sudah berjalan pada aplikasi ini.

Saat ini, boilerplate aplikasi web kita sudah memiliki fitur authentication, registration, koneksi ke database, beserta halaman-halamannya. Pada bagian selanjutnya kita akan menambahkan authorization dengan role user Admin serta User.

Lanjut tutorial Bagian 2 - Authorization