author Ahmad Muhardian

Tutorial Codeigniter 4: Instalasi dan Persiapan Belajar Codeigniter 4


Codeigniter4 Install

Sebelum mulai belajar Codeigniter 4 lebih, kita harus meyiapkan alat yang dibutuhkan untuk coding Codeigniter 4.

Apa Saja itu?

Persiapan Sebelum Belajar CI 4

Prasyarat belajar Codeigniter 4..

  • Memahami basic bahasa pemrograman PHP. Silakan, ikuti tutorial basic pemrograman PHP jika kamu belum menguasainya.
  • Untuk bisa belajar Codeigniter dengan lancar setidaknya kamu sudah paham konsep pemrograman berorientasikan objek (OOP) dengan PHP.
  • Memahami sintaks dasar SQL;

Nah, setelah prasyarat ini terpenuhi. Selanjutnya silakan siapkan alat-alatnya untuk mulai belajar.

Berikut ini beberapa peralatan yang harus kamu siapkan di komputermu:

  1. Teks Editor
  2. Web Browser
  3. Web Server: PHP, MySQL, Phpmyadmin
  4. Composer
  5. File Project Codeigniter

Mari kita siapkan satu-per-satu.

1. Teks Editor

Teks editor akan kita gunakan untuk menulis kode. Kamu bebas menggunakan teks editor apa saja untuk coding CI.

Saya merekomendasikan menggunakan VS Code, karena mudah digunakan dan punya banyak fitur.

vscode untuk coding codeigniter

Untuk menginstal VS Code, silakan baca:

2. Web Browser

Web browser akan kita gunakan untuk melihat hasil dari aplikasi. Kamu juga bebas menggunakan web browser apapun, asalkan masih mendukung teknologi web modern zaman sekarang.

Rekomendasi, gunakan Google Chrome atau Firefox.

Web Browser Firefox
Web Browser Firefox

3. Web Server

Codeigniter merupakan framework PHP, karena itu ia pasti membutuhkan web server. Berikut ini requirement server untuk Codeigniter 4:

  • PHP Versi 7.2+
  • MySQL Versi 5.1+
  • Phpmyadmin

Jika kamu sudah menginstal XAMPP, maka ketiga aplikasi server ini sudah terpenuhi. Tapi jika kamu pengguna Linux, maka ini bisa diinstal satu-per-satu.

Silakan baca:

Setelah menginstal webserver, kita harus mengaktifkan beberapa extension yang dibutuhkan untuk pengembangan CI 4.

Apa saja itu?

  • php-json extension untuk bekerja dengan JSON;
  • php-mysqlnd native driver untuk MySQL;
  • php-xml extension untuk bekerja dengan XML;
  • php-intl ekstensi untuk membuat aplikasi multibahasa;
  • libcurl (opsional), jika ingin pakai Curl.

Silakan install semuanya dengan perintah:

sudo apt install php-json php-mysqlnd php-xml php-intl libcurl

Untuk kamu yang menggunakan Windows dan XAMPP. Silakan buka XAMPP Control Panel, lalu pada bagian apache klik Config->PHP.

apache-httpd

Setelah itu, cari di bagian extension dan hapus ; yang ada di depan nama extension untuk mengaktifkannya.

php-intl-xampp

4. Composer

Composer adalah program berbasis command line (CLI) untuk manajemen proyek PHP. Tugas dari composer adalah melakukan instalasi paket, membuat proyek baru, menjalankan script, dan lain-lain.

Silakan install Composer dengan perintah berikut:

apt install composer

Jika kamu ingin belajar tentang composer lebih lanjut, silakan baca:

O ya, di sana juga ada penjelasan tentang cara installComposer di Windows.

5. File Project Codeigniter

File project Codeigniter dapat di-download di website resmi Codeigniter. Nanti kita akan mendapatkan file berupa ZIP. File inilah yang akan kita gunakan untuk mulai membuat proyek Codeigniter.

File project ini juga dapat kita download dengan composer.

Silakan ikuti:

Install CI 4 dengan Composer

Untuk menginstal CI 4 dengan composer, silakan ketik perintah berikut.

composer create-project codeigniter4/appstarter ci-news -vvv

Tunggulah sampai prosesnya selesai.

Ada beberapa argumen yang kita berikan pada perintah ini:

  • create-project adalah perintah untuk membuat proyek baru dengan composer;
  • codeigniter4/appstarter adalah file CI yang akan di-download;
  • ci-news adalah nama proyek yang akan kita buat;
  • -vvv berfungsi untuk melihat proses install lebih detail.

Setelah prosesnya selesai, kita akan mendapatkan folder baru dengan nama ci-news.

folder-ci-news

buka folder ci-news dengan teks editor VS Code.

