Membuat Website Pernikahan

Membuat Website Pernikahan

Beberapa hari lagi, saya akan melangsungkan pernikahan dengan pasangan saya. Persiapan telah dirancang jauh hari, koordinasi telah dilakukan serapi mungkin, undangan pernikahan juga telah didistribusikan sedini mungkin. Namun kemudian saya menyadari bahwa ada sesuatu yang kurang dalam informasi yang disampaikan di kartu undangan.

Iya, tidak semua orang mengenal saya ataupun Ami (pasangan saya), jika pun ada paling juga hanya orang yang pernah sekantor saja. Selain itu, saya yakin hal ini juga menimpa ke saya atau ke sebagian besar Anda, ketika menghadiri undangan pernikahan tapi nggak kenal dengan siapa yang menikah atau menjadi pasangan nikahnya.

Maka dari itu, saya membuat website pernikahan saya sendiri. Ide ini terinspirasi dari mas Budiyono yang pernah membuat website serupa untuk pernikahannya. Saya juga membuat URL yang sama dengan memanfaatkan nama domain yang telah saya miliki sebelumnya.

Urlnya: https://pernikahan.ami.dan.yogie.id

Itu adalah url yang saya buat, sengaja dibuat panjang dan langsung menginformasikan apa yang ada di dalamnya. Tadinya mau diisi dengan informasi atau foto-foto mengenai kami berdua, tapi kemudian disinilah kami sadar, bahwa ternyata kami berdua sama-sama tidak suka difoto dan sama-sama tidak suka mempublikasikan informasi di Internet. Ditambah, kami juga tidak mengadakan sesi foto pre-wedding. Mahal…

Akhirnya, websitenya hanya berisi informasi kecil namun tetap menggunakan standar yang telah saya tetapkan setiap membuat website untuk klien.

  • Dibangun menggunakan CMS WordPress di DigitalOcean cloud server.
  • Implementasi child themes Jupiter
  • Optimasi web cache
  • Optimasi SEO On-Page
  • Optimasi image compression
  • Implementasi CDN
  • Implementasi HTTPS, HTTP/2, dan HSTS
  • Menggunakan 4096 bit RSA Key (iya, saya selo)
  • Image Gallery dengan Instagram crawl by hashtag #amiyogie
  • Nempelin Paypal Donation (hahahaha…)

Semuanya dibuat dalam waktu 2 hari dan akan diaktifkan hingga waktu yang tak pernah ditentukan lagi.

Konfigurasi Website Dengan HTTPS Menggunakan Sertifikat SSL Gratis

Konfigurasi Website Dengan HTTPS Menggunakan Sertifikat SSL Gratis

Saya baru saja mengaktifkan HTTPS di beberapa website yang saya kelola, kemudian sesuai dengan judul artikel ini, semuanya saya dapatkan secara gratis dengan sedikit konfigurasi di nginx yang berjalan pada mesin Ubuntu 16.04. Kok baru sekarang? Iya, selain karena prokrastinasi juga karena ingin mengimplementasikan HTTP/2, dimana syarat menggunakan HTTP/2 adalah HTTPS.

Dulu, website yang menggunakan protokol HTTPS  masih terbatas pada website yang menangani transaksi sensitif, misalnya seperti Internet Banking atau E-Commerce. Hal ini wajar, karena pengguna (user) dari kedua website itu akan mengirimkan informasi sensitif yang berhubungan dengan keuangan, jadi perlu sesuatu yang akan mengamankan informasi di antara keduanya.

Tapi sebelumnya, saya mau coba untuk meluruskan sedikit salah kaprah mengenai protokol HTTPS. Saya sering mendapatkan pertanyaan mengenai kegunaan HTTPS yang dianggap akan mengamankan website dari serangan hacker, sehingga jika websitenya menggunakan HTTPS dijamin aman dari hacking. Jawaban saya: Benar, tapi kurang tepat.

Pertama, HTTPS pada website dapat aktif jika memiliki sertifikat SSL. Sertifikat ini akan menjamin bahwa semua transaksi dari pengguna menuju ke server dan sebaliknya akan aman dari penyadapan. SSL akan melakukan enkripsi data yang melewati jalur HTTPS dengan tingkatan tertentu, kemudian akan memberikan jaminan apabila datanya berhasil diintip oleh hacker, maka si pemilik website akan mendapatkan kompensasi yang nilainya cukup besar dari penjual SSL.

Kedua, HTTPS itu justru lebih mengamankan pengguna websitenya supaya merasa aman dan terlindungi ketika bertransaksi di website. Bagaimanapun juga website itu hanyalah sebuah program yang dibuat dengan bahasa pemrograman dan dijalankan pada mesin yang tersambung ke Internet. Semuanya dilakukan oleh mesin secara otomatis dan dibuat secanggih mungkin supaya dapat melayani manusia. Maka, perlu ditambahkan semacam penjamin bahwa siapapun yang bertransaksi dengan website itu, dijamin aman dan bisa dipercaya.

