Lompat ke konten Lompat ke sidebar Lompat ke footer

Cara Membuat Multi Domain di Localhost Menggunakan XAMPP

Cara Membuat Multi Domain di Localhost Menggunakan XAMPP - Buat temen-temen yang lagi belajar membuat website dan menghostingkannya secara offline, di artikel ini akan saya bahas cara yang cukup keren dengan harapan bisa membuat temen-temen tambah semangat belajar membuat websitenya.

Sautu website yang sudah jadi biasanya akan dihosting dan dibelikan domain, dengan demikian akan bisa diakses secara online.

Tetapi ketika suatu website dalam tahap pengembangan, mungkinkah untuk dilakukan hosting dan membeli domain agar bisa diakses secara online?

Tentu tidak, pada umumnya web developer akan memilih untuk melakukan hosting secara offline (hosting lokal).

Selain hemat biaya, menghosting web secara lokal sangat cocok dilakukan saat web dalam proses pengembangan.

Lalu apa maksud dari hosting lokal? Maksudnya adalah website yang dalam pengembangan tadi dapat diakses melalui browser tanpa perlu menyambungkan komputer dengan koneksi internet.

Wah keren ya, tapi apa bisa web yang dihosting offline diberikan domain? Bisa-bisa saja, tergantung si developer maunya kaya' gimana

Jujur di sini saya belum menjadi seorang web developer, akan tetapi tidak salah juga jika saya membagikan ilmu yang saya dapat dari bangku perkuliahan, dan saya jamin cara ini 100% work.

Sebagai informasi saja, saya juga mendapatkan tutorial ini langsung dari dosen saya, jadi benar-benar dari referensi yang terpercaya.

Saya selalu mencari data kebenaran sebelum menuliskan artikel di dalam blog ini. Jadi silahkan jika kalian ingin membaca artikel saya yang lain, bisa melihat daftar artikel pada blog ini..

Apa itu XAMPP?

Sebelum melangkah lebih dalam, alangkah baiknya jika kita mengenal XAMPP yang nantinya akan berperan penting dalam pembahasan ini.

XAMPP merupakan perangkat lunak open source yang mendukung banyak sistem operasi serta merupakan kompilasi dari berbagai program. Perlu kalian ketahui juga bahwa XAMPP berfungsi sebagai server yang berdiri sendiri secara lokal yang memiliki beberapa program yang dapat digunakan.

Program dari XAMPP antara lain adalah Apache, MySQL database dan beberapa program yang lain.

Perlu diketahui juga sebagai ilmu dasarnya, ketika kalian sedang belajar pembuatan website dasar, misal hanya front end nya saja, dan ingin menghostingnya secara offline, kalian bisa mengaktifkan program Apache pada XAMPP untuk dapat menjalankan web melalui browser, sedangkan jika sudah sampai back end nya seperti mengolah database, kalian perlu juga mengaktifkan program MySQL pada XAMPP.

Bagaimana Cara Hosting Offline Menggunakan XAMPP?

Seperti yang saya katakan di atas bahwa ketika dalam tahap pengembangan, melakukan hosting lokal adalah cara yang tepat untuk melihat hasil pembuatan website. Oleh karena itu, sebagai dasarannya temen-temen perlu tahu bagaimana cara menghosting web secara lokal.

Tidak sulit untuk dipahami, jika temen-temen langsung mempraktekkan langkah-langkah yang saya tulis di bawah ini. Asal syarat yang pertama adalah temen-temen sudah menginstall software XAMPP..

Terserah temen-temen mau nginstall yang versi terbaru atau versi berapapun, jika belum memiliki XAMPP, silahkan download di halaman resminya.

