Bagikan melalui


Mulai menggunakan ASP.NET 4.5 Web Forms dan Visual Studio 2017

Seri tutorial ini menunjukkan kepada Anda cara membangun aplikasi ASP.NET Web Forms dengan ASP.NET 4.5 dan Microsoft Visual Studio 2017.

Pengantar

Seri tutorial ini memandu Anda membuat aplikasi ASP.NET Web Forms menggunakan Visual Studio 2017 dan ASP.NET 4.5. Anda akan membuat aplikasi bernama Wingtip Toys - situs web etalase yang disederhanakan yang menjual item secara online. Selama seri ini, fitur ASP.NET 4.5 baru disorot.

Target audiens

Pengembang yang baru ASP.NET Formulir Web adalah audiens target untuk seri tutorial ini.

Anda harus memiliki beberapa pengetahuan di area berikut:

  • Pemrograman berorientasi objek (OOP) dan bahasa
  • Pengembangan web (HTML, CSS, JavaScript)
  • Database Relasional
  • Arsitektur N-tingkat

Untuk meninjau area ini, pertimbangkan untuk mempelajari konten berikut:

Fitur aplikasi

Fitur Formulir Web ASP.NET yang disajikan dalam seri ini meliputi:

  • Proyek Aplikasi Web (bukan Proyek Situs Web)
  • Formulir Web
  • Halaman Master, Konfigurasi
  • Bootstrap
  • Kode Kerangka Kerja Entitas Pertama, LocalDB
  • Validasi Permintaan
  • Kontrol Data yang sangat diketik
  • Pengikatan Model
  • Anotasi Data
  • Penyedia Nilai
  • SSL dan OAuth
  • ASP.NET Identitas, Konfigurasi, dan Otorisasi
  • Validasi Tidak Mengganggu
  • Perutean
  • Penanganan Kesalahan ASP.NET

Skenario dan tugas aplikasi

Tugas seri tutorial meliputi:

  • Membuat, meninjau, dan menjalankan proyek baru
  • Membuat struktur database
  • Menginisialisasi dan menyemai database
  • Mengkustomisasi UI dengan gaya, grafik, dan halaman master
  • Menambahkan halaman dan navigasi
  • Menampilkan detail menu dan data produk
  • Membuat kedai belanja
  • Menambahkan dukungan SSL dan OAuth
  • Menambahkan metode pembayaran
  • Menyertakan peran administrator dan pengguna ke aplikasi
  • Membatasi akses ke halaman dan folder tertentu
  • Mengunggah file ke aplikasi web
  • Menerapkan validasi input
  • Mendaftarkan rute untuk aplikasi web
  • Menerapkan penanganan kesalahan dan pencatatan kesalahan

Gambaran Umum

Seri tutorial ini ditujukan untuk seseorang yang terbiasa dengan konsep pemrograman, tetapi baru ASP.NET Web Forms. Jika Anda sudah terbiasa dengan ASP.NET Web Forms, seri ini masih dapat membantu Anda mempelajari tentang fitur ASP.NET 4.5 baru. Untuk pembaca yang tidak terbiasa dengan konsep pemrograman dan ASP.NET Formulir Web, lihat tutorial Formulir Web tambahan yang disediakan di bagian Memulai di situs web ASP.NET.

ASP.NET 4.5 yang disediakan dalam seri tutorial ini mencakup fitur-fitur berikut:

  • Antarmuka pengguna sederhana untuk membuat proyek yang menawarkan dukungan untuk banyak kerangka kerja ASP.NET (Formulir Web, MVC, dan API Web).

  • Bootstrap, tata letak, tema, dan kerangka kerja desain responsif.

  • ASP.NET Identity, sistem keanggotaan ASP.NET baru yang bekerja sama di semua kerangka kerja ASP.NET dan bekerja dengan perangkat lunak hosting web selain IIS.

  • Entity Framework 6

    Pembaruan untuk Kerangka Kerja Entitas yang memungkinkan Anda untuk:

    • Mengambil dan memanipulasi data sebagai objek yang ditik dengan kuat
    • Mengakses data secara asinkron
    • Menangani kesalahan koneksi sementara
    • Pernyataan SQL log

Untuk daftar fitur lengkap ASP.NET 4.5, lihat ASP.NET dan Alat Web untuk Catatan Rilis Visual Studio 2013.

Aplikasi sampel Wingtip Toys

Cuplikan layar berikut berasal dari aplikasi ASP.NET Web Forms yang Anda buat dalam seri tutorial ini. Saat Anda menjalankan aplikasi di Visual Studio, halaman Beranda web berikut muncul.

Mainan Wingtip - Halaman default

Anda dapat mendaftar sebagai pengguna baru, atau masuk sebagai pengguna yang sudah ada. Navigasi atas memiliki tautan ke kategori produk dan produknya dari database.

Jika Anda memilih Produk, semua produk yang tersedia akan ditampilkan.