Jadi kesimpulannya, benar bahwa HTTPS merupakan salah satu metode untuk menghalau hacker, namun kurang tepat jika HTTPS akan menjamin websitenya tidak terkena serangan hacking, karena HTTPS dibuat bukan untuk melindungi website, melainkan untuk melindungi penggunanya.

Oke, bagaimana cara mengaktifkan HTTPS?

Yang jelas harus memiliki sertifikat SSL. Dahulu kala, sertifikat SSL hanya bisa didapatkan dengan cara membeli dan akan diperpanjang setiap tahunnya. Harganya bervariasi, tergantung jenis SSL yang akan dibeli dan tergantung tempat belinya juga. Penyedia sertifikat SSL ini cukup banyak di Internet dan menawarkan berbagai fitur dan harga. Saya pernah membeli Comodo SSL untuk salah satu klien saya, harganya termasuk murah jika dibandingkan dengan merk lainnya.

Selain bisa membeli di masing-masing penyedia sertifikat SSL, saya bisa juga membelinya di perusahaan hosting. Biasanya perusahaan hosting ini telah berafiliasi dengan penjual sertifikat SSL untuk bisa menawarkan ke membernya dengan harga spesial. Keuntungan lainnya, saya tidak perlu memikirkan cara instalasi karena semuanya sudah diurus oleh pihak hosting.

Bagaimana mendapatkan SSL gratis?

Tersebutlah Let’s Encrypt, sebuah organisasi nirlaba yang didukung oleh Internet Security Research Group (ISRG) untuk menyediakan sertifikat SSL secara gratis bagi orang yang ingin websitenya bisa menggunakan HTTPS. Cukup bermodal domain dan sedikit pengetahuan mengenai Linux saja.

Meskipun demikian hingga tulisan ini dibuat, Let’s Encrypt belum mendukung wildcard domain. Artinya, jika Anda memiliki domain utama dan subdomain, maka Anda harus membuat sertifikat SSL sejumlah domain yang akan diaktifkan.

Misalnya domain yogie.id saya ini punya subdomain lagi, seperti dosen.yogie.id dan engineer.yogie.id. Maka saya harus membuat 3 sertifikat SSL untuk domain utama dan 2 subdomain tadi. Tapi kabarnya, dalam waktu dekat Let’s Encrypt akan meluncurkan fitur wildcard domain, jika ini benar maka nanti saya cukup membuat 1 sertifikat SSL saja.

Bagaimana cara menerbitkan sertifikat SSL dari Let’s Encrypt?

Ini adalah bagian yang menarik, dulu saya pikir untuk mendapatkan sertifkat SSL bakalan ribet, ternyata tidak juga. Namun tutorial ini menyesuaikan dengan environment website saya ya, dimana saya menggunakan layanan cloud dengan sistem operasi Ubuntu 16.04, webserver nginx, dan php-fpm. Untuk Anda yang menggunakan layanan webhosting, saya belum mencobanya, tapi saya yakin banyak sekali tutorialnya di luar sana.

Pertama, pastikan website sudah beroperasional dengan baik di atas mesin Ubuntu 16.04 dan webserver nginx. Kemudian juga memiliki akses ssh yang dapat melakukan perintah “sudo” karena nanti kita akan menginstall beberapa paket di Ubuntu.

Selanjutnya, saya menginstall layanan Certbot di Ubuntu untuk penerbitan sertifikat SSL dari Let’s Encrypt. Certbot adalah program yang dirancang oleh Electronic Frontier Fondation (EFF) yang mempermudah proses integrasi sertifikat SSL dari Let’s Encrypt di layanan web server.

Setelah terinstall, saya cukup menjalankan Certbot dan mengikuti alur yang sudah tersedia. Oh iya, secara default Certbot akan menggunakan kunci 2048 bit untuk membuat sertifikat SSL. Saya meningkatkan kuncinya menjadi 4096 bit dengan alasan supaya lebih keren saja, tidak ada maksud apa-apa untuk pembuatan itu. Caranya juga mudah, cukup mengetikkan perintah berikut pada saat menjalankan Certbot.

sudo certbot --nginx --rsa-key-size 4096 -d yogie.id

Dalam waktu singkat, website yogie.id telah aktif HTTPS. Prosesnya hanya berlangsung beberapa detik saja dan sudah termasuk dengan redirect port dari 80 (http) ke 443 (https).

Pada artikel berikutnya, saya akan tuliskan bagaimana cara mengoptimasi settingan di atas, misalnya mengatur parameter Diffie-Hellman, auto-renewal pada sertifikat SSL, mengaktifkan HSTS dan HTTP/2.