Mari kita menuju inti dari cara hosting offline menggunakan XAMPP..

  1. Buka XAMPP terlebih dahulu, jika tidak ada shortcutnya di Desktop dan Start Windows, silahkan pergi ke C:\xampp dan jalankan file xampp-control.exe
  2. Silahkan baca artikel berikut untuk mengetahui cara membuka aplikasi seperti XAMPP tanpa ribet dan anti mainstream
  3. Aktifkan Apache pada XAMPP, dan aktifkan MySQL jika perlu mengolah database pada phpMyAdmin
  4. Buat folder belajarhosting di dalam folder htdocs, berikut alamatnya C:\xampp\htdocs\
  5. nama folder tidak harus belajarhosting, boleh diganti asal langkah selanjutnya menyesuaikan
  6. Letakkan file website yang akan dihosting offline ke dalam folder belajarhosting, berikut alamatnya C:\xampp\htdocs\belajarhosting
  7. Setelah itu silahkan cek dengan membuka alamat localhost/belajarhosting melalui browser yang ada

Nah, dengan demikian berarti sobat sudah berhasil melakukan hosting lokal menggunakan XAMPP.

Tapi coba lihat url website offline yang sudah dihosting melalui XAMPP, terlihat standart bukan?

Pada umumnya semua folder yang temen-temen simpan dalam folder htdocs, secara default dapat diakses melalui alamat localhost/namafolder, asalkan program Apache pada XAMPP dalam kondisi diaktifkan.

Akan lebih bagus lagi jika temen-temen bisa mengganti alamat default tersebut menjadi domain yang temen-temen inginkan, misalnya belajarhosting.com

Hal ini bebas dilakukan dan gampang banget caranya, ga pake bayar lagi

Oleh karena itu, silahkan baca artikel sampai bawah untuk mengetahui langkah-langkahnya..

Mengenal Multi Domain pada Localhost

Saat komputer kita sudah terinstall XAMPP, defaultnya kita akan dapat membuka dashboard XAMPP dengan alamat http://127.0.01/ yang diwakili oleh localhost/

Jadi sebenernya untuk membuka XAMPP melalui browser, selain melalui alamat localhost/, bisa juga diakses melalui 127.0.0.1

Ketika folder di dalam htdocs terdapat lebih dari satu alias sudah ada banyak web yang dibangun, maka secara otomatis domain yang dapat kita akses tidak hanya satu dalam satu server lokal ini, tapi sudah ada banyak.

Masih bingung?

Misal nih, saya bikin web Pencarian Wisata yang saya simpan di C:\xampp\htdocs\webwisata

Kemudian saya juga membuat web resep masakan yang saya simpan di C:\xampp\htdocs\resepmasakan

Alhasil, dalam satu server lokal tadi (127.0.0.1 atau localhost/), sudah terdapat 2 domain yakni lokalhost\webwisata dan localhost\resepmasakan

Nah, di sinilah yang dinamakan Multi Domain..

Jadi gampangannya adalah satu alamat (127.0.0.1) yang memiliki lebih dari satu domain..

Nah, setelah kalian memahami Multi Domain, mari kita lanjutkan untuk membahasa bagaimana cara membuat multi domain di localhost menggunakan XAMPP

Cara Membuat Multi Domain di Localhost

Baiklah, kita sudah menuju inti dari artikel ini. Sebelum melakukan langkah-langkah di bawah, pastikan XAMPP masih belum dijalankan, jadi benar-benar masih mati service-nya terutama Apache dan MySQL.

Dengan demikian temen-temen sudah siap untuk mengikuti langkah-langkahnya di bawah ini:

Asumsi: Sudah terdapat folder bernama belajarhosting dalam folder htdocs

1. Tambahkan Domain Baru

Langkah pertama yang harus dilakukan adalah menambahkan domain baru ke dalam file host. Kalian bisa mengakses file ini dari alamat C:\Windows\System32\drivers\etc dan pilih file bernama hosts yang berekstensi file.

Buka file hosts menggunakan text editor seperti notepad, dll

Untuk menambahkan domain baru, kalian tinggal memasukkan kode berikut di baris paling bawah:

127.0.0.1 belajarhosting.com

127.0.0.1 webwisata.com

127.0.0.1 resepmasakan.com

Kalian bisa menambahkan berapa banyak domain sesuai dengan kebutuhan kalian, tidak harus tiga, di atas hanya sebagai contoh saja.

Setelah berhasil menuliskan domain baru ke dalam file hosts, silahkan simpan file tersebut tanpa merubah ekstensinya.

