Skip to content

Commit

Permalink
feat: upload all rest image post to cloudinary (#59)
Browse files Browse the repository at this point in the history
  • Loading branch information
@rezafikkri
rezafikkri authored Dec 21, 2024
2 parents f1d29f5 + 7486ffb commit f040be4
Show file tree
Hide file tree
Showing 45 changed files with 39 additions and 44 deletions.
12 changes: 6 additions & 6 deletions data/posts/alternatif-software-berbayar.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ title: "Alternatif Software Berbayar"
lastmod: 1679999694791
topics: ["0fff756a-1ad2-4ee2-9c70-3db8d713b476"]
slug: "alternatif-software-berbayar"
ogImage: "/posts/alternatif-software-berbayar/alternatif-software-berbayar.png"
ogImage: "https://res.cloudinary.com/rezafikkri/image/upload/q_auto/alternatif-software-berbayar.png"
---

Bismillah, kali ini kita akan membahas mengenai alternatif software-software berbayar seperti Microsoft Office, CorelDraw, Adobe Photoshop dan Adobe Premier. Mungkin kamu pernah menggunakan software-software tersebut, atau bahkan kamu bekerja dengan menggunakan software-software tersebut. Kebanyakan, orang yang masih awam atau tidak terlalu paham akan teknologi, biasanya menggunakan software bajakan di laptop atau PC-nya, terutama yang menggunakan sistem operasi windows. Mungkin bagi yang masih awam, hal tersebut terjadi karena ketidaktahuan mereka, tetapi ada juga mereka yang paham akan teknologi dan tahu bahwa mereka menggunakan software bajakan, tetapi tetap menggunakannya. Alangkah baiknya jika menggunakan software berbayar, kita menggunakan versi originalnya, yaitu dengan membeli license dari software berbayar yang digunakan, apalagi bagi yang telah mendapatkan penghasilan dari software-software tersebut.
Expand All @@ -15,7 +15,7 @@ Berikut beberapa software open source yang bisa menjadi alternatif dari software

## LibreOffice
LibreOffice merupakan alternatif pertama dari Microsoft Office, di mana di website resminya dikatakan *LibreOffice is a free and powerful office suite* (LibreOffice adalah suite kantor gratis dan kuat). LibreOffice mendukung berbagai sistem operasi, mulai dari Linux, MacOS dan Windows jadi buat kamu yang tidak menggunakan operating sistem Windows, tidak perlu khawatir. Di LibreOffice ada LibreOffice Writer (alternatif Microsoft Office Word), LibreOffice Calc (alternatif Microsoft Office Excel), LibreOffice Impress (Alternatif Microsoft Office Power Point), dll. Berikut tampilan dari LibreOffice Writer yang ada di laptop saya saat ini, dengan versi 7.0 :
![LibreOffice](/posts/alternatif-software-berbayar/libreoffice-7.0.png)<!--rehype:width=1366&height=746&loading=lazy&decoding=async-->
![LibreOffice](https://res.cloudinary.com/rezafikkri/image/upload/q_auto/libreoffice-7.0.png)<!--rehype:width=1366&height=746&loading=lazy&decoding=async-->
Ekstensi file dari LibreOffice Writer ini adalah .odt berbeda dengan Microsoft Office Word yaitu biasanya .docx, file LibreOffice Write tidak bisa dibuka dengan Microsoft Office Word, jika kamu ingin print document di luar, yang mana rata-rata menggunakan Microsoft Office, kamu bisa menggunakan fitur export ke pdf, yang ada di LibreOffice. LibreOffice bisa kamu download pada website resminya di [libreoffice.org](https://www.libreoffice.org/).

## Google Apps
Expand All @@ -24,19 +24,19 @@ Di Google Apps selain YouTube, Google Transalate, ada juga Google Docs (alternat
> **Catatan:** Aplikasi yang ada di Google Apps bukan termasuk aplikasi open source, tetapi kita tetap bisa menggunakannya dengan gratis, dengan batasan tertentu.
Untuk Google Docs salah satu fitur menariknya adalah kita bisa mengerjakan satu dokumen secara bersama-sama pada waktu yang sama. Kita juga tidak perlu menekan tombol simpan, semua akan otomatis disimpan saat kita mengetik. Dan juga kompatibel dengan Microsoft office Word, salah satunya kita bisa mengkonversikan file Google Dokumen ke file Word, atau sebaliknya, serta sudah ada starter template untuk resume, projek proposal, dll. Berikut tampilan dari Google Docs :
![Google Docs](/posts/alternatif-software-berbayar/googledocs.png)<!--rehype:width=1366&height=746&loading=lazy&decoding=async-->
![Google Docs](https://res.cloudinary.com/rezafikkri/image/upload/q_auto/googledocs.png)<!--rehype:width=1366&height=746&loading=lazy&decoding=async-->

## Inkscape
Inkscape merupakan alternatif dari CorelDraw. Inkscape juga mendukung berbagai sistem operasi, mulai dari Linux, MacOS dan Windows. Inkscape bisa digunakan untuk membuat berbagai macam design, seperti logo, dll. Inkscape juga software yang cukup ringan dengan persyaratan sistem yang rendah, yaitu minimal 1 GHz processor, 512 MB RAM dan 500 MB penyimpanan. Meskipun software ini gratis digunakan, tetapi tidak kalah dengan software-software berbayar seperti CorelDraw. Inkscape bisa kamu download di website resminya di [inkscape.org](https://inkscape.org/). Berikut tampilan dari Inkscape :
![Inkscape](/posts/alternatif-software-berbayar/inkscape.png)<!--rehype:width=1200&height=675&loading=lazy&decoding=async-->
![Inkscape](https://res.cloudinary.com/rezafikkri/image/upload/q_auto/inkscape.png)<!--rehype:width=1200&height=675&loading=lazy&decoding=async-->

## GIMP
Gimp merupakan alternatif untuk Photoshop. Gimp juga mendukung berbagai sistem operasi, mulai dari Linux, MacOS dan Windows. Pada GIMP kita bisa manipulasi foto, membuat artwork, dll. GIMP juga merupakan software yang ringan, jadi tidak terlalu membutuhkan komputer dengan speksifikasi yang tinggi. GIMP bisa kamu download di website resminya di [gimp.org](https://www.gimp.org/). Berikut tampilan dari GIMP :
![GIMP](/posts/alternatif-software-berbayar/gimp.png)<!--rehype:width=1366&height=746&loading=lazy&decoding=async-->
![GIMP](https://res.cloudinary.com/rezafikkri/image/upload/q_auto/gimp.png)<!--rehype:width=1366&height=746&loading=lazy&decoding=async-->

## Kdenlive
Kdenlive merupakan software alternatif untuk Adobe Premiere, juga mendukung berbagai sistem operasi, mulai dari Linux, MacOS dan Windows. Kdenlive mendukung banyak Video dan Audio format, seperti H.264, Quick Time, dll. Kita juga bisa melakukan color correction untuk memperbaiki warna pada video. Walaupun software ini gratis digunakan, software ini memiliki fitur fitur yang lumayan, bahkan salah satu channel youtube seperti Indonesia Belajar misalnya, menggunakan kdenlive dalam mengedit videonya. Kdenlive bisa kamu download di website resminya di [kdenlive.org](https://kdenlive.org/). Berikut tampilan dari Kdenlive :
![Kdenlive](/posts/alternatif-software-berbayar/kdenlive.png)<!--rehype:width=1920&height=1080&loading=lazy&decoding=async-->
![Kdenlive](https://res.cloudinary.com/rezafikkri/image/upload/q_auto/kdenlive.png)<!--rehype:width=1920&height=1080&loading=lazy&decoding=async-->

Oke, terima kasih buat kamu yang sudah membaca, semoga bermanfaat. Jika ada yang ingin ditanyakan atau ada saran silahkan kirim email ke [email protected]. Jangan lupa follow Linkedin saya di [in/reza-sariful-fikri](https://www.linkedin.com/in/reza-sariful-fikri) untuk mendapatkan tulisan terbaru. Serta jangan lupa baca artikel dan tutorial saya lainnya pada halaman Blog dengan mengklik menu Blog pada navbar atau footer.

Expand Down
6 changes: 3 additions & 3 deletions data/posts/bagaimana-cara-kerja-cookie-dan-session.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ title: "Bagaimana Cara Kerja Cookie dan Session?"
lastmod: 1734069067838
topics: ["50d103e8-2275-4b09-8dea-5105ab5e9838","56863ee6-39ae-40d2-94ca-34e0805ce291","b2ded9c2-dea9-4427-a4aa-3b5a24e89468","cdc80207-597b-4fb7-b572-53b68c9f1a78","3b2bf050-b69c-4438-b3d9-ed0a3a5e0911"]
slug: "bagaimana-cara-kerja-cookie-dan-session"
ogImage: "/posts/bagaimana-cara-kerja-cookie-dan-session/cara-kerja-cookie-session.png"
ogImage: "https://res.cloudinary.com/rezafikkri/image/upload/q_auto/cara-kerja-cookie-session.png"
---

Bismillah.
Expand All @@ -26,7 +26,7 @@ Untuk semua prasyarat diatas kecuali nomor 3, bisa kamu pelajari di kelas gratis
Cookie adalah kumpulan data kecil yang berisi informasi yang dikirim oleh Server ke Client (Browser). Cookie juga dikenal sebagai *Web Cookie*, *Browser Cookie*, atau *Internet Cookie*.

Cara kerja Cookie secara umum yaitu, Browser mengirim HTTP Request ke Server, lalu Server akan menyertakan header `Set-Cookie` (yang berisi data cookie-nya) pada HTTP Response, kemudian Browser akan menyimpan data yang terdapat pada header `Set-Cookie`, lalu pada request-request berikutnya, Browser akan menyertakan data Cookie tersebut pada HTTP Request header `Cookie`. Berikut jika digambarkan dalam bentuk diagram:
![Cookie Diagram](/posts/bagaimana-cara-kerja-cookie-dan-session/cookie-diagram.svg)<!--rehype:width=802&height=441&loading=lazy&decoding=async-->
![Cookie Diagram](https://res.cloudinary.com/rezafikkri/image/upload/q_auto:best/cookie-diagram.svg)<!--rehype:width=802&height=441&loading=lazy&decoding=async-->

Berikut adalah contoh dimana kita misalnya membuat Cookie "session identifier" dengan nama `SIDR` dan value `31d4d96e407aad42`:
```http
Expand Down Expand Up @@ -114,7 +114,7 @@ Setelah membahas mengenai Cookie, sekarang kita akan membahas mengenai Session,
Session adalah cara atau teknik untuk menyimpan informasi client di Server. Session juga sebenarnya menggunakan Cookie, namun bedanya nilai expire dari cookie Session biasanya adalah "session", yang berarti jika sesi telah berakhir maka Session akan otomatis dihapus dan tidak seperti Cookie yang mana informasi-nya disimpan di Client (Browser), kalau Session, informasi-nya disimpan di Server, baik itu di dalam file, di dalam database dan lain-lain. Sedangkan yang dikembalikan oleh Server melalui header `Set-Cookie` pada HTTP Response adalah biasanya ID dari Sessionnya. Selain itu juga, Session tidak ada di spesifikasi HTTP, berbeda dengan Cookie yang mana ada di spesifikasi HTTP.

Cara kerja Session secara umum adalah, Browser mengirim HTTP Request ke Server, lalu Server akan membuat Session dan menyimpan Session tersebut, misalnya di database, selanjutnya Server akan mengirim HTTP Response ke Browser disertai header `Set-Cookie` yang berisi ID dari Session tersebut, pada request selanjutnya Browser akan menyertakan Cookie yang berisi ID dari Session, lalu Server akan mengecek (misalnya ke database) apakah Session dengan ID tersebut ada, jika ada maka data Session-nya akan diload sehingga bisa diakses di sisi server *([server side](https://www.enonic.com/blog/what-is-the-difference-between-server-side-and-client-side)*). Berikut jika digambarkan dalam bentuk diagram:
![Session Diagram](/posts/bagaimana-cara-kerja-cookie-dan-session/session-diagram.svg)<!--rehype:width=861&height=373&loading=lazy&decoding=async-->
![Session Diagram](https://res.cloudinary.com/rezafikkri/image/upload/q_auto:best/session-diagram.svg)<!--rehype:width=861&height=373&loading=lazy&decoding=async-->

Seperti yang dijelaskan sebelumnya pada bagian Cookie, pertimbangkan juga untuk mengatur atribut `HttpOnly` dan `Secure` pada cookie Session.

Expand Down
6 changes: 3 additions & 3 deletions data/posts/deploy-website-dengan-cicd-1-pendahuluan.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ title: "Deploy Website dengan CI/CD #1: Pendahuluan"
lastmod: 1720766808794
topics: ["e5d6b8ea-d8e0-4bd2-8bb3-d74d08dc5669","ab8888e2-d055-4507-aec3-7cadb0d36d98","3b2bf050-b69c-4438-b3d9-ed0a3a5e0911"]
slug: "deploy-website-dengan-cicd-1-pendahuluan"
ogImage: "/posts/deploy-vercel-github-action/1-deploy-vercel-github-action.png"
ogImage: "https://res.cloudinary.com/rezafikkri/image/upload/q_auto/1-deploy-vercel-github-action.png"
serial: {"id":"ede13e57-95e1-425e-9e07-f5f686cb3990","order":1}
---

Expand Down Expand Up @@ -39,8 +39,8 @@ Berikut langkah-langkahnya:
<ol>
<li>Buka terminal atau cmd pada direktori utama website counter-js yang telah di download, kemudian jalankan <code>git init</code> untuk membuat local repositori baru dan jangan lupa lakukan commit.
</li>
<li>Buat public remote repositori baru pada akun GitHub-mu, isi <strong>Repository name</strong>, <strong>Decription</strong> (optional) dan klik <strong>Create repository</strong> (biarkan value yang lain default saja): <img alt="before create new repo" src="/posts/deploy-vercel-github-action/before-create-new-repo.png" width="1336" height="1224" loading="lazy" class="mt-6" decoding="async"/></li>
<li>Pastikan setelah kamu klik <strong>Create repository</strong>, maka akan diarahkan ke halaman seperti di bawah ini, yang menandakan repositori masih kosong: <img alt="after create new repo" src="/posts/deploy-vercel-github-action/after-create-new-repo.png" width="1336" height="656" loading="lazy" class="mt-6" decoding="async"/></li>
<li>Buat public remote repositori baru pada akun GitHub-mu, isi <strong>Repository name</strong>, <strong>Decription</strong> (optional) dan klik <strong>Create repository</strong> (biarkan value yang lain default saja): <img alt="before create new repo" src="https://res.cloudinary.com/rezafikkri/image/upload/q_auto/before-create-new-repo.png" width="1336" height="1224" loading="lazy" class="mt-6" decoding="async"/></li>
<li>Pastikan setelah kamu klik <strong>Create repository</strong>, maka akan diarahkan ke halaman seperti di bawah ini, yang menandakan repositori masih kosong: <img alt="after create new repo" src="https://res.cloudinary.com/rezafikkri/image/upload/q_auto/after-create-new-repo.png" width="1336" height="656" loading="lazy" class="mt-6" decoding="async"/></li>
<li>
Buka kembali terminal atau cmd pada direktori utama website counte-js dan tambahkan remote repositori yang telah dibuat sebelumnya dengan nama "origin" (kamu bisa menggunakan <em>ssh</em> atau <em>https</em>):
<pre><code class="language-bash"># ssh
Expand Down
12 changes: 6 additions & 6 deletions data/posts/deploy-website-dengan-cicd-2-github-actions-workflow.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ title: "Deploy Website dengan CI/CD #2: GitHub Actions Workflow"
lastmod: 1720767708928
topics: ["e5d6b8ea-d8e0-4bd2-8bb3-d74d08dc5669","ab8888e2-d055-4507-aec3-7cadb0d36d98","3b2bf050-b69c-4438-b3d9-ed0a3a5e0911"]
slug: "deploy-website-dengan-cicd-2-github-actions-workflow"
ogImage: "/posts/deploy-vercel-github-action/2-deploy-vercel-github-action.png"
ogImage: "https://res.cloudinary.com/rezafikkri/image/upload/q_auto/2-deploy-vercel-github-action.png"
serial: {"id":"ede13e57-95e1-425e-9e07-f5f686cb3990","order":2}
---

Expand All @@ -22,7 +22,7 @@ Mengenai *event* dan *jobs*, *event* adalah aktivitas spesifik di dalam sebuah r
## Membuat GitHub Actions Workflow

Oke, untuk membuat workflow, buat direktori `.github/workflows/` di dalam direktori utama website counter-js, lalu didalamnya buat file `ci.yml`, seperti dibawah ini:
![create ci yml](/posts/deploy-vercel-github-action/create-ci-yml.png)<!--rehype:width=564&height=439&loading=lazy&class=mt-6&decoding=async-->
![create ci yml](https://res.cloudinary.com/rezafikkri/image/upload/q_auto/create-ci-yml.png)<!--rehype:width=564&height=439&loading=lazy&class=mt-6&decoding=async-->
Dan copy semua code dibawah ini ke dalam file `ci.yml`:
```yaml
name: Continious Integration
Expand Down Expand Up @@ -100,15 +100,15 @@ Sekarang, saya akan menjelaskan setiap baris kode diatas, supaya kamu lebih mema
> **Info:** Jika kamu ingin melihat dan belajar lebih detail mengenai syntax workflow, bisa lihat di [workflow syntax for GitHub Actions](https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions).
Setelah selesai membuat workflow saatnya mencoba workflow yang telah dibuat, untuk itu, kamu bisa melakukan commit lalu push terlebih dahulu untuk mengupload workflow ke remote repositori dan pastikan di remote repositori pada tab **Actions** &raquo; pada sidebar menu sebelah kiri terdapat workflow dengan nama **Continious Integration**:
![push ci yml](/posts/deploy-vercel-github-action/push-ci-yml.png)<!--rehype:width=1366&height=656&loading=lazy&class=mt-6&decoding=async-->
![push ci yml](https://res.cloudinary.com/rezafikkri/image/upload/q_auto/push-ci-yml.png)<!--rehype:width=1366&height=656&loading=lazy&class=mt-6&decoding=async-->
Untuk memicu workflow agar dijalankan, buat branch baru dan lakukan perubahan apapun di local repositori, setelah itu lakukan commit lalu push dan buka sebuah pull request ke branch main. Jika tidak ada masalah pada workflow yang dibuat, maka secara otomatis workflow akan dijalankan:
![test workflow pending](/posts/deploy-vercel-github-action/test-workflow-pending.png)<!--rehype:width=1351&height=656&loading=lazy&class=mt-6&decoding=async-->
![test workflow pending](https://res.cloudinary.com/rezafikkri/image/upload/q_auto/test-workflow-pending.png)<!--rehype:width=1351&height=656&loading=lazy&class=mt-6&decoding=async-->
Jika proses CI yang dijalankan berhasil (artinya lolos testing dan linting) maka akan berstatus *pass*:
![test workflow pass](/posts/deploy-vercel-github-action/test-workflow-pass.png)<!--rehype:width=1351&height=656&loading=lazy&class=mt-6&decoding=async-->
![test workflow pass](https://res.cloudinary.com/rezafikkri/image/upload/q_auto/test-workflow-pass.png)<!--rehype:width=1351&height=656&loading=lazy&class=mt-6&decoding=async-->
Untuk sekarang tidak perlu untuk melakukan *Merge pull request* atau semacamnya, karena ini hanya bertujuan untuk melihat apakah workflow akan dijalankan ketika misalnya sebuah pull request dibuka ke branch main. Untuk itu kamu bisa *Close pull request* tersebut dengan scroll ke paling bawah halaman dan klik button *Close pull request*:
![close pull request](/posts/deploy-vercel-github-action/close-pull-request.png)<!--rehype:width=1351&height=656&loading=lazy&class=mt-6&decoding=async-->
![close pull request](https://res.cloudinary.com/rezafikkri/image/upload/q_auto/close-pull-request.png)<!--rehype:width=1351&height=656&loading=lazy&class=mt-6&decoding=async-->
Oke, terima kasih buat kamu yang sudah membaca, semoga bermanfaat. Jika ada yang ingin ditanyakan atau ada saran silahkan kirim email ke [email protected]. Jangan lupa follow Linkedin saya di [in/reza-sariful-fikri](https://www.linkedin.com/in/reza-sariful-fikri) untuk mendapatkan tulisan terbaru. Serta jangan lupa baca artikel dan tutorial saya lainnya pada halaman Blog dengan mengklik menu Blog pada navbar atau footer.
Expand Down
Loading

0 comments on commit f040be4

Please sign in to comment.