Membuat HTML Direktori Listing dengan Bash

Directory Listing dengan Bash — Photo by Brett Jordan on Unsplash

TeknoCerdas.com – Salam cerdas untuk kita semua. Ketika melakukan melakukan deployment static website pada layanan object storage seperti S3 atau Netlify tidak ada fitur direktori listing. Jadi ketika tidak ada file dengan nama index.html ketika membuat sebuah URL endpoint maka layanan memberikan 404 not found. Tutorial ini bertujuan untuk membuat direktori listing dengan Bash mirip seperti fitur pada web server populer Apache atau Nginx.

Pada artikel ini kita akan membuat direktori listing dari dengan bantuan sebuah tool bernama shDirListing. Ini adalah sebuah Bash script untuk membuat direktori listing dalam format HTML yang dapat ditempatkan pada web server.

Baca Juga
Membuat Fungsi pada Bash

Mendownload shDirListing

shDirListing adalah sebuah aplikasi open source dan kode sumbernya dapat di download melalui GitHub.

https://github.com/rioastamal/shdir-listing

Download source code dengan menggunakan utilitas curl atau lainnya.

$ curl -L -o shdirlisting.zip 'https://github.com/rioastamal/shdir-listing/archive/refs/heads/master.zip'

Kemudian ekstrak paket zip shDirListing.

$ unzip shdirlisting.zip
$ cd shdir-listing-master

Cek versi aplikasi untuk memastikan.

$ bash shdir-listing.sh -v
shDirListing version 2021-06-29

Menjalankan shDirListing

Sebagai contoh kita akan membuat direktori listing pada direktori berikut ini.

presentasi/
  - 2010/
    - 10/
      - raweet-framework/
  - 2019/
    - 11/
      - aws-scalable-wordpress/
  - 2020/
    - 08/
      - awsug-06-serverless-php-dengan-aws-lambda/
    - 10/
      - phpid-static-wordpress-hosting-dengan-s3-dan-cloudfront/
  - 2021/
    - 02/
      - belajar-menghindari-sql-injection-melalui-simulasi/
    - 04/
      - memahami-serangan-xss-dan-csrf-dengan-simulasi-studi-kasus/
      - menggunakan-wordpress-sebagai-headless-cms/
    - 05/
      - belajaraws-at-aws-asean-submit-2021/
      - menggunakan-s3-dan-cloudfront-untuk-menjalankan-wordpress-static/

Kita akan membuat direktori listing dengan 2 level kedalaman yaitu sampai dengan bulan. Untuk itu akan digunakan opsi -d 2.

Tapi sebelumnya kita akan menggunakan mode dry run untuk memastikan lokasi file index.html yang akan ditulis benar.

$ bash shdir-listing.sh -d 2 -r /tmp/presentasi

[DRY RUN] Creating index.html for /tmp/presentasi/2010/10...DONE.
[DRY RUN] Creating index.html for /tmp/presentasi/2019/11...DONE.
[DRY RUN] Creating index.html for /tmp/presentasi/2020/08...DONE.
[DRY RUN] Creating index.html for /tmp/presentasi/2020/10...DONE.
[DRY RUN] Creating index.html for /tmp/presentasi/2021/02...DONE.
[DRY RUN] Creating index.html for /tmp/presentasi/2021/04...DONE.
[DRY RUN] Creating index.html for /tmp/presentasi/2021/05...DONE.
[DRY RUN] Creating index.html for /tmp/presentasi/2010...DONE.
[DRY RUN] Creating index.html for /tmp/presentasi/2019...DONE.
[DRY RUN] Creating index.html for /tmp/presentasi/2020...DONE.
[DRY RUN] Creating index.html for /tmp/presentasi/2021...DONE.
[DRY RUN] Creating index.html for /tmp/presentasi...DONE.

OK, sepertinya semua sudah benar mari kita jalankan dengan menghilangkan mode dry run -r.

$ bash shdir-listing.sh -d 2 -r /tmp/presentasi

Creating index.html for /tmp/presentasi/2010/10...DONE.
Creating index.html for /tmp/presentasi/2019/11...DONE.
Creating index.html for /tmp/presentasi/2020/08...DONE.
Creating index.html for /tmp/presentasi/2020/10...DONE.
Creating index.html for /tmp/presentasi/2021/02...DONE.
Creating index.html for /tmp/presentasi/2021/04...DONE.
Creating index.html for /tmp/presentasi/2021/05...DONE.
Creating index.html for /tmp/presentasi/2010...DONE.
Creating index.html for /tmp/presentasi/2019...DONE.
Creating index.html for /tmp/presentasi/2020...DONE.
Creating index.html for /tmp/presentasi/2021...DONE.
Creating index.html for /tmp/presentasi...DONE.

Harusnya disetiap direktori hingga bulan ada sebuah file dengan nama index.html. File ini berisi direktori listing dari file dan direktori dibawahnya. Kita buktikan dengan membukanya menggunakan web server. Dalam contoh ini saya menggunakan built-in PHP web server untuk menampilkan.

$ php -S 0.0.0.0:8000 -t /tmp/presentasi