Jika kalian tidak bisa menyimpannya, maka:

  • Klik kanan file hosts dan pilih Properties
  • Hapus centang pada Read Only, jangan lupa centang kembali setelah file hosts selesai diedit!
  • Lalu buka melalui Notepad dengan run as Administrator
  • Tambahkan Domain Baru

2. Aktifkan Virtual Host melalui File httpd.conf

Langkah ketiga adalah buka file httpd.conf yang berlokasi pada alamat C:\xampp\apache\conf\, seperti sebelumnya silahkan buka file ini dengan menggunakan text-editor.

Kemudian cari kode berikut Include conf/extra/httpd-vhosts.conf gunakan CTRL + F untuk memudahkan pencarian.

Jika sudah ketemu, hapus tanda # yang ada di depan kode tersebut.

Jika tidak ada, silahkan tutup file httpd.conf dan lanjut ke langkah berikutnya.

3. Tambahkan Record Domain ke Data Virual Host

Menambahkan data virtual host berfungsi agar domain yang sudah ditambahkan pada file hosts dapat diakses.

Untuk menambahkan data virtual host, silahkan buka file bernama httpd-vhosts.conf pada alamat C:\xampp\apache\conf\extra\ dengan text editor

Tambahkan kode berikut di baris paling bawah:

<VirtualHost *:80>

ServerAdmin admin@belajarhosting.com

DocumentRoot "C:\xampp\htdocs\belajarhosting"

ServerName belajarhosting.com

ServerAlias belajarhosting.com

ErrorLog logs/belajarhosting.com.log

CustomLog logs/belajarhosting.com.log combined

<Directory "C:\xampp\htdocs\belajarhosting">

    Options Indexes FollowSymLinks Includes ExecCGI

    AllowOverride All

    Order allow,deny

    Allow from all

    Require all granted

</Directory>

</VirtualHost>

Jika kalian ingin menambahkan banyak domain, silahkan tulis kode di atas sebanyak domain yang dibuat. Jangan lupa untuk mengganti belajarhosting.com sesuai dengan domain yang kalian buat, serta sesuaikan alamat directory-nya

4. Tambahkan Record Localhost ke Data Virtual Host

Menambahkan record domain ke dalam data virtual host saja tidak cukup, karena jika langkah keempat ini dilewati, kita tidak akan bisa mengakses halaman dashboard XAMPP melalui alamat localhost/ atau 127.0.0.1/.

Ketika kalian mencoba untuk mengaksesnya, maka akan diarahkan ke virtual host yang kalian tambahkan pada cara keempat.

Biasanya alamat localhost/ akan diarahkan ke record domain urutan pertama dalam data virtual host.

XAMPP
Biar lebih jelas silahkan baca chat berikut

Untuk menambahkan localhost ke dalam record virtual host, cukup mudah. Dengan menambahkan kode pada cara sebelumnya, hanya saja mengganti domain menjadi localhost.

Berikut kode lengkapnya:

<VirtualHost *:80>

ServerAdmin admin@localhost

DocumentRoot "C:\xampp\htdocs"

ServerName localhost

ServerAlias localhost

ErrorLog logs/localhost.log

CustomLog logs/localhost.log combined

<Directory "C:\xampp\htdocs">

    Options Indexes FollowSymLinks Includes ExecCGI

    AllowOverride All

    Order allow,deny

    Allow from all

    Require all granted

</Directory>

</VirtualHost>

5. Jalankan XAMPP dan Buka Domain di Browser

Setelah menyelesaikan empat langkah di atas, sekarang saatnya menjalankan domain yang sudah didaftarkan.

Lihat hasilnya dengan mengunjungi nama domain yang sudah terdaftar di virtual host melalui browser, agar lebih enak pastikan komputer tidak terkoneksi ke internet.

Nah, dengan demikian saat kalian mengakses belajarhosting.com maka tampilan akan sama dengan mengakses localhost/belajarhosting

Semoga jelas dan bermanfaat!

Artikel ini diperbarui pada 01 Juni 2022.
Sumber:

https://id.wikipedia.org/wiki/XAMPP

http://myaspirasi.com/cara-merubah-localhost-xampp-menjadi-domain-sendiri/