Pengantar
11ty adalah generator situs statis kuat berbasis NodeJS. Dalam tutorial ini, saya akan memandu Anda langkah demi langkah dan menunjukkan cara menginstal 11ty di sistem Ubuntu Anda dan menghasilkan situs web statis. Saya menggunakan Ubuntu 20.04 Edition. Semua instruksi dan perintah hanya berlaku untuk Ubuntu.
Prasyarat
Sebagai pengguna Linux, Anda harus memiliki dua paket berikut yang tersedia di sistem Anda.
~ NodeJS
~ NPM
Jika Anda tidak memilikinya saat ini. Instal dengan perintah berikut:
$ sudo apt update
$ sudo apt install node
$ sudo apt install npm
Tanpa Node.js dan NPM, Anda tidak akan dapat terus bekerja dengan 11ty.
Hal terbaik tentang 11ty adalah Anda tidak perlu menginstalnya seperti paket node lainnya. Untuk saat ini, mari buat direktori baru, pindah ke dalamnya, dan inisialisasi masing-masing.
$ mkdir newEleventySite
$ cd newEleventySite/
$ npm init -y
Memasang dan Membuat Proyek 11ty
Langkah 1. Sekarang cukup jalankan perintah berikut untuk membuat direktori baru untuk situs statis 11ty Anda.
$ npm install --save-dev @11ty/eleventy
Setelah selesai, 11ty akan diinstal di direktori yang baru Anda buat. Ini adalah instalasi per proyek. Saya tidak memilih untuk menginstal 11ty secara global. Hal ini membuat penginstalan lebih mudah dan dapat dikelola.
Langkah 2. Sekarang jalankan Eleventy dan Anda akan melihat bahwa beberapa file telah ditulis. Saya tidak memiliki file apa pun sehingga tidak akan terjadi apa-apa pada tahap ini.
$ npx @11ty/eleventy
Seperti yang Anda lihat di layar di atas, saya berhasil menjalankan 11ty. Semuanya pada tahap ini bekerja dengan baik. Kami telah bekerja begitu lama, dan sekarang saatnya untuk membuat situs web dan mempublikasikannya. Sebelum itu, kita membutuhkan sebuah template.
Buat template
Langkah 3. Sekarang saya akan membantu Anda untuk membuat template. Sederhana dan tidak ada yang rumit untuk dilakukan. Ini hanyalah titik awal.
Ini kodenya:
$ echo '<!doctype html><html><head><title>Page title</title></head><body><p>Hi</p></body></html>' > index.html
$ echo '# Page header' > README.md
Setelah template selesai, Anda dapat mempublikasikan situs web Anda untuk sementara waktu. Pada tangkapan layar di atas, Anda melihat bahwa 11ty telah berhasil menulis dua halaman.
Menerbitkan situs web
Setelah templating selesai, 11ty menyimpan situs ke _site map. Anda dapat mengambil semua file yang diekspor dan mempublikasikannya ke host Anda menggunakan klien FTP. Seperti yang ditunjukkan pada tangkapan layar di bawah, saya menambahkan perintah –serve di bagian akhir untuk memublikasikan situs web.
Berikut tampilannya di browser.
Kesimpulan
Dalam tutorial ini, saya memandu Anda tentang cara menginstal Eleventy, yang merupakan generator situs statis yang bagus yang didukung oleh NodeJS. Panduan ini untuk pengguna Ubuntu 20.04. Saya terus-menerus menulis artikel untuk distribusi yang berbeda. Saya mengundang Anda untuk membaca dan membagikannya dengan teman dan keluarga Anda.