Wingtip Toys - Produk

Jika Anda memilih produk tertentu, detail produk akan ditampilkan.

Wingtip Toys - Detail Produk

Sebagai pengguna, Anda dapat mendaftar dan masuk dengan fungsionalitas default templat Formulir Web. Tutorial ini juga menjelaskan cara masuk menggunakan akun Gmail yang ada. Selain itu, Anda bisa masuk sebagai administrator untuk menambahkan dan menghapus produk dari database.

Mainan Wingtip - Masuk

Setelah masuk sebagai pengguna, Anda dapat menambahkan produk ke kedai belanja dan checkout dengan PayPal. Aplikasi sampel dirancang untuk bekerja di kotak pasir pengembang PayPal. Tidak ada transaksi uang aktual yang terjadi.

Mainan Wingtip - Kedai Belanja

PayPal mengonfirmasi informasi akun, pesanan, dan pembayaran Anda.

Mainan Wingtip - PayPal

Setelah kembali dari PayPal, Anda dapat meninjau dan menyelesaikan pesanan Anda.

Wingtip Toys - Ulasan Pesanan

Prasyarat

Sebelum memulai, pastikan perangkat lunak berikut terinstal pada komputer Anda:

.NET Framework diinstal secara otomatis.

Seri tutorial ini menggunakan Microsoft Visual Studio Community 2017. Anda dapat menggunakannya atau Microsoft Visual Studio 2017 untuk menyelesaikan seri tutorial ini.

Perhatikan hal berikut tentang Visual Studio:

  • Microsoft Visual Studio 2017 dan Microsoft Visual Studio Community 2017 disebut sebagai Visual Studio di seluruh seri tutorial ini.

  • Visual Studio 2017 diinstal di samping versi lama yang sudah diinstal. Situs yang dibuat di versi sebelumnya dapat dibuka di Visual Studio 2017 dan terus dibuka di versi sebelumnya.

  • Pertama kali Anda memulai Visual Studio, diasumsikan Anda memilih pengaturan Pengembangan Web . Untuk informasi selengkapnya, lihat Cara: Pilih Pengaturan Lingkungan Pengembangan Web.

Setelah menginstal prasyarat, Anda siap untuk mulai membuat proyek Web yang disajikan dalam seri tutorial ini.

Mengunduh aplikasi contoh

Anda dapat mengunduh aplikasi sampel yang telah selesai kapan saja dari situs Sampel MSDN:

Mulai menggunakan ASP.NET 4.5 Web Forms dan Visual Studio 2013 - Wingtip Toys (C#)

Unduhan ini memiliki item berikut:

  • Aplikasi sampel di folder WingtipToys .
  • Sumber daya yang digunakan untuk membuat aplikasi sampel di folder WingtipToys-Assets di folder WingtipToys .

Unduhan adalah file .zip . Untuk melihat proyek lengkap yang dibuat seri tutorial ini, temukan dan pilih folder C# di file .zip. Simpan folder C# ke folder yang Anda gunakan untuk bekerja dengan proyek Visual Studio. Secara default, folder proyek Visual Studio 2017 adalah:

C:\Users\<username>\source\repos

Ganti nama folder C# menjadi WingtipToys.

Catatan

Jika Anda sudah memiliki folder bernama WingtipToys di folder Proyek Anda, ganti nama folder yang ada untuk sementara sebelum mengganti nama folder C# menjadi WingtipToys.

Untuk menjalankan proyek yang telah selesai, buka folder WingtipToys dan klik dua kali file WingtipToys.sln . Visual Studio 2017 membuka proyek. Selanjutnya, klik kanan file Default.aspx di Penjelajah Solusi dan pilih Tampilkan Di Browser.

Ikuti kuis ASP.NET Web Forms untuk meninjau konten

Setelah menyelesaikan seri tutorial, ikuti kuis untuk menguji pengetahuan Anda dan memperkuat konsep utama. Setiap pertanyaan memberikan penjelasan dan tautan ke panduan tambahan.

Dukungan tutorial dan komentar

Untuk pertanyaan dan komentar, gunakan bagian Q dan A yang disertakan di halaman sampel Memulai ASP.NET 4.5 Web Forms dan Visual Studio 2013 - Wingtip Toys (C#).

Komentar pada seri tutorial ini dipersilakan. Ketika seri tutorial ini diperbarui, setiap upaya dilakukan untuk mempertimbangkan koreksi atau saran untuk perbaikan.

Jika terjadi kesalahan, pesan kesalahan yang sesuai bisa membingungkan, tanpa penjelasan yang baik tentang cara memperbaikinya. Untuk bantuan, Anda dapat memeriksa forum ASP.NET. Sumber lain yang baik adalah bagian Q dan A di halaman sampel Memulai ASP.NET 4.5 Web Forms dan Visual Studio 2013 - Wingtip Toys (C#).