AMP

Setting up

Prasyarat

Sebelum memulai tutorial ini, Anda akan memerlukan hal berikut ini:

  • Pengetahuan dasar tentang HTML, CSS, dan JavaScript
  • Pemahaman dasar tentang konsep inti AMP (lihat tutorial "Mengonversi HTML Anda menjadi AMP")
  • Browser pilihan Anda
  • Editor teks pilihan Anda

Menyiapkan lingkungan pengembangan

Langkah ke-1. Mengunduh kode

  1. Unduh kode untuk tutorial, yang dikompresi sebagai berkas zip dari URL berikut ini: https://github.com/ampproject/docs/raw/master/tutorial_source/amp-pets-story.zip

  2. Ekstrak konten berkas zip tersebut. Di direktori amp-pets-story ada berkas gambar, video, audio, dan data yang akan kita gunakan untuk membuat cerita. Berkas pets.html adalah titik awal kita untuk cerita ini. Cerita yang sudah jadi atau selesai dapat dilihat pada berkas pets-completed.html.

Langkah ke-2. Menjalankan halaman sampel

Untuk menguji Cerita Web sampel, kita harus mengakses berkasnya dari server web. Ada beberapa cara untuk membuat server web lokal sementara untuk tujuan pengujian. Berikut ini adalah beberapa opsinya, pilih salah satu opsi terbaik bagi Anda:

After setting up your local web server, have a look at what our completed Web Story will look like by the end of this tutorial by accessing the following URL:

http://localhost:8000/pets-completed.html

PENTING – Pastikan URL ditayangkan dari localhost; jika tidak, Cerita Web ini mungkin tidak akan dimuat dengan benar, dan Anda mungkin akan menemukan eror, seperti "source" "must start with "https://" or "//" or be relative and served from either https or from localhost.

Klik pada cerita yang sudah jadi dan pahami apa yang akan kita buat.