website-zarif/index.html

3242 lines
41 KiB
HTML
Raw Normal View History

2023-08-30 20:07:11 +03:00
<!doctype html>
<!-- `site.alt_lang` can specify a language different from the UI -->
<html lang="my"
data-mode="dark"
>
<!-- The Head -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="theme-color" media="(prefers-color-scheme: light)" content="#f7f7f7">
<meta name="theme-color" media="(prefers-color-scheme: dark)" content="#1b1b1e">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta
name="viewport"
content="width=device-width, user-scalable=no initial-scale=1, shrink-to-fit=no, viewport-fit=cover"
>
<!-- Begin Jekyll SEO tag v2.8.0 -->
<meta name="generator" content="Jekyll v4.3.2" />
<meta property="og:title" content="Zarif Rani" />
<meta property="og:locale" content="my" />
<meta name="description" content="Bloging dan Dokumentasi" />
<meta property="og:description" content="Bloging dan Dokumentasi" />
<link rel="canonical" href="https://blog.zarifhomelab.com/" />
<meta property="og:url" content="https://blog.zarifhomelab.com/" />
<meta property="og:site_name" content="Zarif Rani" />
<meta property="og:type" content="website" />
<link rel="next" href="https://blog.zarifhomelab.com/page2" />
<meta name="twitter:card" content="summary" />
<meta property="twitter:title" content="Zarif Rani" />
<meta name="twitter:site" content="@twitter_username" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"WebSite","description":"Bloging dan Dokumentasi","headline":"Zarif Rani","name":"Zarif Fathurrahman Rani","sameAs":["https://www.instagram.com/firaz.fat/"],"url":"https://blog.zarifhomelab.com/"}</script>
<!-- End Jekyll SEO tag -->
<title>Zarif Rani
</title>
<!--
The Favicons for Web, Android, Microsoft, and iOS (iPhone and iPad) Apps
Generated by: https://realfavicongenerator.net/
-->
<link rel="apple-touch-icon" sizes="180x180" href="/assets/img/favicons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/assets/img/favicons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/assets/img/favicons/favicon-16x16.png">
<link rel="manifest" href="/assets/img/favicons/site.webmanifest">
<link rel="shortcut icon" href="/assets/img/favicons/favicon.ico">
<meta name="apple-mobile-web-app-title" content="Zarif Rani">
<meta name="application-name" content="Zarif Rani">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="msapplication-config" content="/assets/img/favicons/browserconfig.xml">
<meta name="theme-color" content="#ffffff">
<link rel="stylesheet" href="/assets/lib/fonts/main.css">
<!-- GA -->
<!-- Bootstrap -->
<link rel="stylesheet" href="/assets/lib/bootstrap/bootstrap.min.css">
<!-- Font Awesome -->
<link rel="stylesheet" href="/assets/lib/fontawesome-free/css/all.min.css">
<link rel="stylesheet" href="/assets/css/style.css">
<!-- JavaScript -->
<!-- A placeholder to allow defining custom metadata -->
</head>
<body>
<!-- The Side Bar -->
<div id="sidebar" class="d-flex flex-column align-items-end">
<div class="profile-wrapper">
<a href="/" id="avatar" class="rounded-circle">
<img src="/assets/non-post-image/avatar.webp" width="112" height="112" alt="avatar" onerror="this.style.display='none'">
</a>
<div class="site-title">
<a href="/">Zarif Rani</a>
</div>
<div class="site-subtitle fst-italic">Bloging dan Dokumentasi</div>
</div>
<!-- .profile-wrapper -->
<ul class="nav flex-column flex-grow-1 w-100 ps-0">
<!-- home -->
<li class="nav-item active">
<a href="/" class="nav-link">
<i class="fa-fw fas fa-home"></i>
<span>LAMAN UTAMA</span>
</a>
</li>
<!-- the real tabs -->
<li class="nav-item">
<a href="/categories/" class="nav-link">
<i class="fa-fw fas fa-stream"></i>
<span>KATEGORI</span>
</a>
</li>
<!-- .nav-item -->
<li class="nav-item">
<a href="/tags/" class="nav-link">
<i class="fa-fw fas fa-tags"></i>
<span>TAG</span>
</a>
</li>
<!-- .nav-item -->
<li class="nav-item">
<a href="/archives/" class="nav-link">
<i class="fa-fw fas fa-archive"></i>
<span>ARKIB</span>
</a>
</li>
<!-- .nav-item -->
<li class="nav-item">
<a href="/about/" class="nav-link">
<i class="fa-fw fas fa-info-circle"></i>
<span>TENTANG</span>
</a>
</li>
<!-- .nav-item -->
</ul>
<!-- ul.nav.flex-column -->
<div class="sidebar-bottom d-flex flex-wrap align-items-center w-100">
<a
href="https://www.instagram.com/firaz.fat/"
aria-label="instagram"
target="_blank"
rel="noopener noreferrer"
>
<i class="fab fa-instagram"></i>
</a>
<a
href="https://facebook.com/zarif.fathurrahman"
aria-label="facebook"
target="_blank"
rel="noopener noreferrer"
>
<i class="fab fa-facebook"></i>
</a>
<a
href="javascript:location.href = 'mailto:' + ['zariffathurrahman59','gmail.com'].join('@')"
aria-label="email"
>
<i class="fas fa-envelope"></i>
</a>
<a
href="/feed.xml"
aria-label="rss"
>
<i class="fas fa-rss"></i>
</a>
</div>
<!-- .sidebar-bottom -->
</div>
<!-- #sidebar -->
<div id="main-wrapper" class="d-flex justify-content-center">
<div id="main" class="container px-xxl-5">
<!-- The Top Bar -->
<div id="topbar-wrapper">
<div
id="topbar"
class="container d-flex align-items-center justify-content-between h-100"
>
<span id="breadcrumb">
<!-- index page -->
<span>Laman utama</span>
</span>
<!-- endof #breadcrumb -->
<i id="sidebar-trigger" class="fas fa-bars fa-fw"></i>
<div id="topbar-title">
Zarif Rani
</div>
<i id="search-trigger" class="fas fa-search fa-fw"></i>
<span id="search-wrapper" class="align-items-center">
<i class="fas fa-search fa-fw"></i>
<input
class="form-control"
id="search-input"
type="search"
aria-label="search"
autocomplete="off"
placeholder="Cari..."
>
</span>
<span id="search-cancel">Batal</span>
</div>
</div>
<div class="row mb-5">
<!-- core -->
<div id="core-wrapper" class="col-12 col-lg-11 col-xl-9 pe-xl-4">
<div class="post px-md-2">
<!-- Refactor the HTML structure -->
<!--
In order to allow a wide table to scroll horizontally,
we suround the markdown table with `<div class="table-wrapper">` and `</div>`
-->
<!--
Fixed kramdown code highlight rendering:
https://github.com/penibelst/jekyll-compress-html/issues/101
https://github.com/penibelst/jekyll-compress-html/issues/71#issuecomment-188144901
-->
<!-- Change the icon of checkbox -->
<!-- images -->
<!-- CDN URL -->
<!-- Add image path -->
<!-- take out classes -->
<!-- lazy-load images <https://github.com/aFarkas/lazysizes#readme> -->
<!-- add image placeholder -->
<!-- add SVG placehoder -->
<!-- Bypass the HTML-proofer test -->
<!-- create the image wrapper -->
<!-- combine -->
<!-- take out classes -->
<!-- lazy-load images <https://github.com/aFarkas/lazysizes#readme> -->
<!-- add image placeholder -->
<!-- add SVG placehoder -->
<!-- Bypass the HTML-proofer test -->
<!-- create the image wrapper -->
<!-- combine -->
<!-- take out classes -->
<!-- lazy-load images <https://github.com/aFarkas/lazysizes#readme> -->
<!-- add image placeholder -->
<!-- Bypass the HTML-proofer test -->
<!-- create the image wrapper -->
<!-- combine -->
<!-- take out classes -->
<!-- lazy-load images <https://github.com/aFarkas/lazysizes#readme> -->
<!-- add image placeholder -->
<!-- Bypass the HTML-proofer test -->
<!-- create the image wrapper -->
<!-- combine -->
<!-- take out classes -->
<!-- lazy-load images <https://github.com/aFarkas/lazysizes#readme> -->
<!-- add image placeholder -->
<!-- Bypass the HTML-proofer test -->
<!-- create the image wrapper -->
<!-- combine -->
<!-- take out classes -->
<!-- lazy-load images <https://github.com/aFarkas/lazysizes#readme> -->
<!-- add image placeholder -->
<!-- Bypass the HTML-proofer test -->
<!-- create the image wrapper -->
<!-- combine -->
<!-- Add header for code snippets -->
<!-- Create heading anchors -->
<!-- return -->
<!-- Get pinned posts -->
<!-- Get default posts -->
<div id="post-list">
<a href="/posts/quotes/" class="card-wrapper">
<div class="card post-preview flex-md-row-reverse">
<div class="preview-img shimmer"><img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17 10'%3E%3C/svg%3E" data-src="/assets/post-image/2023-08-15/cover.webp" width="17" height="10" alt="Lautan Mediterranean, Iskandariah, Mesir" class="lazyload" data-proofer-ignore></div>
<div class="card-body d-flex flex-column">
<h1 class="card-title my-2 mt-md-0">
Quotes
</h1>
<div class="card-text post-content mt-0 mb-2">
<p>
Koleksi Qoutes Saya
English
a great man doesnt seek to lead. he called to it, he answers it.
if you dont create a routine, you will assigned one.
if you dont create a purpose, ...
</p>
</div>
<div class="post-meta flex-grow-1 d-flex align-items-end">
<div class="me-auto">
<!-- posted date -->
<i class="far fa-calendar fa-fw me-1"></i>
<!--
Date format snippet
See: ${JS_ROOT}/utils/locale-dateime.js
-->
<em
class=""
data-ts="1692077366"
data-df="DD/MM/YYYY"
>
15/08/2023
</em>
<!-- categories -->
<i class="far fa-folder-open fa-fw me-1"></i>
<span class="categories">
mesir,
kehidupan
</span>
</div>
</div>
<!-- .post-meta -->
</div>
<!-- .card-body -->
</div>
</a>
<a href="/posts/dermatology/" class="card-wrapper">
<div class="card post-preview flex-md-row-reverse">
<div class="preview-img shimmer"><img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17 10'%3E%3C/svg%3E" data-src="/assets/post-image/2023-08-15/cover-1.webp" width="17" height="10" alt="Eczema hand" class="lazyload" data-proofer-ignore></div>
<div class="card-body d-flex flex-column">
<h1 class="card-title my-2 mt-md-0">
Dermatology
</h1>
<div class="card-text post-content mt-0 mb-2">
<p>
Pembahagian Markah
75 markah keseluruhan
Tempoh kelas: 29 Jul 2023 - 8 Aug 2023
Tarikh Exam
End of Round OSCE: 10 Aug 2023
Final: 16 Sep 2023
</p>
</div>
<div class="post-meta flex-grow-1 d-flex align-items-end">
<div class="me-auto">
<!-- posted date -->
<i class="far fa-calendar fa-fw me-1"></i>
<!--
Date format snippet
See: ${JS_ROOT}/utils/locale-dateime.js
-->
<em
class=""
data-ts="1692077366"
data-df="DD/MM/YYYY"
>
15/08/2023
</em>
<!-- categories -->
<i class="far fa-folder-open fa-fw me-1"></i>
<span class="categories">
mesir,
medic
</span>
</div>
</div>
<!-- .post-meta -->
</div>
<!-- .card-body -->
</div>
</a>
<a href="/posts/automatic-deploy-jekyll-website/" class="card-wrapper">
<div class="card post-preview flex-md-row-reverse">
<div class="preview-img "><img data-src="/assets/post-image/2023-07-06/devices-mockup.png" width="17" height="10" alt="Preview Image" data-lqip="true" src="data:image/webp;base64,UklGRpoAAABXRUJQVlA4WAoAAAAQAAAADwAABwAAQUxQSDIAAAARL0AmbZurmr57yyIiqE8oiG0bejIYEQTgqiDA9vqnsUSI6H+oAERp2HZ65qP/VIAWAFZQOCBCAAAA8AEAnQEqEAAIAAVAfCWkAALp8sF8rgRgAP7o9FDvMCkMde9PK7euH5M1m6VWoDXf2FkP3BqV0ZYbO6NA/VFIAAAA" class="lazyload" data-proofer-ignore></div>
<div class="card-body d-flex flex-column">
<h1 class="card-title my-2 mt-md-0">
Automatic Deploy Jekyll Website Menggunakan Gitea Webhook
</h1>
<div class="card-text post-content mt-0 mb-2">
<p>
Ringkasan Projek
Jekyll adalah satu alat utuk membina website. Jekyll membolehkan kita untuk membina static html file dan static html file tersebut boleh diguna pakai oleh webserver aplikasi untuk...
</p>
</div>
<div class="post-meta flex-grow-1 d-flex align-items-end">
<div class="me-auto">
<!-- posted date -->
<i class="far fa-calendar fa-fw me-1"></i>
<!--
Date format snippet
See: ${JS_ROOT}/utils/locale-dateime.js
-->
<em
class=""
data-ts="1688621366"
data-df="DD/MM/YYYY"
>
06/07/2023
</em>
<!-- categories -->
<i class="far fa-folder-open fa-fw me-1"></i>
<span class="categories">
homelab,
development
</span>
</div>
</div>
<!-- .post-meta -->
</div>
<!-- .card-body -->
</div>
</a>
<a href="/posts/home-media/" class="card-wrapper">
<div class="card post-preview flex-md-row-reverse">
<div class="preview-img "><img data-src="/assets/post-image/2023-07-03/img1.webp" width="17" height="10" alt="Preview Image" data-lqip="true" src="data:image/webp;base64,UklGRpoAAABXRUJQVlA4WAoAAAAQAAAADwAABwAAQUxQSDIAAAARL0AmbZurmr57yyIiqE8oiG0bejIYEQTgqiDA9vqnsUSI6H+oAERp2HZ65qP/VIAWAFZQOCBCAAAA8AEAnQEqEAAIAAVAfCWkAALp8sF8rgRgAP7o9FDvMCkMde9PK7euH5M1m6VWoDXf2FkP3BqV0ZYbO6NA/VFIAAAA" class="lazyload" data-proofer-ignore></div>
<div class="card-body d-flex flex-column">
<h1 class="card-title my-2 mt-md-0">
Home Media Stack
</h1>
<div class="card-text post-content mt-0 mb-2">
<p>
docker-compose-media.yaml
version: &quot;3&quot;
services:
jellyfin:
image: jellyfin/jellyfin
container_name: jellyfin
environment:
- PUID=1000
- PGID=1000
- TZ=Europe/Rome
...
</p>
</div>
<div class="post-meta flex-grow-1 d-flex align-items-end">
<div class="me-auto">
<!-- posted date -->
<i class="far fa-calendar fa-fw me-1"></i>
<!--
Date format snippet
See: ${JS_ROOT}/utils/locale-dateime.js
-->
<em
class=""
data-ts="1688365766"
data-df="DD/MM/YYYY"
>
03/07/2023
</em>
<!-- categories -->
<i class="far fa-folder-open fa-fw me-1"></i>
<span class="categories">
homelab,
docker
</span>
</div>
</div>
<!-- .post-meta -->
</div>
<!-- .card-body -->
</div>
</a>
<a href="/posts/internalmed/" class="card-wrapper">
<div class="card post-preview flex-md-row-reverse">
<div class="preview-img "><img data-src="/assets/post-image/2023-05-07/cover.webp" width="17" height="10" alt="Preview Image" data-lqip="true" src="data:image/webp;base64,UklGRpoAAABXRUJQVlA4WAoAAAAQAAAADwAABwAAQUxQSDIAAAARL0AmbZurmr57yyIiqE8oiG0bejIYEQTgqiDA9vqnsUSI6H+oAERp2HZ65qP/VIAWAFZQOCBCAAAA8AEAnQEqEAAIAAVAfCWkAALp8sF8rgRgAP7o9FDvMCkMde9PK7euH5M1m6VWoDXf2FkP3BqV0ZYbO6NA/VFIAAAA" class="lazyload" data-proofer-ignore></div>
<div class="card-body d-flex flex-column">
<h1 class="card-title my-2 mt-md-0">
Internal Medicine
</h1>
<div class="card-text post-content mt-0 mb-2">
<p>
Pembahagian markah
Markah keseluruhan: 565 (399 Lulus/60%)
Markah Internal Medicine: 440
Markah Pharmacology: 125
End of Round OSCE exam (setiap dua minggu) 200 marks...
</p>
</div>
<div class="post-meta flex-grow-1 d-flex align-items-end">
<div class="me-auto">
<!-- posted date -->
<i class="far fa-calendar fa-fw me-1"></i>
<!--
Date format snippet
See: ${JS_ROOT}/utils/locale-dateime.js
-->
<em
class=""
data-ts="1683440966"
data-df="DD/MM/YYYY"
>
07/05/2023
</em>
<!-- categories -->
<i class="far fa-folder-open fa-fw me-1"></i>
<span class="categories">
mesir,
medic
</span>
</div>
</div>
<!-- .post-meta -->
</div>
<!-- .card-body -->
</div>
</a>
<a href="/posts/pengalam-ramadan-di-mesir/" class="card-wrapper">
<div class="card post-preview flex-md-row-reverse">
<div class="preview-img "><img data-src="/assets/post-image/2023-04-18/IMG_3106.webp" width="17" height="10" alt="Masjid Nabi Daniel, Iskandariah, Mesir" data-lqip="true" src="data:image/webp;base64,UklGRpoAAABXRUJQVlA4WAoAAAAQAAAADwAABwAAQUxQSDIAAAARL0AmbZurmr57yyIiqE8oiG0bejIYEQTgqiDA9vqnsUSI6H+oAERp2HZ65qP/VIAWAFZQOCBCAAAA8AEAnQEqEAAIAAVAfCWkAALp8sF8rgRgAP7o9FDvMCkMde9PK7euH5M1m6VWoDXf2FkP3BqV0ZYbO6NA/VFIAAAA" class="lazyload" data-proofer-ignore></div>
<div class="card-body d-flex flex-column">
<h1 class="card-title my-2 mt-md-0">
Pengalaman Ramadan di Mesir
</h1>
<div class="card-text post-content mt-0 mb-2">
<p>
Ramadan di Mesir
Saya ingin berbagi pengalaman saya mengenai Ramadan di Mesir. Sebagai negara majoriti Muslim, Ramadan sangat dihargai dan dirayakan di Mesir. Selama bulan suci ini, suasana Mesir ...
</p>
</div>
<div class="post-meta flex-grow-1 d-flex align-items-end">
<div class="me-auto">
<!-- posted date -->
<i class="far fa-calendar fa-fw me-1"></i>
<!--
Date format snippet
See: ${JS_ROOT}/utils/locale-dateime.js
-->
<em
class=""
data-ts="1681799366"
data-df="DD/MM/YYYY"
>
18/04/2023
</em>
<!-- categories -->
<i class="far fa-folder-open fa-fw me-1"></i>
<span class="categories">
mesir,
kehidupan
</span>
</div>
</div>
<!-- .post-meta -->
</div>
<!-- .card-body -->
</div>
</a>
<a href="/posts/mini-internet/" class="card-wrapper">
<div class="card post-preview flex-md-row-reverse">
<div class="card-body d-flex flex-column">
<h1 class="card-title my-2 mt-md-0">
Mini Internet
</h1>
<div class="card-text post-content mt-0 mb-2">
<p>
Ringkasan Projek
Bina lab persekitaran maya seperti gambar rajah di bawah.
Install Oracle VirtualBox
Muat turun dan install Oracle VirtualBox di Downloads Oracle VM VirtualBox
Tonton vi...
</p>
</div>
<div class="post-meta flex-grow-1 d-flex align-items-end">
<div class="me-auto">
<!-- posted date -->
<i class="far fa-calendar fa-fw me-1"></i>
<!--
Date format snippet
See: ${JS_ROOT}/utils/locale-dateime.js
-->
<em
class=""
data-ts="1657700966"
data-df="DD/MM/YYYY"
>
13/07/2022
</em>
<!-- categories -->
<i class="far fa-folder-open fa-fw me-1"></i>
<span class="categories">
homelab,
development
</span>
</div>
</div>
<!-- .post-meta -->
</div>
<!-- .card-body -->
</div>
</a>
<a href="/posts/laravel-docker/" class="card-wrapper">
<div class="card post-preview flex-md-row-reverse">
<div class="card-body d-flex flex-column">
<h1 class="card-title my-2 mt-md-0">
Laravel PHP Docker
</h1>
<div class="card-text post-content mt-0 mb-2">
<p>
Environment
Ubuntu 22.04 LTS
Docker 20.10.12
Install docker
sudo apt install docker.io
sudo apt install docker-compose
Struktur folder
laravel_docker
│ docker-compose.yaml
└───apach...
</p>
</div>
<div class="post-meta flex-grow-1 d-flex align-items-end">
<div class="me-auto">
<!-- posted date -->
<i class="far fa-calendar fa-fw me-1"></i>
<!--
Date format snippet
See: ${JS_ROOT}/utils/locale-dateime.js
-->
<em
class=""
data-ts="1657700966"
data-df="DD/MM/YYYY"
>
13/07/2022
</em>
<!-- categories -->
<i class="far fa-folder-open fa-fw me-1"></i>
<span class="categories">
homelab,
development
</span>
</div>
</div>
<!-- .post-meta -->
</div>
<!-- .card-body -->
</div>
</a>
<a href="/posts/umami/" class="card-wrapper">
<div class="card post-preview flex-md-row-reverse">
<div class="card-body d-flex flex-column">
<h1 class="card-title my-2 mt-md-0">
Umami
</h1>
<div class="card-text post-content mt-0 mb-2">
<p>
Fungsi
Umami adalah webanalytic tool yang berfungsi untuk track statistik website seperti jumlah pelawat, jumlah page view dan lain lain. 
Environment
Ubuntu 22.04 LTS
Docker 20.10.12
Ins...
</p>
</div>
<div class="post-meta flex-grow-1 d-flex align-items-end">
<div class="me-auto">
<!-- posted date -->
<i class="far fa-calendar fa-fw me-1"></i>
<!--
Date format snippet
See: ${JS_ROOT}/utils/locale-dateime.js
-->
<em
class=""
data-ts="1657528166"
data-df="DD/MM/YYYY"
>
11/07/2022
</em>
<!-- categories -->
<i class="far fa-folder-open fa-fw me-1"></i>
<span class="categories">
homelab,
docker
</span>
</div>
</div>
<!-- .post-meta -->
</div>
<!-- .card-body -->
</div>
</a>
<a href="/posts/jellky/" class="card-wrapper">
<div class="card post-preview flex-md-row-reverse">
<div class="card-body d-flex flex-column">
<h1 class="card-title my-2 mt-md-0">
Jellky | Static Web Generator
</h1>
<div class="card-text post-content mt-0 mb-2">
<p>
Fungsi
Jellky adalah simple tetapi berkuasa static website generator. Saya sendiri menggunakan Jellky untuk melari website ini.
Environment
Ubuntu 22.04 LTS
Docker 20.10.12
Install docker...
</p>
</div>
<div class="post-meta flex-grow-1 d-flex align-items-end">
<div class="me-auto">
<!-- posted date -->
<i class="far fa-calendar fa-fw me-1"></i>
<!--
Date format snippet
See: ${JS_ROOT}/utils/locale-dateime.js
-->
<em
class=""
data-ts="1657528166"
data-df="DD/MM/YYYY"
>
11/07/2022
</em>
<!-- categories -->
<i class="far fa-folder-open fa-fw me-1"></i>
<span class="categories">
homelab,
docker
</span>
</div>
</div>
<!-- .post-meta -->
</div>
<!-- .card-body -->
</div>
</a>
</div>
<!-- #post-list -->
<!-- The paginator for post list on HomgPage. -->
<ul class="pagination align-items-center mt-4 mb-1 ps-lg-2">
<!-- left arrow -->
<li class="page-item disabled">
<a class="page-link btn-box-shadow" href="#" aria-label="previous-page">
<i class="fas fa-angle-left"></i>
</a>
</li>
<!-- page numbers -->
<!-- show number -->
<li class="page-item active">
<a
class="page-link btn-box-shadow"
href="/"
>1</a>
</li>
<!-- show number -->
<li class="page-item ">
<a
class="page-link btn-box-shadow"
href="/page2"
>2</a>
</li>
<!-- mobile pagination -->
<li class="page-index align-middle">
<span>1</span>
<span class="text-muted">/ 2</span>
</li>
<!-- right arrow -->
<li class="page-item ">
<a class="page-link btn-box-shadow" href="/page2" aria-label="next-page">
<i class="fas fa-angle-right"></i>
</a>
</li>
</ul>
<!-- .pagination -->
</div>
</div>
<!-- #core-wrapper -->
<!-- panel -->
<div id="panel-wrapper" class="col-xl-3 ps-2 text-muted">
<div class="access">
<!-- Get the last 5 posts from lastmod list. -->
<div id="access-lastmod" class="post">
<div class="panel-heading">Pos dikemaskini</div>
<ul class="post-content list-unstyled ps-0 pb-1 ms-1 mt-2">
<li class="text-truncate lh-lg">
<a href="/posts/quotes/">Quotes</a>
</li>
<li class="text-truncate lh-lg">
<a href="/posts/internalmed/">Internal Medicine</a>
</li>
<li class="text-truncate lh-lg">
<a href="/posts/pengalam-ramadan-di-mesir/">Pengalaman Ramadan di Mesir</a>
</li>
<li class="text-truncate lh-lg">
<a href="/posts/home-media/">Home Media Stack</a>
</li>
<li class="text-truncate lh-lg">
<a href="/posts/automatic-deploy-jekyll-website/">Automatic Deploy Jekyll Website Menggunakan Gitea Webhook</a>
</li>
</ul>
</div>
<!-- #access-lastmod -->
<!-- The trending tags list -->
<div id="access-tags">
<div class="panel-heading">Tag popular</div>
<div class="d-flex flex-wrap mt-3 mb-1 me-3">
<a class="post-tag btn btn-outline-primary" href="/tags/how-to/">how-to</a>
<a class="post-tag btn btn-outline-primary" href="/tags/server/">server</a>
<a class="post-tag btn btn-outline-primary" href="/tags/docker/">docker</a>
<a class="post-tag btn btn-outline-primary" href="/tags/medic/">medic</a>
<a class="post-tag btn btn-outline-primary" href="/tags/mesir/">mesir</a>
<a class="post-tag btn btn-outline-primary" href="/tags/alex/">alex</a>
<a class="post-tag btn btn-outline-primary" href="/tags/dns/">dns</a>
<a class="post-tag btn btn-outline-primary" href="/tags/kedihupan/">kedihupan</a>
<a class="post-tag btn btn-outline-primary" href="/tags/cdn/">cdn</a>
<a class="post-tag btn btn-outline-primary" href="/tags/gitea/">gitea</a>
</div>
</div>
</div>
</div>
</div>
<!-- tail -->
<!-- The Search results -->
<div id="search-result-wrapper" class="d-flex justify-content-center unloaded">
<div class="col-11 post-content">
<div id="search-hints">
<!-- The trending tags list -->
<div id="access-tags">
<div class="panel-heading">Tag popular</div>
<div class="d-flex flex-wrap mt-3 mb-1 me-3">
<a class="post-tag btn btn-outline-primary" href="/tags/how-to/">how-to</a>
<a class="post-tag btn btn-outline-primary" href="/tags/server/">server</a>
<a class="post-tag btn btn-outline-primary" href="/tags/docker/">docker</a>
<a class="post-tag btn btn-outline-primary" href="/tags/medic/">medic</a>
<a class="post-tag btn btn-outline-primary" href="/tags/mesir/">mesir</a>
<a class="post-tag btn btn-outline-primary" href="/tags/alex/">alex</a>
<a class="post-tag btn btn-outline-primary" href="/tags/dns/">dns</a>
<a class="post-tag btn btn-outline-primary" href="/tags/kedihupan/">kedihupan</a>
<a class="post-tag btn btn-outline-primary" href="/tags/cdn/">cdn</a>
<a class="post-tag btn btn-outline-primary" href="/tags/gitea/">gitea</a>
</div>
</div>
</div>
<div id="search-results" class="d-flex flex-wrap justify-content-center text-muted mt-3"></div>
</div>
</div>
</div>
</div>
<!-- The Footer -->
<footer>
<div class="container px-lg-4">
<div class="d-flex justify-content-center align-items-center text-muted mx-md-3">
<p>Dikuasakan oleh <a href="https://jekyllrb.com" target="_blank" rel="noopener">Jekyll</a> dengan tema <a href="https://github.com/cotes2020/jekyll-theme-chirpy" target="_blank" rel="noopener">Chirpy</a>.
</p>
<p>©
2023
<a href="https://www.instagram.com/firaz.fat/">Zarif Fathurrahman Rani</a>.
<span
data-bs-toggle="tooltip"
data-bs-placement="top"
title="Kecuali jika dinyatakan, Pos blog di situs ini dilesenkan di bawah Creative Commons Attribution 4.0 International License (CC BY 4.0) oleh penulis."
>Sebagian kandungan dilindungi.</span>
</p>
</div>
</div>
</footer>
<div id="mask"></div>
<button id="back-to-top" aria-label="back-to-top" class="btn btn-lg btn-box-shadow">
<i class="fas fa-angle-up"></i>
</button>
<div
id="notification"
class="toast"
role="alert"
aria-live="assertive"
aria-atomic="true"
data-bs-animation="true"
data-bs-autohide="false"
>
<div class="toast-header">
<button
type="button"
class="btn-close ms-auto"
data-bs-dismiss="toast"
aria-label="Close"
></button>
</div>
<div class="toast-body text-center pt-0">
<p class="px-2 mb-3">Kandungan baharu tersedia.</p>
<button type="button" class="btn btn-primary" aria-label="Update">
Kemas kini
</button>
</div>
</div>
<!-- JS selector for site. -->
<!-- commons -->
<!-- layout specified -->
<script src="/assets/lib/jquery/jquery.min.js"></script>
<script src="/assets/lib/bootstrap/bootstrap.bundle.min.js"></script>
<script src="/assets/lib/simple-jekyll-search/simple-jekyll-search.min.js"></script>
<script src="/assets/lib/lazysizes/lazysizes.min.js"></script>
<script src="/assets/lib/dayjs/dayjs.min.js"></script>
<script src="/assets/lib/dayjs/locale/en.min.js"></script>
<script src="/assets/lib/dayjs/plugin/relativeTime.min.js"></script>
<script src="/assets/lib/dayjs/plugin/localizedFormat.min.js"></script>
<script defer src="/assets/js/dist/home.min.js"></script>
<!--
Jekyll Simple Search loader
See: <https://github.com/christian-fei/Simple-Jekyll-Search>
-->
<script>
/* Note: dependent library will be loaded in `js-selector.html` */
SimpleJekyllSearch({
searchInput: document.getElementById('search-input'),
resultsContainer: document.getElementById('search-results'),
json: '/assets/js/data/search.json',
searchResultTemplate: '<div class="px-1 px-sm-2 px-lg-4 px-xl-0"> <a href="{url}">{title}</a> <div class="post-meta d-flex flex-column flex-sm-row text-muted mt-1 mb-1"> {categories} {tags} </div> <p>{snippet}</p></div>',
noResultsText: '<p class="mt-5"></p>',
templateMiddleware: function(prop, value, template) {
if (prop === 'categories') {
if (value === '') {
return `${value}`;
} else {
return `<div class="me-sm-4"><i class="far fa-folder fa-fw"></i>${value}</div>`;
}
}
if (prop === 'tags') {
if (value === '') {
return `${value}`;
} else {
return `<div><i class="fa fa-tag fa-fw"></i>${value}</div>`;
}
}
}
});
</script>
</body>
</html>