Langkah-Langkah Membuat CRUD (Create, Read, Update, Delete) di Blazor Menggunakan Oracle

Database

---

1. PERSIAPAN PROYEK

- Pastikan Anda telah menginstal paket NuGet `[Link]`.

- Tambahkan string koneksi ke file `[Link]`:

"ConnectionStrings": {

"OracleConnection": "User Id=x;Password=x;Data

Source=(DESCRIPTION=(ADDRESS=(PROTOCOL=TCP)(HOST=your-host)(PORT=1521))(CONN

ECT_DATA=(SERVICE_NAME=your-service-name)))"

---

2. BUAT LAYANAN DATABASE ([Link])

Tambahkan file baru bernama `[Link]` dengan isi berikut:

using [Link];

public class TrialService

private readonly OracleConnection _connection;

_connection = connection;

// CREATE

public async Task<int> CreateTrialAsync(string name, string description)

var query = "INSERT INTO trial (name, description) VALUES (:name, :description)";

var command = _connection.CreateCommand();

[Link] = query;

[Link](new OracleParameter("name", name));

[Link](new OracleParameter("description", description));

try

await _connection.OpenAsync();

return await [Link]();

finally

await _connection.CloseAsync();

// READ

public async Task<List<(int id, string name, string description, DateTime created_at)>>
GetAllTrialsAsync()

var query = "SELECT id, name, description, created_at FROM trial";

var command = _connection.CreateCommand();

[Link] = query;

var results = new List<(int id, string name, string description, DateTime created_at)>();

try

await _connection.OpenAsync();

var reader = await [Link]();

while (await [Link]())

[Link]((

reader.GetInt32(0),

[Link](1),

[Link](2),

[Link](3)

));

finally

await _connection.CloseAsync();

}
 return results;

// UPDATE

public async Task<int> UpdateTrialAsync(int id, string name, string description)

var query = "UPDATE trial SET name = :name, description = :description WHERE id = :id";

var command = _connection.CreateCommand();

[Link] = query;

[Link](new OracleParameter("name", name));

[Link](new OracleParameter("description", description));

[Link](new OracleParameter("id", id));

try

await _connection.OpenAsync();

return await [Link]();

finally

await _connection.CloseAsync();

// DELETE

public async Task<int> DeleteTrialAsync(int id)

{
 var query = "DELETE FROM trial WHERE id = :id";

var command = _connection.CreateCommand();

[Link] = query;

[Link](new OracleParameter("id", id));

try

await _connection.OpenAsync();

return await [Link]();

finally

await _connection.CloseAsync();

---

3. BUAT KOMPONEN RAZOR ([Link])

Buat komponen baru bernama `[Link]` dengan isi berikut:

@inject TrialService TrialService

<h3>Trial Management</h3>

<h4>Create New Trial</h4>

<input @bind="newName" placeholder="Name" />

<button @onclick="CreateTrial">Create</button>

<h4>All Trials</h4>

@if (trials == null)

<p>Loading...</p>

else if ([Link] == 0)

<p>No trials found.</p>

else

<ul>

@foreach (var trial in trials)

<li>

<b>@[Link]</b>: @[Link] (Created At: @trial.created_at)

<button @onclick="() => EditTrial([Link])">Edit</button>

<button @onclick="() => DeleteTrial([Link])">Delete</button>

</li>

</ul>

@if (isEditing)
{

<h4>Edit Trial</h4>

<input @bind="editName" placeholder="Name" />

<input @bind="editDescription" placeholder="Description" />

<button @onclick="SaveEdit">Save</button>

<button @onclick="CancelEdit">Cancel</button>

@code {

private List<(int id, string name, string description, DateTime created_at)> trials;

private string newName;

private string newDescription;

private bool isEditing = false;

private int editId;

private string editName;

private string editDescription;

protected override async Task OnInitializedAsync()

trials = await [Link]();

private async Task CreateTrial()

await [Link](newName, newDescription);

newName = [Link];

newDescription = [Link];
 trials = await [Link]();

private void EditTrial(int id)

var trial = [Link](t => [Link] == id);

isEditing = true;

editId = [Link];

editName = [Link];

editDescription = [Link];

private async Task SaveEdit()

await [Link](editId, editName, editDescription);

isEditing = false;

trials = await [Link]();

private void CancelEdit()

isEditing = false;

private async Task DeleteTrial(int id)

await [Link](id);
 trials = await [Link]();

---

4. TAMBAHKAN RUTE DAN NAVIGASI

- Tambahkan rute di `[Link]`:

@page "/trial-management"

- Tambahkan link navigasi di `[Link]`:

<NavLink href="/trial-management" class="nav-link">

<span class="oi oi-list-rich" aria-hidden="true"></span> Trial Management

</NavLink>

---

5. JALANKAN APLIKASI

- Jalankan aplikasi dengan `F5`.

- Akses halaman `[Link]

- Uji semua operasi CRUD (Create, Read, Update, Delete).