Belajar Membuat Hello World dengan Wagtail

Setelah install wagtail kita lanjut belajar cms ini dengan membuat home page baru. Seperti biasa, pelajaran IT dasar dimulai dengan membuat tulisan agar terlihat pada browser. Pada contoh kali ini misalnya tulisan "Hello Word..... ini contoh postingan pertama".

Sebagaimana telah dijelaskan sebelumnya. Wagtail adalah salah satu CMS yang bersifat free dan open source. Salah satu keunikan dari CMS ini sangat banyak. Saya tertarik karena wagtail dikembangkan dengan framework Django yang berdasarkan bahasa Python.

Dengan Wagtail, saya kira inilah cara cepat membuat web dengan pyhon. Oleh karenanya, di sini saya mencoba belajar otodidak untuk membuktikan hal tersebut. Bagi pemula yang belajar komputer otodidak yuks simak pengalaman saya belajar membuat program hello word dengan wagtail.

Belajar Membuat Hello World dengan Wagtail

Sebelum mempraktekan tutorial di bawah ini pastikan jika Wagtail sudah terpasang. Begitu juga dengan prasyarat yang dibutuhkan oleh wagtail yang mau tidak mau harus install Python. Jika ini sudah terpasang semua di komputer Anda selanjutnya:

1. Buka CMD, masuk ke direktori dengan cara ketik perintah cd mysite

2. Jalankan fungsi webserver dengan perintah: python manage.py runserver

3. Silahkan buka localhost:8000 dan ini tampilan defaultnya.

4. Untuk membuat home page sendiri dari nol silahkan edit file model.py yang ada di This PC > Local Disk > Users > User > mysite > home

5. Buka file models.py dengan teks editor yang ada pada komputer Anda.

6. Dengan Notepad, IDLE atau Visual Studio Code terserah sesuai selera Anda.

7. File tersebut isinya seperti ini:

from django.db import models

from wagtail.core.models import Page

class HomePage(Page):

    pass

8. Kemudian saya coba rubah dengan kode contekan dari wagtail berikut ini:

from django.db import models

from wagtail.core.models import Page
from wagtail.core.fields import RichTextField
from wagtail.admin.edit_handlers import FieldPanel


class HomePage(Page):
    body = RichTextField(blank=True)

    content_panels = Page.content_panels + [
        FieldPanel('body', classname="full"),
    ]

9. Kemudian simpan dengan cara klik File > Save.

10. Kemudian saya coba jalankan browser agar tahu seperti apa sih hasilnya. Ternyata masih error seperti ini karena perubahan tadi belum dikirim ke webserver.

11. Kemudian saya kembali ke command prompt dan matikan dulu webservernya dengan perintah Ctrl + Break

12. Kemudian saya jalankan perintah python manage.py makemigrations 

13. Dilanjutkan dengan perintah: python manage.py migrate. Jadi, perintah ini untuk mengeksekusi file tadi agar memperbarui database dengan model yang baru saja dibuat. Kesimpulan awal saya:"Untuk setiap perubahan yang terjadi pada file model.py maka perintah di atas ini harus dijalankan. Tujuannya agar perubahan tadi diaplikasikan pada halaman home page yang sedang kita buat.

14. Kemudian saya jalankan lagi perintah python manage.py runserver. Kalau yang biasa belajar webserver di Windows, perintah ini fungsinya kayak mirip dengan xampp ya?

15. Kemudian akses ke localhost seperti pada tampilan nomor 3

16. Lanjut ke menu dashboard admin. Masukan username, password dan tekan enter, Kemudian klik Page > Home > Edit

17. Silahkan ketikan kalimat yang ingin dimunculkan di layar.

18. Klik Publish

19. Ini tampilannya di dashboard admin.

20. Penasaran, saya kita klik view live tampilannya masih sama seperti baru instalasi sma kaya nomor 3. 

21. Ternyata, template harus diupdate terlebih dahulu agar mencerminkan perubahan yang sudah terjadi pada bagian model.py. Silahkan cari template tersebut yang ada di file home_page.html.

22. Awalnya ini isi file home page yang belum dirubah tersebut.

23. Kemudian saya ganti dengan baris kode berikut ini:

{% extends "base.html" %}

{% load wagtailcore_tags %}

{% block body_class %}template-homepage{% endblock %}

{% block content %}
    {{ page.body|richtext }}
{% endblock %}

24. Klik File > Save untuk menyimpan.

25. Berhasil, inilah home page baru Anda.

Sekarang kita sudah bisa membuat home page dari nol dengan wagtail. Tapi terus terang ini masih banyak tanda tanya yang belum terjawab. Semoga saja banyak teman-teman +62 yang juga berbagi pengalaman cara cepat membuat web dengan pyhon. Lebih diharapkan lagi konten belajar coding pemula yang berkaitan langsung dengan wagtail.

Semoga bermanfaat.

Baca Juga