Memisahkan antara tag HTML dengan teks di sekitarnya:
var test = 'foo <a b="c">bar</a> baz <b> qux yo"s <c><d> wut?';
var results = [];
test.replace(/([^<>]*?)(<\/?[-:\w]+(?:>|\s[^<>]*?>)|$)/g, function(a, b, c) {
if (b) results.push(b);
if (c) results.push(c);
});
console.log(results);
Dengan cara ini Anda dapat melakukan manipulasi teks dengan aman tanpa harus mempengaruhi tag HTML. Caranya adalah dengan mengecek terlebih dahulu apakah anggota merupakan tag HTML atau teks:
var output = "";
for (var i = 0, len = results.length; i < len; ++i) {
var s = results[i];
// Is this a HTML tag or text?
if (s && s[0] === '<' && s.slice(-1) === '>') {
// this is a HTML tag …
output += s;
} else {
// do something with text …
output += s.replace(/"/g, '"');
}
}
console.log(output);
Kode di bawah ini akan memisahkan antara tag HTML dengan nama tertentu saja, sehingga teks bisa saja berisi tag HTML yang diperbolehkan. Ini berguna jika Anda ingin melakukan manipulasi teks di luar tag tertentu saja, misalnya tag <kbd>, <pre>, <script> dan <style>:
var test = 'foo <a b="c">bar</a> baz <b> qux yo"s <c><d> wut? <kbd>ignore this yo"s</kbd>';
var results = [];
test.replace(/(.*?)(<\/?(?:kbd|pre|script|style)(?:>|\s[^<>]*?>)|$)/g, function(a, b, c) {
if (b) results.push(b);
if (c) results.push(c);
});
console.log(results);
Berikut ini adalah cara mengubah karakter " yang berada di luar tag <kbd> menjadi ":
var output = "";
var skip = false;
for (var i = 0, len = results.length; i < len; ++i) {
var s = results[i];
if (s && s[0] === '<' && s.slice(-1) === '>') {
// check whether the HTML tag is an opening or closing tag …
skip = s[1] && s[1] !== '/';
output += s;
} else {
output += !skip ? s.replace(/"/g, '"') : s; // replace or skip …
}
}
console.log(output);
Mendukung hampir semua markup seperti yang dinyatakan dalam dokumentasi Markdown Extra, kecuali markup catatan kaki, abbreviasi, daftar definisi, tautan ber–referensi dan gambar ber–referensi.
Server lokal atau localhost atau virtual web server atau virtual web hosting merupakan server web yang bersifat offline. Ketika sebuah situs web yang asli bisa diakses dengan cara mengetik alamat seperti http://www.example.com, maka sebuah situs web lokal pada umumnya dapat diakses dengan cara mengetik alamat http://localhost. Server lokal digunakan sebagai alat bantu untuk membuat situs web secara offline tanpa koneksi internet. Di dalam sebuah aplikasi server lokal biasanya sudah terdapat beberapa fitur yang ada di dalam server web online yang ada di internet pada umumnya seperti PHPMyAdmin, PHP, MySQL dan Apache. Aplikasi yang paling sering digunakan —terutama untuk menangani berkas-berkas dengan ekstensi .php— adalah WAMPSERVER dan XAMPP. Proses instalasi sangat mudah: Unduh salah satu aplikasi tersebut sesuai dengan tipe Sistem Operasi yang Anda pakai (32 bits atau 64 bits). Buka berkas hasil unduhan, kemudian akan muncul jendela bimbingan instalasi aplikasi, setelah itu tinggal klik next…next…next… saja, I agree with the term of service… dan seterusnya sampai muncul tombol Finish.
Sebagai contoh, di sini Saya menggunakan WAMPSERVER sebagai server lokal. Yang paling penting untuk Anda perhatikan adalah ada pada folder www, selebihnya bisa Anda abaikan terlebih dahulu sebagai tahap awal latihan. Masing-masing aplikasi server lokal memiliki nama folder publik mereka sendiri. Sebagai contoh, XAMPP memiliki folder publik bernama htdocs. Tapi secara umum Anda akan dapat menemukan folder-folder publik pada aplikasi-aplikasi semacam ini dengan nama www, public_html dan htdocs. Ini juga akan Anda temukan pada server web yang asli, jadi Anda tidak perlu bingung.
Klik ikon WampServer yang ada di desktop komputer Anda, atau kalau tidak ada Anda bisa mencari programnya melalui tombol Start. Setelah itu akan muncul kotak dialog User Account Control. Klik tombol Yes. Lihat daftar ikon pada Taskbar atau Superbar di sebelah kanan bawah, di situ seharusnya akan muncul ikon WAMPSERVER berwarna merah, yang secara normal seharusnya akan berubah warna menjadi jingga dan kemudian menjadi hijau secara perlahan.
Buka peramban favorit Anda, lalu akses alamat http://localhost. Jika muncul halaman seperti ini, maka itu artinya proses instalasi telah berhasil dilakukan dan server lokal Anda sudah siap untuk digunakan: Halaman awal server WAMP.
www
Kembali ke folder www. Jika sebelumnya Anda tidak mengubah-ubah pengaturan lokasi folder wwwpada saat instalasi, maka folder tersebut seharusnya akan terletak pada lokasi C:\wamp\www. Anda bisa dengan mudah mengakses lokasinya melalui menu: Menu server WAMP.Anda bisa membuang semua berkas yang ada di dalamnya, tapi untuk berjaga-jaga, Anda bisa membiarkan mereka seperti apa adanya sampai Anda cukup percaya diri untuk membuangnya. Di dalam folder ini Anda bisa memasukkan berkas-berkas web Anda untuk ditampilkan di layar peramban nantinya. Sebagai contoh, Anda membuat berkas bernama tes-halaman.php pada folder ini, maka Anda akan bisa mengakses berkas tersebut melalui alamat http://localhost/tes-halaman.php
Sebenarnya Anda bisa melakukan hal ini di lokasi mana saja di folder komputer Anda, hanya bedanya, Anda tidak akan bisa menerjemahkan kode-kode Hypertext Preprocessor menjadi HTML jika berkas tersebut tidak ditempatkan di dalam folder www. Misalnya Anda membuat berkas tes-halaman.php di desktop, maka Anda bisa membuka berkas tersebut dengan cara klik-kanan pada ikon berkas dan kemudian pilih Open with » Firefox (misalnya). Sehingga pada address bar akan tampil alamat seperti file:///C:/Users/DTE/Desktop/tes-halaman.php
Seperti itu saja dulu. Selanjutnya Anda bisa mencoba belajar bahasa pemrograman PHP atau sekedar mengetes CMS yang Anda unduh di dalam folder ini. Cukup salin dan tempel berkas saja seperti biasa. Target Saya membuat tutorial ini sebenarnya adalah untuk memperkenalkan CMS Mecha pada pembaca, tapi rilis versi stabil yang terakhir masih belum ada dan masih dalam tahap pengetesan.
Berikut ini adalah fungsi PHP terpisah yang telah Saya gunakan untuk mengompresi kode HTML, CSS dan JavaScript pada CMS Mecha.
Fungsi ini akan menunjukkan ukuran sebuah folder/direktori dengan cara menghitung jumlah total ukuran semua berkas yang ada di dalamnya.
Menyisipkan HTML mentah atau statis ke dalam variabel itu mudah. Pakai saja file_get_contents():
$html = file_get_contents('page.html');
echo $html; // tampilkan hasil
Tapi menyisipkan HTML dinamis yang di dalamnya berisi perintah-perintah PHP ke dalam variabel itu tidaklah mudah. Pertama-tama kita harus menyisipkan berkas tersebut ke dalam halaman, tapi jangan sampai berkas tersebut tampil. Kita hanya akan mengambil hasil renderperintah PHP di dalam berkas HTML tersebut untuk kemudian bisa kita simpan ke dalam variabel seperti contoh di atas:
Tampilan Buku TamuSaya membuat aplikasi Buku Tamu tanpa basis data dengan PHP. Semua data disimpan di dalam sebuah file TXT sebagai pengganti basis data. Ide asli diambil dari sini.
Pada versi Saya, Saya tidak menggunakan captcha gambar, melainkan hanya menggunakan tantangan matematika yang lebih sederhana namun relatif aman. Kode ini dituliskan secara baru, mulai dari awal dan bukan merupakan hasil modifikasi. Beberapa fitur baru yang Saya berikan:
Memungkinkan pengguna untuk menambahkan URL.
Tanggal penerbitan tersedia, dan akan ditampilkan di pojok kanan atas secara normal.
Memungkinkan pengguna untuk membagikan pesan secara individual melalui tautan permanen.
Memungkinkan administrator untuk membuat “database” baru tanpa harus menghapus data yang lama.
Memungkinkan administrator dan pengguna untuk memuat data lama melalui parameter URL berupa nama file.
Sistem keamanan yang lebih baik:
Pengguna wajib menjawab tantangan matematika sederhana.
Pembatasan jumlah karakter pada setiap bidang.
Secara otomatis mengubah kode HTML menjadi entitas HTML untuk keamanan, dan hanya akan menerjemahkan kode HTML yang diperbolehkan saja.
Pesan kesalahan akan tampil lebih jelas, serta data yang telah pengguna masukkan sebelumnya ke dalam formulir akan tetap tersimpan di sana sebelum pengguna berhasil mengirimkan pesannya.
Tautan di dalam pesan akan terhapus secara otomatis.
Ekstrak file unduhan untuk mendapatkan folder guestbook. Masukkan folder tersebut beserta isinya ke dalam folder public_html atau www pada server lokal Anda. Tidak perlu konfigurasi khusus. Sekali pasang langsung jalan! Jika Anda ingin melakukan konfigurasi, maka itu hanya sebatas pada penamaan “database”, pengaturan panjang karakter maksimal dan penyesuaian teks pesan peringatan.
Jika sudah selesai, buka alamat http://localhost/guestbook/index.php pada peramban untuk melihat hasilnya.
Tidak ada fitur emotikon. Terlalu berlebihan untuk diterapkan pada aplikasi yang sederhana dan bukan merupakan kebutuhan primer. Anda bisa dengan mudah membuatnya sendiri melalui perintah preg_replace() seperti ini:
Ketika Anda merasa bahwa file TXT yang Anda buat sudah terlalu besar ukurannya, atau membuat proses muat halaman menjadi lambat, Anda bisa mengatasinya dengan cara mengganti nilai $database dengan nama yang baru untuk menciptakan file TXT baru tanpa harus menghapus yang lama. Untuk memuat data yang lama ke dalam halaman buku tamu agar bisa ditampilkan ke publik (katakanlah Anda telah membuat pengaturan khusus agar pengguna tidak bisa melihat file dengan format TXT), Anda bisa menambahkan parameter data dengan nilai berupa nama “database” seperti ini:
Atau kalau memang data-data di dalam buku tamu Anda itu tidak penting, Anda bisa menghapus file tersebut begitu saja kalau mau. Semua kode sudah Saya lengkapi dengan penjelasan. Silakan dipelajari atau digunakan jika dirasa berguna.
Tidak ada komentar:
Posting Komentar