Blog Artikel dengan Rumus dan Ilustrasi
Blog edukasi berbasis MDX dengan rumus matematika yang tajam, ilustrasi vektor, daftar isi, RSS, dan ajakan bertindak di akhir artikel.
- Status
- Sudah berjalan
- Lapisan
- FrontendOtomasi
- Dipakai oleh
- Siswa, orang tua, dan guru yang mencari penjelasan topik matematika lewat Google.

Masalahnya
Artikel bermuatan rumus sering tampil sebagai gambar buram atau teks rusak, sehingga sulit dibaca dan kurang disukai mesin pencari.
Solusinya
Rumus dirender sebagai teks dengan KaTeX, ilustrasi dibuat dari sumber TikZ menjadi SVG, dan gambar sampul dibuat otomatis. Setiap artikel ditutup dengan ajakan ke latihan, course, atau konsultasi.
Cara kerjanya
Apa yang terjadi, langkah demi langkah, dari sudut pandang pengguna.
- 01
Penulis menulis artikel MDX
Artikel ditulis sebagai teks biasa dengan rumus di dalamnya, lalu disimpan bersama kode website.
- 02
Ilustrasi digambar dari kode
Gambar seperti grafik dan bangun datar ditulis dalam TikZ, lalu skrip mengubahnya menjadi SVG yang tajam.
- 03
Sampul dibuat otomatis
Skrip membuat gambar sampul berisi judul dan ilustrasi utama, yang dipakai saat artikel dibagikan.
- 04
Pembaca membuka artikel
Rumus tampil sebagai teks tajam lewat KaTeX, lengkap dengan daftar isi untuk melompat ke bagian tertentu.
- 05
Ajakan sesuai topik
Setiap artikel ditutup dengan ajakan yang cocok: ikut les, latihan mandiri, atau konsultasi gratis bila belum ada produk yang sesuai.
Desain sistemnya
Siapa yang memakai, apa yang mereka lihat, apa yang bekerja di belakang layar, dan di mana data disimpan. Baca dari kiri ke kanan.
1Pengguna
- PenulisMenulis artikel dan sumber gambarnya.
- PembacaDatang dari Google, media sosial, atau RSS.
2Yang dilihat
- Daftar artikelKartu artikel dengan sampul dan kategori.
- Halaman artikelRumus, ilustrasi, daftar isi, dan ajakan penutup.
3Yang bekerja di belakang
- Pengolah MDXMengubah teks artikel menjadi halaman; rumusnya dirender KaTeX.
- Skrip gambarMengubah TikZ menjadi SVG dan membuat gambar sampul.
4Tempat data disimpan
- Folder artikel35 artikel MDX tersimpan bersama kode website.
- Umpan RSSDaftar artikel terbaru untuk aplikasi pembaca berita.
Fitur utama
- Rumus tajam dengan KaTeX
- Ilustrasi SVG dari TikZ
- Daftar isi otomatis
- Umpan RSS
- Ajakan bertindak per topik
Dibangun dengan
- Next.js
- MDX
- KaTeX
- LaTeX
- TikZ
Angka yang bisa dibuktikan
- 35
- Artikel MDX
Yang didapat bisnis
- Rumus tetap tajam dan mudah dibaca di HP.
- Halaman lebih ramah mesin pencari karena rumus berupa teks, bukan gambar buram.
- Setiap artikel mengarahkan pembaca ke langkah berikutnya yang relevan.
- Gambar sampul untuk media sosial tidak perlu didesain manual.
Istilah di halaman ini
- MDX
- Format teks seperti dokumen biasa yang bisa disisipi komponen website, misalnya kotak rumus.
- KaTeX
- Alat yang menampilkan rumus matematika sebagai teks tajam di browser.
- TikZ
- Bahasa untuk menggambar ilustrasi matematika lewat perintah teks.
- SVG
- Format gambar berbasis garis yang tetap tajam saat diperbesar.
Bisa dipakai untuk bisnis Anda?
Untuk bisnis teknis, pendidikan, atau keuangan yang butuh blog SEO dengan rumus, tabel, dan diagram yang tetap rapi.
Konsultasikan proyek ini