gatsby starter saas marketing

☁️ Starter situs pemasaran satu halaman sederhana untuk perusahaan SaaS dan peretas indie.

Demo Langsung: https://gatsby-starter-saas-marketing.netlify.com/- ️ Penyebaran demo langsung tidak lagi tersedia di Netlify.

Memulai?

Instal Gatsby CLI - Info lebih lanjut

npm install -g gatsby-cli

atau

yarn global add gatsby-cli

Instal starter secara lokal:

gatsby new gatsby-starter-saas-marketing https://github.com/keegn/gatsby-starter-saas-marketing

instal dependensi:

yarn install

Mulai server pengembangan:

gatsby develop

Di root proyek, kompilasi aplikasi Anda untuk penempatan:

gatsby build

Bersihkan cache untuk memperbaiki kesalahan tertentu - jalankan perintah bersih sebelum memulai server dev:

gatsby clean

Di root proyek, sajikan pembangunan produksi situs Anda:

gatsby serve

Gaya

Starter ini menggunakan komponen gaya. File tema berisi gaya dasar src/styles/theme.js dan file gaya global berisi gaya elemen dasar dan gaya reset src/styles/GlobalStyles.js .

Navigasi

Starter ini menggunakan react-anchor-link-smooth-scroll dan react-scrollspy. Untuk menautkan item navigasi ke bagian, cukup tambahkan nilai ID dan string ke elemen induk bagian yang sesuai dengan nilai string navigasi yang sama dalam navigation.js

️ Hanya bagian Features yang ditautkan. Bagian produk dan penetapan harga sengaja tidak ditautkan dan akan melempar TypeError di konsol saat diklik (karena mereka tidak ada di starter). Harap hubungi jika Anda ingin bantuan memperluas fitur ini.

Menyebarkan ke Netlify

Panduan Penempatan

Kumpulkan email dengan formulir netlify

Penanganan bentuk dengan gatsby.js v2 dan netlify

Contoh Penggunaan Formulir Netlify

Di header.js menggantikan komponen <HeaderForm>...</HeaderForm> dengan berikut ini harus memberikan contoh yang berfungsi setelah situs Anda digunakan:

 <HeaderForm
 name="early-access"
 method="post"
 data-netlify-honeypot="bot-field"
 data-netlify="true"
>
  <input type="hidden" name="bot-field" />
  <input type="hidden" name="form-name" value="early-access" />
  <HeaderInput
   type="email"
   placeholder="Your email"
   name="email"
   id="email"
   required
  />
  <HeaderButton>Early access</HeaderButton>
</HeaderForm>