Membuat Halaman Web Sederhana dengan WebMatrix

Jika sebelumnya anda sudah terbiasa dengan tools atau code editor yang anda gunakan untuk membangun sebuah halaman web, WebMatrix juga memungkinkan anda untuk membuat halaman web berbasis asp.net dan php dengan mudah.
Jika anda belum tau apa itu WebMatrix, anda bisa membaca tulisan saya sebelumnya disini
Kali ini kita coba membuat satu halaman sederhana menggunakan WebMatrix. Sekarang Jalankan WebMatrix.


Pada halaman Quick Start anda pilih Site From Template. Terdapat beberapa template yang siap anda gunakan untuk membuat situs web. Seperti :
· Empty Site. Template ini dapat anda gunakan apabila anda ingin membuat situs web dari awal.
· Starter Site. Template ini memberikan Anda sebuah situs dengan tata letak yang dirancang secara profesional dengan sistem login.
· Bakery. Template ini dapat Anda gunakan untuk membangun sebuah situs yang berisi database produk Anda seperti halnya took jual beli.
· Link Directory. Template ini dapat anda gunakan untuk membuat situs direktori link beserta deskripsinya.
· Photo Gallery. Template ini dapat Anda gunakan untuk membuat sebuah situs galeri yang memungkinkan pengguna dapat mengupload dan menampilkan foto dengan system login.
· Wishlist. Template ini dapat anda gunakan untuk membuat seuatu planning atau harapan yang ingin anda capai. Anda bisa membuat daftar produk yang ingin anda beli dan hanya anda yang tau.
Karena kita akan membuat halaman baru maka anda pilih Empty Site dan ubah nama web sesuai keinginan anda.

Di bagian atas, Anda melihat Quick Access Toolbar dan ribbon, seperti pada Microsoft Office 2010. Di kiri bawah, terdapat WorkSpace. Di sebelah kanan terdapat konten, yang dapat anda gunakan untuk mengedit dan melihat file, dsb.

Untuk membuat halaman baru anda pilih menu Files di WorkSpace, Kemudian klik Add a file to your Site atau dengan klik New pada toolbar.

WebMatrix menampilkan daftar jenis file. Sebagian besar mungkin akrab dengan ekstenssi file seperti HTML, CSS, ASP, Javascript, dan lain-lain.

Pilih CSHTML, dan pada kotak name isi default.cshtml. CSHTML adalah tipe khusus dari halaman dalam WebMatrix yang dapat anda isi dengan pemrograman web html, javascript dan lain-lain.
Klik OK, WebMatrix akan membuat halaman baru dan membuka sebuah kode editor.

Seperti yang Anda lihat, ini adalah HTML markup. Anda bisa mengubahnya dengan tag HTML biasa. Pada contoh saya menambahkan beberapa tag html sederhana :

Kemudian Save dan Run. Maka akan tampil di browser seperti gambar di bawah ini :

Selamat mencoba.

Posted in: Web Matrix