Membuat CRUD dengan ASP.NET Visual Studio 2019

Halo buat teman-teman yang sedang mulai belajar untuk membuat web dengan bahasa Active Server Page (ASP).NET dengan Visual Studio 2019, berikut merupakan cara untuk membuat CRUD (Create Read Update Delete) data ke database dengan menggunakan SQL Server.

Tools yang di butuhkan:

Visual Studio 2019 download
SQL Server download
Microsoft SQL Server Management Studio 2018 download

Step by step:

Jika sudah terinstall dengan baik, berikutnya kita buka Visual Studio 2019

1. Pilih Create a New Project

2. Pilih Template atau Model Web, dalam contoh ini kita akan menggunakan ASP.NET Web Application (.NET Framework) dengan MVC

3. Pilih atau ubah nama project, default Application1 saya telah ubah menjadi Mahasiswa. Jika sudah klik Create

4. Pilih template MVC dan uncheck Configure for https, kemudian klik Create.

5. Jika berhasil maka tampilan akan seperti berikut ini, perhatikan kotak merah dan pastikan struktur folder sama.

6. Selanjutnya kita beralih untuk membuat Database terlebih dahulu. Buka Microsoft SQL Server Management Studio (MSSMS), dan pastikan anda sudah menginstall SQL Server.

Masukan Server name (Nama PC/Laptop anda) untuk mengetahuinya dapat menekan tombol Windows + Pause Break, atau Properties pada Computer Explorer kemudian klik Connect, jika muncul problem A network-related or instance-spesific error occured while establishing, seperti berikut ini

Pastikan nama server sudah benar dan cek SQLSERVER pada Service Task Manager sudah pada status Running. Jika berhasil maka tampilannya akan seperti ini.

7. Selanjutnya buat database baru dengan klik kanan pada folder database dan pilih New Database

Jika sudah akan diarahkan pada tampilan seperti berikut ini.

Langkah pada gambar:

  • Klik kanan pada folder Table
  • Kemudian masukan column nama dan prodi beserta tipe datanya
  • Pada Identity Spesification ubah dari 0 menjadi 1
  • Klik icon save pada menu bar kiri atas dan ubah nama Table

Klik Icon Refresh maka nama table Biodata yang dibuat akan muncul. seperti pada gambar berikut.

So Far kita sudah selesai sampai proses pembuatan database. Berikutnya adalah membuat koneksi agar database dapat terhubung dengan Visual Studio. Kita tinggalkan dulu MSSMS dan kembali lagi buka Visual Studio.

8. Untuk membuat koneksi pertama-tama klik kanan pada folder model, pilih add pilih new item. Seperti pada gambar berikut.

kemudian akan muncul tampilan seperti berikut ini,

Perhatikan bagian yang saya lingkari, pilih menunya dan ubah nama model.

Pilih EF Designer from database

Pilih New Connection, Masukan nama Server, kemudian select or enter database name, pada select option akan muncul nama database yang telah kita buat, yaitu Mahasiswa.

Jika sudah klik next, maka akan muncul tampilan seperti berikut ini dan selanjutnya ubah nama connection menjadi DbModels. Seperti pada tampilan berikut.

Klik next kemudian pilih version Entity Framework 6.x kemudian pilih database dan tabelnya.

Klik Finish. Model Selesai dibuat.

Berikutnya kita akan membuat Controllernya

Klik kanan pada folder Controller, pilih Add pilih Controller. kemudian pilih MVC 5 Controller with read/write actions.

Jika sudah klik Add. dan buat nama Controller

Tambahkan code using Mahasiswa.Models; untk memanggil fungsi dari model mahasiswa.

Membuat url direct link untuk halaman index sekaligus membuat halaman view index, tambahkan kode berikut pada function index

  using (DbModels dbModel = new DbModels())
  {
     return View(dbModel.Biodatas.ToList());
  }

Jika sudah block nama function index dan klik kanan pilih add View, pilih view name index, template list, dan model class biodata.

Jika sudah klik Add, maka otomatis akan mengenerate tampilan untuk view data.

*to be continue

5 Comments

  1. Saya kok , di sql server sudah ngikuti sesuai tutorial , tapi tidak jadi dbo.biodatanya ?
    Mohon pencerahannya

Leave a Reply

Your email address will not be published. Required fields are marked *