Menghindari Kehilangan Data Sejak Dini

Menghindari Kehilangan Data Sejak Dini

Ceritanya akhir Juni 2017 lalu saya sempat kehilangan Macbook Pro di kereta Argo Bromo Anggrek, itu kejadiannya saat perjalanan pulang dari Jakarta ke Semarang. Modus operandinya sebetulnya tidak baru, yaitu menukar laptop dengan buku supaya beban di tas terasa sama, kemudian resleting tas dikasih lem alteco supaya susah dibuka. Mengenai bagaimana cara mereka menukar laptop menjadi tas, kebetulan saya bukan anggota komplotannya jadi belum dikasih tau caranya.

Oh iya, sempat ada kejadian yang bikin kesel, seminggu kemudian saya menemukan Macbook itu dijual di OLX, Bukalapak, dan Tokopedia secara bersamaan. Setelah saya lacak, tokonya ada di Semarang di wilayah Gunung Pati. Sempat ngobrol juga lewat Bukalapak Chat untuk lebih memastikan. Sayangnya ketika mau saya samperin dengan bantuan polisi, Macbook keburu laku hahaha.. Buat yang beli, saya ikut berbahagia kok, itu Macbook-nya sudah saya upgrade ke 16 GB RAM, SSD, dan ganti kabel harddisk yang sering jadi masalah di Macbook Pro unibody.

Oke, biasanya saat seseorang kehilangan perangkat kerja seperti laptop atau smartphone, maka yang akan terasa menyesak adalah kehilangan data. Disinilah peran IT harus dipergunakan secara maksimal, karena teknologi cloud computing sudah dapat digunakan ke end user (pengguna awam) secara mudah dan murah (bahkan gratis).

Kebetulan semua pekerjaan saya sudah tersinkronisasi dengan cloud. Misalnya untuk data di Macbook secara otomatis sudah terhubung dengan iCloud pada folder Documents dan Desktop, sehingga semua data-data baik untuk keperluan mengajar dan publikasi bisa terlindungi. Kemudian tim engineer di GDILab menggunakan teknologi GIT untuk repositori skrip, sehingga saya akan selalu punya update terbaru semua source code. Saya juga tidak pernah download film atau lagu karena telah dilayani oleh Spotify dan LK21, lalu untuk file-file yang berhubungan dengan pekerjaan juga masih tersimpan di Slack dan Trello. Praktis saya tidak memiliki file yang tersimpan di laptop selain yang ada di folder Download.

Alhamdulillah, pada awal Agustus 2017 saya bisa mendapatkan ganti Macbook Pro yang lebih baik daripada sebelumnya, sekarang saya menggunakan seri MF840. Langkah pertama yang saya lakukan pada perangkat tersebut adalah restore data dari setiap akun cloud yang menyimpan data-data saya. Hanya bermodalkan akses Internet yang baik, dalam waktu singkat saya sudah mendapatkan semua data saya kembali. Once you go to Mac, you never go back.

Jadi, bagaimana cara menghindari kehilangan data sejak dini? Mungkin bisa meniru cara yang saya gunakan, tetapi apabila Anda memiliki perangkat yang berbeda, mungkin bisa mengikuti panduan berikut:

  • Bila Anda memiliki laptop dengan OS Windows, buatlah akun Microsoft untuk menghubungkan perangkat Anda. Microsoft memiliki layanan OneDrive yang dapat digunakan untuk menyimpan data-data Anda dengan kapasitas tertentu, simpanlah data yang menurut Anda penting dan tidak bisa didapatkan dari tempat lain.
  • Anda tidak perlu download film atau lagu, manfaatkan layanan streaming baik yang berbayar atau gratis. Selain akan menghemat ruang penyimpanan data, juga akan terhindarkan dari perasaan eman-eman kehilangan data. Tarif dan kecepatan akses Internet saat ini sudah mulai masuk akal.
  • Manfaatkan layanan penyimpanan cloud seperti DropBox supaya data/file Anda tersinkronisasi dengan perangkat lain seperti smartphone atau tablet. Cukup install Dropbox pada masing-masing perangkat dengan akun yang sama, maka Anda akan memiliki data tersebut secara tersebar.

Mungkin itu saja tipsnya, tapi yang paling utama adalah meningkatkan kewaspadaan dan selalu menjaga perangkat kerja Anda dengan teliti. Ingatlah, kejahatan bisa terjadi bukan karena niat, namun karena ada kesempatan.

Waspadalah…

Mengapa Harus Memasang AMP (Accelerated Mobile Pages) di WordPress

Mengapa Harus Memasang AMP (Accelerated Mobile Pages) di WordPress

