Bagikan melalui


Pengantin ASP.NET MVC

oleh Scott Hanselman

Catatan

Versi yang diperbarui jika tutorial ini tersedia di sini menggunakan Visual Studio 2013. Tutorial baru menggunakan ASP.NET MVC 5, yang memberikan banyak peningkatan atas tutorial ini.

Ini adalah tutorial pemula yang memperkenalkan dasar-dasar ASP.NET MVC. Anda akan membuat aplikasi web sederhana yang membaca dan menulis dari database. Kunjungi pusat pembelajaran MVC ASP.NET untuk menemukan tutorial dan sampel MVC ASP.NET lainnya.

Mari kita buat Aplikasi Web MVC ASP.NET pertama kita menggunakan Visual Web Developer 2010 Express. Kita akan membuat aplikasi daftar Film kecil yang akan memungkinkan kita membuat dan mencantumkan film.

Apa yang akan Anda Bangun

Berikut adalah dua cuplikan layar aplikasi yang akan Anda buat. Anda akan memiliki tabel film sederhana dengan berbagai kolom.

Daftar Film - Windows Internet Explorer (12)

Dan Anda akan memiliki Buat Formulir sehingga kami dapat menambahkan film ke daftar.

Membuat Film - Windows Internet Explorer (2)

Keterampilan yang akan Anda Pelajari

Tutorial ini akan mengajari Anda dasar-dasar membangun Aplikasi Web MVC ASP.NET menggunakan Visual Studio. Anda akan mempelajari:

  • Cara membuat Proyek MVC ASP.NET baru
  • Cara membuat Database baru dengan SQL Server
  • Cara membuat Pengontrol dan Tampilan MVC ASP.NET
  • Cara mengambil dan menampilkan data
  • Cara mengedit data dan mengaktifkan validasi data
  • Cara memperbarui skema database

Memulai

Mulailah dengan menjalankan Visual Web Developer 2010 Express (saya akan menyebutnya "VWD" mulai sekarang) dan pilih Proyek Baru dari Layar Mulai.

Pengembang Web Visual adalah IDE, atau Lingkungan Pengembang Terintegrasi. Sama seperti Anda menggunakan Microsoft Word untuk menulis dokumen, Anda akan menggunakan IDE untuk membuat aplikasi. Ada toolbar di sepanjang bagian atas yang menampilkan berbagai opsi yang tersedia untuk Anda, serta menu yang juga bisa Anda gunakan untuk Memilih File | Proyek baru.

Cuplikan layar jendela Microsoft Visual Web Developer 2010 Express, yang memperlihatkan Halaman Mulai.

Membuat aplikasi pertama Anda

Anda dapat membuat aplikasi menggunakan Visual Basic atau Visual C#. Untuk saat ini, Pilih Visual C# di sebelah kiri, lalu pilih "ASP.NET MVC 2 Web Application." Beri nama proyek Anda "Film" dan klik OK.

Proyek Baru

Di sisi kanan adalah Penjelajah Solusi yang menampilkan semua file dan folder di aplikasi Anda. Jendela besar di tengah adalah tempat Anda mengedit kode dan menghabiskan sebagian besar waktu Anda. Visual Studio menggunakan templat default untuk proyek MVC ASP.NET yang baru saja Anda buat, sehingga Anda memiliki aplikasi yang berfungsi sekarang tanpa melakukan apa pun! Ini adalah "Halo Dunia" sederhana! proyek, dan ini adalah tempat yang baik untuk memulai aplikasi kami.

Cuplikan layar jendela Microsoft Visual Web Developer 2010 Express, yang menunjukkan file Home Controller dot c s baru terbuka di editor kode.

Pilih tombol "putar" ke toolbar.

Mulai Penelusuran Kesalahan

Ini adalah panah hijau yang menunjuk ke kanan yang akan mengkompilasi program Anda dan memulai aplikasi Anda di browser web.

CATATAN: Anda dapat menekan F5 di keyboard Anda, atau pilih Debug-Mulai> Debugging dari menu "Debug".

Ini akan menyebabkan Pengembang Web Visual memulai pengembangan server web dan menjalankan aplikasi web kami (tidak ada konfigurasi atau langkah manual yang diperlukan untuk mengaktifkan ini). Kemudian akan meluncurkan browser dan mengonfigurasinya untuk menelusuri halaman beranda aplikasi. Perhatikan di bawah ini bahwa bilah alamat browser mengatakan "localhost", dan bukan sesuatu seperti example.com. Itu karena localhost selalu menunjuk ke komputer lokal Anda sendiri - yang dalam hal ini menjalankan aplikasi yang baru saja kami bangun.

Halaman Beranda

Di luar kotak templat default ini memberi Anda dua halaman untuk dikunjungi dan halaman masuk dasar. Mari kita ubah cara kerja aplikasi ini dan pelajari sedikit tentang ASP.NET MVC dalam prosesnya. Tutup browser Anda dan mari kita ubah beberapa kode.