Mulai Pake ASP.NET Yuk

Jadi kemaren gw belajar ASP.NET bersama junior-junior gw di MIC. Padahal sebelumnya gw nggak pernah pake ASP.NET dan baru baca buku ASP.NET semalem sebelumnya. πŸ˜› Jadi sekarang gw pengen sedikit berbagi apa yang gw pelajari kemaren.

ASP.NET adalah teknologi yang didukung Microsoft dalam jajaran Microsoft .NET sebagai framework untuk membuat web application yang lebih baik. ASP.NET berbeda dengan web scripting pada umumnya seperti PHP, ASP Classic, maupun Perl. ASP.NET bukanlah web scripting tapi lebih menyerupai CGI (Common Gateway Interface). CGI itu sendiri adalah salah satu metoda pendelegaisan HTTP Request yang ditujukan kepada HTTP Server oleh klien ke executable eksternal. Aplikasi yang dibangun menggunakan ASP.NET dikompilasi dalam sebuah managed library DLL yang serupa dengan library .NET pada umumnya, dan HTTP server menjalankan library tersebut setiap kali ada rekues kepada server.

Kelebihan metoda ini dibandingkan scripting biasa adalah server menghemat waktu proses kompilasi dan parsing dari skrip yang setiap kali direkues oleh klien. PHP, ASP Classic, dan Perl selalu melakukan proses kompilasi dan parsing setiap kali terdapat rekues ke halaman tersebut. Hal ini sedikit menurunkan performa. Pada ASP.NET, tidak ada lagi tahapan kompilasi dan parsing karena seluruh source code sudah di-compile menjadi sebuah managed library yang tinggal dieksekusi oleh server ketika ada permintaan.

Nah sekarang kita coba mulai bikin web application pake ASP.NET yuk. Gw mau nyontohin bikin aplikasi konversi suhu sederhana.

1. Buat project baru di Visual Studio. Kita bisa memilih Empty Web Application, maupun membuat website baru pada menu New Web Site.

 

2. Buat halaman baru, pilih Add New Item, dan pilih Web Form.

 

3. Setelah muncul halaman baru, ketiklah code berikut ini:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="Latihan1.Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
	<title></title>
</head>
<body>
	<form id="htmlForm" runat="server">
	<div>
		<h1>Program Konversi Suhu</h1>
		<label>Suhu: </label><input id="txtSuhu" type="text" runat="server" />
		<div>
			<table>
				<tr>
					<td>Dari:</td>
					<td><label>Fahrenheit</label><input id="rdDariFahrenheit" value="9" name="grpDari" type="radio" checked="true" runat="server" /></td>
					<td><label>Celcius</label><input id="rdDariCelcius" value="5" name="grpDari" type="radio" runat="server" /></td>
					<td><label>Reamur</label><input id="rdDariReamur" value="4" name="grpDari" type="radio" runat="server" /></td>
				</tr>
				<tr>
					<td>Ke:</td>
					<td><label>Fahrenheit</label><input value="9" id="rdKeFahrenheit" name="grpKe" type="radio" checked="true" runat="server" /></td>
					<td><label>Celcius</label><input value="5" id="rdKeCelcius" name="grpKe" type="radio" runat="server" /></td>
					<td><label>Reamur</label><input value="4" id="rdKeReamur" name="grpKe" type="radio" runat="server" /></td>
				</tr>
			</table>
		</div>
		<div>
		<span id="lblHasil" runat="server" style="font-weight:bold;"></span>
		</div>
		<input id="btnKonversi" type="submit" value="Konversi" runat="server" onserverclick="btnKonversi_ServerClick" />
		<input id="btnReset" type="reset" value="Ulangi" />
	</div>
	</form>
</body>
</html>

4. Kemudian, pada code-behind, yaitu pada file .aspx.cs dari file tersebut, ketiklah code berikut ini:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace Latihan1
{
	enum Suhu
	{
		Celcius = 5,
		Reamur = 4,
		Fahrenheit = 9
	}
	public partial class Default : System.Web.UI.Page
	{
		protected void Page_Load(object sender, EventArgs e)
		{

		}

		protected void btnKonversi_ServerClick(object sender, EventArgs args)
		{
			double suhu = 0;
			try
			{
				suhu = double.Parse(txtSuhu.Value);
			}
			catch (Exception)
			{
				lblHasil.InnerText = "Mohon masukkan bilangan desimal pada kolom suhu.";
				return;
			}

			int dari	= int.Parse(this.Request.Params["grpDari"]),
				ke		= int.Parse(this.Request.Params["grpKe"]);

			Suhu enDari = (Suhu) dari,
				 enKe = (Suhu) ke;

			double suhuAwal = suhu;

			if (enDari == Suhu.Fahrenheit)
				suhu -= 32;

			suhu *= (double) ke / dari;

			if (enKe == Suhu.Fahrenheit)
				suhu += 32;

			lblHasil.InnerText = suhuAwal + " " + Enum.GetName(typeof(Suhu), dari) + " = " + suhu + " " + Enum.GetName(typeof(Suhu), ke);
		}
	}
}