Sebagai dosen sekaligus praktisi, saya harus terus mengikuti perkembangan teknologi yang sedang terjadi di sekitar. Salah satunya adalah teknologi web yang merupakan salah satu bidang yang saya kuasai. Ketika membandingkan website di tahun 90-an dengan website di tahun 2017, lompatan teknologinya sudah sangat jauh, bahkan di beberapa tahun terakhir ini sudah bermunculan teknologi yang tidak terbayangkan sebelumnya.

Masih ingat ketika awal-awal munculnya smartphone, dimana pengguna sudah tidak memerlukan lagi perangkat komputer/laptop untuk dapat mengakses website. Disini perubahan paradigma desain website sudah harus berubah, tidak lagi berlomba-lomba menampilkan fitur dan efek yang wah, tapi sekarang harus memikirkan bagaimana tampilan website harus bisa dibuka dengan cepat dan ringan di perangkat smartphone. Bahkan muncul istilah baru, “responsive web design”.

Tentunya perubahan ini memakan korban, yaitu Flash. Memang sih, ketika semua orang masih mengakses website menggunakan komputer/laptop, Flash sangat berjaya, karena bisa menampilkan efek-efek yang indah di mata. Bahkan saat itu Javascript seakan-akan terpinggirkan dan tidak menarik untuk dipelajari. Namun begitu semua orang pakai smartphone, Flash tidak bisa bersaing karena masalah kompatibilitas. Padahal, website seharusnya multi-platform.

Javascript, yang tadinya sempat terlupakan ternyata diam-diam mengembangkan dirinya berevolusi menjadi teknologi yang sekarang menjadi tulang punggung layanan web (web services). Sekarang kita bisa menikmati teknologi website yang sesungguhnya, yaitu multi-platform.

Sekarang smartphone telah menguasai dunia, siapapun telah memilikinya, dan Indonesia adalah pengguna smartphone terbesar di Asia Tenggara (ya iya lah..). Jadi ada pasar besar yang menanti disini, tinggal gimana caranya supaya website bisa diakses oleh penggunanya yang memiliki koneksi Internet bervariasi.

Saya sudah mencoba hampir semua cara untuk mengoptimasi website supaya bisa diakses dengan cepat, hasilnya cukup memuaskan. Tetapi muncul masalah apabila website itu dikunjungi dari website lain, misalnya dari mesin pencari atau dari social media. Artinya, pengunjung tidak melakukan direct access melainkan datang dari website lain untuk menuju ke website kita.

Maksudnya begini, misalnya Anda sedang melakukan pencarian di Google kemudian mendapatkan hasilnya. Lalu Anda klik salah satu website yang terdaftar disana, maka Anda akan di-redirect dari Google menuju ke website yang dituju. Disinilah jeda itu muncul, meskipun hanya sepersekian detik namun jika Anda sedang melakukan riset dan ingin mendapatkan hasilnya secepat mungkin, maka waktu jeda itu terasa lama. Belum lagi jika website yang dikunjungi ternyata sedang down/maintenance.

Disinilah peran AMP (Accelerated Mobile Pages) diperlukan, terima kasih kepada Javascript yang telah membuat website menjadi lebih keren. Jadi AMP memungkinkan website dapat dibuka lebih cepat hampir tanpa ada delay, hal ini dikarenakan proses rendering akan berada di background sehingga user tidak merasakan proses menunggu saat loading website. AMP juga mengoptimasi penggunaan API preconnect supaya menghemat resource di prosesnya. Selain itu AMP mengharuskan untuk memodifikasi layout skrip sesuai dengan standar yang telah ditentukan.

Menarik ya? Bagaimana implementasinya?

Inilah salah satu alasan saya menyukai WordPress sebagai framework untuk pembuatan website. Memasang AMP di WordPress sangat mudah karena cukup menginstall plugin AMP sebagai pondasinya dan plugin AMP for WP – Accelerated Mobile Pages untuk modifikasi lebih lanjutnya. Kedua plugin ini sebaiknya diinstall semuanya supaya mendapatkan konfigurasi yang lebih lengkap.

Proses konfigurasi juga tidak rumit, setelah plugin Anda aktifkan cukup menuju ke halaman pengaturan plugin untuk memilih layout yang akan digunakan. Pada saat tulisan ini dibuat, saya menggunakan layout 3 sebagai theme AMP saya. Lanjutkan dengan konfigurasi pada menu-menu yang lain. Bila sudah selesai, maka Anda akan memiliki url tambahan /amp di setiap url website Anda. Contohnya https://yogie.id/amp.

Url berakhiran /amp itulah yang menandakan bahwa WordPress sudah siap untuk melayani dalam mode AMP. Untuk memastikan, bisa dengan melakukan validasi di web The AMP Validator, pastikan statusnya: PASS. Hasilnya, apabila ada orang yang melakukan pencarian di Google menggunakan perangkat smartphone, maka website Anda akan memiliki simbol AMP seperti gambar di bawah ini.