jamstack.org

tumpukan jam

Ini adalah repo untuk https://jamstack.org

Sebuah titik masuk untuk mempelajari model arsitektur ini. Tempat mempelajari apa itu Jamstack, untuk berbagi alat, tips, contoh, dan artikel. Ini juga merupakan tempat untuk menemukan pertemuan komunitas lokal, atau mencari dukungan untuk memulai pertemuan Anda sendiri.

Menyumbang sumber daya

Kami telah mengumpulkan serangkaian video, presentasi, artikel, dan sumber pembelajaran lainnya tentang Jamstack. Anda dapat menyumbangkan konten ke kumpulan sumber daya tersebut!

Kami menerima kontribusi yang dikirimkan sebagai permintaan penarikan.

Kontribusikan tautan ke sumber daya

Untuk menyumbangkan tautan ke sumber daya:

1. Buat file md baru di folder src/site/resources dengan nama yang unik dan deskriptif. Isi file itu sesuai dengan struktur yang ditunjukkan di bawah ini.
2. Untuk presentasi dan video, tambahkan gambar mini opsional ke folder src/site/img/cms . (Gambar harus berukuran jpeg dengan lebar 600 piksel dan tinggi 400 piksel)
3. Kirimkan permintaan tarik

referensi md sumber daya:

---
title : Resource title
date : Publish date (YYYY-MM-DD)
link : the URL of this resource
thumbnailurl : /img/cms/resources/resource-thumbnail.jpg
type :
  - article (Help us group and sort the resources by type article|video|presentation)
---

Sebelum mengirimkan permintaan penarikan, atau jika Anda menyarankan/menyumbangkan perubahan kode atau konten, sebaiknya lihat pratinjau perubahan Anda di build lokal. Kami telah mencoba membuat proses menjalankan pembangunan lokal serendah mungkin.

Menjalankan pembangunan lokal

Prasyarat

• Node dan NPM

Menginstal dan menjalankan build

 # Clone this repository to your local environment
git clone [email protected]:jamstack/jamstack.org.git

# move in to your local site folder
cd jamstack.org

# install the dependencies
npm install

# run the build and dev server locally
npm start

Menata gaya dengan TailwindCSS

Situs ini menggunakan TailwindCSS untuk menawarkan kelas utilitas CSS dan menyediakan sarana cepat untuk menata gaya situs. Ini berarti sebagian besar penataan gaya dapat dilakukan tanpa menulis CSS tambahan apa pun. Sebaliknya, kelas utilitas dapat ditambahkan langsung ke HTML. Hal ini dapat memberikan perkembangan yang sangat pesat dan juga menawarkan tingkat keakraban yang mengejutkan bagi mereka yang terbiasa bekerja dengan cara ini (karena konvensi dan kelas tidak diadakan di setiap lokasi .)

Saat menjalankan/mengembangkan secara lokal, perintah npm run start akan menghasilkan situs termasuk pipeline CSS dari Tailwind.

Utilitas CSS global.

Sejumlah kecil aturan CSS khusus disediakan untuk efisiensi kelas berulang atau kelas global. Ini berada di src/css/tailwind.css tetapi ini harus digunakan dengan hemat, dengan sebagian besar penataan gaya dilakukan di HTML melalui kelas utilitas Tailwind.

Pengembang vs produksi

Selama pembangunan produksi, pipeline CSS menyertakan langkah untuk menghapus semua pernyataan CSS yang tidak digunakan dan mengompresi CSS yang dihasilkan. Untuk efisiensi pengembangan, langkah ini tidak dilakukan selama pengembangan lokal melalui perintah npm run start . Anda dapat melihat pratinjau build produksi yang dioptimalkan dengan menjalankan perintah berikut:

 # Run a production build
npm run build

# Serve the build locally
npm run start

Kloning dan terapkan sekali klik

Anda dapat mengkloning repositori ini dan melakukan bootstrap sebagai situs pengujian Anda sendiri, lengkap dengan pipeline build CI/CD di Netlify dengan mengklik tombol di bawah. (Membutuhkan akun GitHub dan Netlify gratis)