5. Tekan F5 untuk menjalankannya

Pada aplikasi tersebut, kita menggunakan HTML Control yang merupakan extension ASP.NET untuk HTML tag standar. Fitur ini memudahkan pengguna pemula maupun pengguna yang bermigrasi dari bahasa pemrograman web lainnya. Pada tag HTML, kita cukup menambahkan atribut runat=”server” dan atribut id yang unik agar server dapat menerjemahkan tag tersebut sebagai HTML Control. Jika kita menambahkan atribut-atribut tersebut, kita dapat mengambil referensi dari tag tersebut karena secara implisit ASP.NET merepresentasikannya sebagai objek dari kelas-kelas yang terdapat pada namespace System.Web.UI.HtmlControl. Sebagai contoh pada code-behind tersebut terdapat referensi dari txtSuhu yang merupakan representasi dari tag input dan kita dapat mengaksesnya sebagai objek dari HtmlInputText.

Selain itu kita juga memperoleh tipe suhu yang dipilih oleh user dengan membaca parameter rekuesnya. Pada bagian kode terdapat referensi kepada this.Request.Params yang merupakan sebuah collection dari parameter-parameter dari proses HTTP Request. Kita dapat mengaksesnya dengan memasukkan name dari field pada form yang terdapat di halaman web tersebut. Sebagai contoh, salah satu name yang diakses adalah grpDari dan grpKe.

Selebihnya, sama seperti kita membuat aplikasi untuk desktop, kita tinggal menambahkan alur program pada code kita. πŸ˜€

 

Mungkin Anda juga menyukai