Setelah itu buka terminal dengan menekan Ctrl+` dan jalankan perintah:

composer install -vvv

Perintah ini akan menginstal semua library yang dibutuhkan CI 4.

ci4-vscode

Setelah selesai, coba ketik perintah:

php spark serve

Perintah ini akan menjalankan server CI 4 pada port 8080.

Coba buka web browser dan arahkan ke alamat http://localhost:8080, maka hasilnya:

ci4-welcome

Selamat. πŸ‘πŸ‘πŸ‘

CI 4 sudah berhasil diinstal.

Selanjutnya kita tinggal mulai coding.

Install CI 4 dengan Cara Manual

Nah, buat kamu yang ingin menginstal CI4 dengan cara manual, tanpa harus melalui Composer, bisa ikuti cara ini.

Langkah-langkah yang harus dilakukan:

  1. Download Codeigniter;
  2. Ekstrak File ZIP Codeigniter ke htdocs.

Silakan buka website Codeigniter untuk men-download.

download-ci4

Note: Biar versi CI4 sama dengan versi yang digunakan pada tutorial ini, yakni 4.0.4.. silakan Download CI dari link ini.

Kita akan mendapatkan sebuah file zip 📦 framework-4.x.x.zip, ekstrak file tersebut ke dalam c:\xampp\htdocs (XAMPP) atau /var/www/html (di Linux).

Setelah itu, ubah nama framework-4.x.xx menjadi ci-news.

Sekarang coba buka web browser dan buka alamat: http://localhost/ci-news/public/.

Jika hasilnya kosong atau blank, maka kita harus melakukan install library yang dibutuhkan.

Silakan buka folder ci-news dengan Visual Studio Code, lalu buka terminal dan ketik perintah berikut.

composer install -vvv

Perintah ini akan menginstal semua library yang dibutuhkan CI 4.

ci4-vscode

Setelah itu, ubah kepemilikan dari folder writable dengan perintah berikut ini:

sudo chown -Rv www-data writable/

Note: ini khusus di Linux

Setelah selesai, coba buka kembali http://localhost/ci-news/public/, maka hasilnya:

ci4-welcome

Selamat. πŸ‘πŸ‘πŸ‘

CI 4 sudah berhasil diinstal.

Selanjutnya kita tinggal mulai coding.

Biar Enak, Hidupkan Mode Debugging

CI4 menyediakan fitur debugging yang cukup bagus. Ini sama seperti profiler pada CI3.

Secara default, fitur ini belum aktif. Jika ada error pada aplikasi, maka ia akan menampilkan pesan Whoops! seperti ini:

Aplikasi CI 4 Error

Kita tidak akan bisa tahu tempat masalahnya jika aplikasi cuma menampilkan ini. Cocoknya ini dipakai pada aplikasi production.

Nah, untuk mengaktifkan mode debugging, kita harus mengubah environment variabel CI_ENVIRONMENT menjadi development.

Silakan buka file env, kemudian cari variabel CI_ENVIRONMENT dan ubahlah nilainya menjadi development.

ci environment variable

Setelah itu, ubah nama file env menjadi .env (tinggal tambah titik di depan).

file dotenv ci

Sekarang, coba buat sebuah kesalahan. Misalnya, saya menghapus titik koma pada controller Home.

titik-koma-error

Lalu buka kembali aplikasinya.

Maka hasilnya:

parse error ci4

Nah, dengan begini.. kita bisa debug aplikasi dengan lebih mudah. CI akan ngasih tahu, di mana letak error-nya.

Nanti, setelah kita selesai mengembangkan aplikasi. Ubah kembali CI_ENVIRONTMENT menjadi production.

Membuat Virutal Host Domain

Ini boleh kamu lakukan dan boleh juga tidak.

Buat kamu yang menginstal CI4 secara manual di htdocs, ada baiknya membuatkan virtual host agar memudahkan dalam proses development.

Virtual host adalah alamat khusus yang kita buat di localhost untuk mengakses aplikasi.

Pada contoh di atas, kita membuka aplikasi melalui http://localhost/ci-news/public/.

Nah, dengan virtual host, kita bisa membukanya melalui cinews.test.

Nama domain yang digunakan terserah kita, bisa .com, .net, .web, dan sebagainya.

Tapi..

Biar tidak membingungkan dan bentrok dengan domain yang sudah ada di internet, kita berikan domain .test atau .local saja.

Baiklah, langkah-langkah berikut:

Membuat Virtual Host di Linux

Untuk kamu pengguna Linux atau Mac, bisa mengikuti cara berikut. Silakan buka Terminal lalu ketik.

sudo cp /etc/apache2/sites-available/000-default.conf /etc/apache2/sites-available/cinews.test.conf

Perintah ini akan melakukan copy dari konfigurasi default host apache.

Setelah itu, buka file cinews.test.conf dengan teks editor. Ketik perintah berikut:

sudo nano /etc/apache2/sites-available/cinews.test.conf

Lalu ubah isinya menjadi seperti ini:

<VirtualHost *:80>
    ServerAdmin [email protected]
    ServerName cinews.test
    ServerAlias www.cinews.test
    DocumentRoot /var/www/html/ci-news/public
    ErrorLog ${APACHE_LOG_DIR}/error.log
    CustomLog ${APACHE_LOG_DIR}/access.log combined
</VirtualHost>

Setelah itu, tekan Ctrl+x lalu pilih y untuk menyimpan.

Berikutnya, buka file /etc/hosts ketik perintah berikut:

sudo nano /etc/hosts

Setelah itu, tambahkan:

127.0.0.1 cinews.test

Ini akan menjadi alamat domain yang akan kita pakai. Kamu juga bisa menggantinya dengan yang lain.

hosts

Setelah itu, simpan dengan menekan Ctrl+x lalu pilih y.

Berikutnya, kita harus mengaktifkan konfigurasi site apache yang sudah dibuat. Silakan ketik perintah berikut:

sudo a2ensite cinews.test.conf

Terakhir, restart server dengan perintah berikut:

sudo service apache2 restart

…dan coba buka alamat cinews.test dari web browser.

Virtual Host project

Membuat Virtual Host di Windows

Untuk kamu yang menggunakan XAMPP di Windows, berikut ini cara membuat virtual host.

Silakan buka windows explorer, lalu masuk ke folder C:/xampp/apache/conf/extra.

folder-extra-xampp

Setelah itu, buka file httpd.vshosts.conf dengan Notepad atau Notepad++.

open file httpd vhosts

Selanjutnya tambahkan kode berikut ini pada file httpd-vhosts.conf:

<VirtualHost *:80>
    ServerAdmin [email protected]
    ServerName cinews.test
    ServerAlias www.cinews.test
    DocumentRoot "c:\xampp\htdocs\ci-news\public"
    ErrorLog ${APACHE_LOG_DIR}/error.log
    CustomLog ${APACHE_LOG_DIR}/access.log combined
    <Directory "c:\xampp\htdocs\ci-news\public"></Directory>
</VirtualHost>

Setelah itu, tekan Windows+r, lalu masukkan..

C:\Windows\System32\drivers\etc\hosts

pada kolom Open.

win-run

Tambahkan kode berikut:

127.0.0.1 cinews.test

Setelah itu simpan, dan restart server apache.

restart

Sekarang coba buka browser dan arahkan ke alamat cinews.test, maka hasilnya:

Virtual Host project

Troubleshooting..

Saya yakin ada beberapa di antara kamu yang akan mendapatkan masalah saat install Codeigniter 4. Berikut ini beberapa masalah yang sering ditemukan.

Tidak bisa menjalankan server

Saat menjalankan server dengan perintah php spark serve muncul pesan error seperti ini:

PHP Warning:  require(/app/Config/../../vendor/codeigniter4/framework/system/bootstrap.php): failed to open stream: No such file or directory in /home/dian/Playground/ci-playground/ci-news/spark on line 44

Contoh:

spark serve error

Kalau kita lihat, perintah ini akan mencari file di folder vendor. Folder ini adalah folder yang berisi library yang diinstal dengan composer.

βœ… Solusi:

Lakukan install dengan perintah

composer install -vvv

Argumen -vvv berfungsi untuk melihat proses instalasi lebih detail.

Tunggulah sampai prosesnya selesai..

Instalasi dengan composer

..dan akan ada folder vendor di proyek kita.

folder vendor

Tidak bisa melakukan install

Saat melakukan install dengan perintah composer install, muncul pesan seperti ini:

codeigniter4/framework v4.0.4 requires ext-intl * -> the requested PHP extension intl is missing from your system
Installation request for codeigniter4/framework ^4 -> satisfiable by codeigniter4/framework[4.0.0, v4.0.1, v4.0.2, v4.0.3, v4.0.4].

Ini artinya ekstensi ext-intl belum terinstal

βœ… Solusi:

Instal ekstensi tersebut dengan perintah:

sudo apt install php-intl

Setelah itu, coba jalankan lagi composer install

Apa Selanjutnya?

Pada tahapan ini, kita sudah berhasil membuat proyek baru Codeigniter. Baik itu dengan composer, maupun install secara manual ke htdocs.

Kamu lebih suka cara yang mana?

Kalau saya, lebih suka yang pakai Composer, karena lebih praktis.

Berikutnya, silakan pelajari tentang:

Untuk tutorial CI lainnya, cek di 📚 List Tutorial Codeigniter