21 Respon

  1. ken berkata:

    Wew walopun belajar duluan dari lu, tapi ternyata gw blom pernah belajar konsepnya ASP.NET.. Baru tau dari lu istilah CGI bgitu.. hohoho.. Mantab2 πŸ˜€

    ~tapi ketiklah kode berikut ininya kebanyakan.. πŸ˜›

  2. Gilang berkata:

    Hehehe.. saya cuma mencoba berbagi apa yang saya ketahui tentang konsep-konsep web server.. πŸ˜€

    ~Gw nyuruh tinggal ketik aja biar langsung jalan. Wkwkwkwkw

  3. Erik rusbiantara berkata:

    dear mas gilang,
    slm kenal mas,
    saya mhs dari bali..
    saya baru tahap pemula dalam penggunaan asp.net, saya mau nanya nie..saya kurang mengerti penggunaan ‘namespace’ serta ‘inherits’, masalahnya…saya mendeklarasikan 2 file dfolder ‘App_Code’ yang berjenis .vb, dan kedua file tersebut berfungsi dan dideklarasikan difile defualt.aspx, saya mau nanya :
    1)apakah saya harus mendeklarasikan 2 namespace di file β€œDefault.aspx.vb”??..
    2)serta difile ‘Default.aspx’ apakah saya harus dobel mendeklarasikan fungsi ‘inherits’nya?? krn setahu saya fungsi β€˜inherits’nya jg harus dideklarasikan sesuai dgn nama namespacenya yang ada didefault.aspx.vb…
    mohon pencerahannya mass..
    thankz sebelumnya..

    • Gilang berkata:

      @Erik:
      Hehehe.. Thanks for reading and salam kenal juga! Gw juga masih belajar ASP.NET jadinya gw nyoba ngejawab pertanyaannya sebisa gw ya: πŸ˜€

      Pertama, konsep namespace sebenarnya adalah mengelompokkan class-class maupun module-module (di VB) ke dalam suatu “building block” tertentu agar terorganisasi dengan baik. Namespace bawaan .NET contohnya System, System.Web, System.Windows, dll. Nah kalo lu bikin class/module terpisah di aplikasi ASP.NET, kalo di VB biasanya secara default dia tergabung dalam namespace default dari aplikasi yang biasanya juga sama dengan nama aplikasi. Jadi sebagai contoh lu bikin class namanya TestClass di file TestClass.vb, maka untuk me-refernya dari file source code lainnya termasuk file .aspx.vb adalah cukup dengan menggunakan nama tipe TestClass, Dim var1 As TestClass. Jika TestClass di-enclose dalam suatu namespace spesifik, misalnya Library, maka untuk memanggilnya bisa dengan Dim var1 As Library.TestClass

      Nah untuk inherit, gw rasa lu salah mengerti maksud dari keyword Inherit di sini. Inherit adalah keyword untuk melakukan inheritance dalam paradigma OOP. Nah di file Default.aspx.vb terdapat baris Inherits System.Web.UI.Page yang menunjukkan bahwa class _Default tersebut adalah “turunan” dari class System.Web.UI.Page. Ini sama sekali tidak berhubungan dengan me-refer class yang ditulis di file lain.

      Nih untuk referensi tentang namespace dan inherits

      Semoga membantu πŸ˜‰

      @Ryan:
      entar gw bikinin post sendiri deh. Gw juga pernah pengalaman pake VB soalnya. Hehehehe πŸ˜€

  4. Ryan berkata:

    Naah mumpung anak MSP nih… haha
    Agak out of topic sih (kalau mau dihapus ya silahkan saja)
    Pertanyaan saya adalaah….

    Kenapa C# sih?

    Di internet buaaanyak sekali debat kusir antara C# dan VB, dan setelah dirata-rata semuanya begini:
    1. Programmer VB merasa bodo amat sama C# (klo mereka mau pake C# ya silahkan saja, gw tetep pake VB)
    2. Programmer C# bilang semua programmer VB harus pindah ke C#.

    Microsoft waktu bikin ASP (yang bukan .NET) dulu sengaja membuat VBScript sebagai bahasa defaultnya.
    Tapi sejak .NET berjaya (nggak cuma ASP), semua temen2ku kalau disuruh kerjain C# sih oke, tapi kalau disuruh VB dari awal udah nggak mau.

    Emangnya VB salah apa sih? (bahkan VS2010 untuk develop windows phone 7 cuma dikasi C#, VS2008 untuk develop multipoint cuma dikasi C#)… Mungkin VS2012 udah ga ada lagi pilihan VB sama sekali.

  5. Yoza Wiratama berkata:

    Gilang…
    Gw uda mulai belajar ASP.Net
    dan luar biasa mudah banget dipahami, walo lom lancar2 banget make nya

    cuma gw dengar kabarnya ASP.Net nggak se powerfull PHP ya?
    apa benar begitu?

  6. Erik rusbiantara berkata:

    untuk ‘inherits’ bkn inherits di file ‘default.aspx.vb’ yang saya mksd mas,tp di file ‘default.aspx’ kan ada tuch dibagian tag paling atas fungsi ‘inherits’nya..example nya: ..
    ‘findsampleweb’ adalah nama namespace yang ada difile vb, trus kalau file vbnya atau pendeklarasian namespace difile vbnya lebih dari satu (masing2 file vbnya pny pendeklrasian namespace),,gmn pendeklarasian fungsi ‘inherits’ difile default.aspxnya mas??
    mohon pencerahannya..
    thankz..

    • Gilang berkata:

      @Erik:
      Oooh.. Kalo yang itu engga perlu ditambahin apa-apa. Maksud dari inherits di file itu tuh untuk “menempelkan” file ASPX tersebut dengan suatu class dalam source code VB.NET/C#. Jadi contohnya misalnya di file Blah.aspx terdapat deklarasi atribut inherits=”AplikasiGw.Blah” artinya file Blah.aspx tersebut akan ditempelkan ke class AplikasiGw.Blah. Jika kita melakukan referensi terhadap namespace apapun di source code VB.NET/C#-nya, isi property inherit tersebut sama sekali jangan dirubah. Property tersebut selalu autogenerated dan lebih baik jangan diutik-utik daripada nanti malah aplikasinya engga jalan. Gitu. Nih sedikit referensi tentang atribut inherit di ASPX di sini.

      @Yoza:
      Menurut gw ada kelebihan ama kekurangannya. PHP itu powerfull kalo udah soal templating. Kemaren gw juga baru baca-baca WordPress engine dan untuk merancang theme di WP yang mana benar-benar menggunakan keunggulan inline-coding dari PHP yang membuat proses itu jauh lebih mudah. Sedangkan kalo di ASP.NET kalo gw bayangkan πŸ˜€ untuk melakukan hal templating kayak punya WP dan PHP tersebut sangat sulit.

      Nah kalo PHP kan pure scripting, setiap kali mendapat requestr, PHP akan menginterpret skrip sekaligus melakukan prosedur-prosedur kompilasi (nah ilmu dari Teknik Kompilator nih :P), nah prosedur kompilasi tersebut dilakukan berulang-ulang setiap kali client melakukan request ke server. Sebenernya itu cukup membuang resource yang lumayan. Nah kalo di ASP.NET, urusan kompilasi source-code sudah dilakukan oleh compiler sebelumnya. Web Server tinggal secara reflektif memanggil compiled MSIL (Bytecode-nya .NET) dan melakukan parsing file XML dari file ASPX tersebut. Mengeksekusi kode yang sudah pre-compiled sama mengompile berulang-ulang kan lebih hemat mengeksekusi kode yang sudah pre-compiled. Gitu πŸ˜€

      Tapi kalo gw sih kayaknya emang bakal stick ke PHP dulu kok. Teknologi ASP.NET terlalu mahal karena lu harus siap dengan lisensi Microsoft Windows yang engga murah. πŸ˜›

  7. adhi berkata:

    maaf sebelumnya..
    saya baru banget buka asp.net + baru mulai belajar
    saya coba dengan mencontoh source code diatas
    tapi ada sedi kit kendala yang bikin pusing saya.
    ada pesan error seperti ini :

    Compiler Error Message: CS0234: The type or namespace name ‘Linq’ does not exist in the namespace ‘System’ (are you missing an assembly reference?)

    itu kenapa ya…?

    mohon bantuannya…
    thx..

  8. Gilang berkata:

    Itu karena anda belum memasukkan referensi library untuk LINQ ke project anda. Ada beberapa workaround yang bisa dilakukan:

    1. Hapus baris

    using System.Linq;

    jika anda tidak menggunakan teknologi LINQ, atau
    2. Pastikan anda menggunakan .NET Framework 3.5 keatas agar namespace System.Linq dikenali

  9. adhi berkata:

    klw untuk dapetin library LINQ itu dmn ya..
    trus cara untuk menambahka nya ke project gmn ya..

    saya sudah coba untuk menghapus
    using System.Linq;
    tapi malah banyak error nya spt ini:
    Compiler Error Message: CS0115: ‘ASP.default2_aspx.GetTypeHashCode()’: no suitable method found to override

    tolong pencerahannya dan klw bisa minta tutorialnya….

    thx…….

  10. Gilang berkata:

    Maaf baru bales πŸ˜‰

    Hmm.. Mestinya itu kalau target frameworknya sudah .NET 3.5, System.Linq secara default pasti ada, baik itu untuk Windows Form, maupun development ASP.NET. Untuk ngecek target frameworknya:
    – Klik kanan di project yang ditampilkan di Solution Explorer, pilih Properties
    – Pada tab Application, ada drop-down Target Framework, pastikan itu .NET Framework 3.5 keatas. Jika masih .NET Framework 2.0 atau 3.0, ubah jadi 3.5.

  11. adhi berkata:

    sudah di coba.,

    saya sudah “Klik kanan di project yang ditampilkan di Solution Explorer, pilih Properties”

    masih gag ketemu “tab Application”

    mohon bantuannya lagi mas….:D

    thx…….

  12. Erik rusbiantara berkata:

    mas..
    saya mau nanya nie..oya sintak buat open link new tab (link dan membuka tab baru) di asp.net gmn ya mas?
    mohon bantuannya..
    thankzz..

    • Gilang berkata:

      @adhi: Itu kalau udah keluar Properties window dari projectnya kan di samping kiri ada daftar pilihan salah satunya Application

      @Erik: Setahu gw di konvensi HTML tidak ada attribute agar hyperlink dibuka di New Tab.. Adanya di New Page. Semua tergantung browser yang menginterpretasikannya. Kalo di IE8 dia buka di window baru. Tapi kalo di Chrome dia ngebuka di tab baru. Contoh tagnya gini <a href=”target URL” rel=”nofollow”>anchor text</a>. Tapi itu kalo ga salah ngga comply XHTML. Berhubung gw juga masih jarang pake ASP.NET, gw ga tau sintaks di C#/ASP.NET yang ekivalen sama itu πŸ˜›

  13. shofa berkata:

    mas mau tanya, klo sintaks untuk submit data ke database access gimana ya? terima kasih sebelumnya.. πŸ™‚

  14. nr2ch berkata:

    Salam kenal semua penggemar Asp.Net…
    Saya mau tanya ni…
    saya Membuat aplikasi Database menggunakan Sql server 2005 dan Asp.Net menggunakan VB..
    ada yang tau g cara buat menu Tab menggunakan CSS dan VB ?
    Please Help me…

  15. Karen berkata:

    thanks gan atas pencerahaannya… n lam kenal ja..
    ini aku punya sharing projek .. :

    http://www.uploadstation.com/file/3cMEe8P
    http://www.uploadstation.com/file/qc29hvN

  16. Brian berkata:

    Salam kenal smua.

    Saya lg ngerjain proyek C# .NET di prusahaan.
    Kira-kira bisa ga satu aplikasi menggunakan 2 database yang berbeda???

    Mohon pencerahannya..

  17. zulfikri berkata:

    aslkm,,,
    ada yg saya mo tnyain nie mas,,,saya skarang lgi ngerjain pi d kampus judulnya membuat aplikasi toefl online menggunakan asp.net,,,
    yg jadi masalah saya baru pertama kali ngeliat n gunain software ini…kira2 apa y mas yg harus saya kerjain dahulu??
    saya pke microsoft visual veb developer express 2010…
    sekian,,terima kasih…:)

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *