strapi starter next corporate

⛔ usang

Repositori ini tidak lagi dipertahankan dan hanya berfungsi untuk Strapi V3. Anda dapat menemukan versi strapi V4 terbaru dari starter ini pada monorepo starters-and-templates.

---

Strapi starter situs perusahaan berikutnya

Starter berikutnya untuk membuat situs perusahaan dengan strapi.

Lihat demo langsung • Baca posting blog

Starter ini dirancang untuk fleksibilitas. Menggunakannya, Anda akan dapat mengelola konten situs web Anda sepenuhnya di Strapi, dan mendapatkan aplikasi berikutnya secara otomatis. Tim pemasaran akan dapat membuat halaman dan merancang tata letak mereka tanpa bantuan dari pengembang.

Fitur pemula ini:

• Penciptaan halaman di dalam strapi, tidak ada kode yang diperlukan
• Struktur halaman yang sepenuhnya fleksibel: Desain halaman yang Anda inginkan menggunakan bagian UI
• 8 bagian UI di luar kotak: pahlawan, richtext, largevideo, testimonial, harga, bottom, feature, featureColumns
• Mudah ditema dengan tailwind
• Pembuatan situs statis dengan selanjutnya
• Mode Pratinjau Terpadu, untuk melihat halaman Anda di URL pribadi sebelum menerbitkannya
• Konten dalam berbagai bahasa menggunakan i18n

Starter ini menggunakan Template Perusahaan Strapi

Lihat semua pemula kami di sini

Memulai

Gunakan CLI create-strapi-starter kami untuk membuat proyek Anda.

npx create-strapi-starter@3 my-site next-corporate

CLI akan membuat monorepo, menginstal dependensi, dan menjalankan proyek Anda secara otomatis.

Server Frontend berikutnya akan berjalan di sini => http: // localhost: 3000

Server backend strapi akan berjalan di sini => http: // localhost: 1337

Mode pratinjau

Anda dapat menyalakan mode pratinjau dengan URL seperti ini:

http://localhost:3000/api/preview?secret=<preview-secret>&slug=<slug>

<preview-secret> adalah token rahasia yang ditentukan dalam konfigurasi .env Anda, <slug> adalah siput yang Anda masukkan di strapi untuk halaman Anda.

Saat mode pratinjau ada, Anda dapat mengakses halaman draft seperti halnya Anda akan published halaman.

Misalnya http: // localhost: 3000/rahasia akan tersedia dalam mode pratinjau.

Sebuah spanduk akan tetap di bawah navigasi untuk memberi tahu Anda mode pratinjau dan juga akan memungkinkan Anda untuk mematikannya.

Kustomisasi situs perusahaan Anda

Untuk mengedit situs web ini, Anda harus menjalankan frontend dan backend di lingkungan pengembangan Anda.

Menambahkan bagian

Kami telah membangun bagian untuk Anda, tetapi Anda mungkin ingin menambahkan lebih banyak agar sesuai dengan kebutuhan Anda. Ikuti langkah -langkah ini:

• Buat komponen baru di strapi di kategori "bagian"
• Di pembangun tipe konten, buka koleksi halaman dan periksa bagian baru Anda di bidang contentSections .
• Buat komponen bereaksi yang mengambil data prop di /frontend/components/sections
• Untuk menautkan bagian strapi Anda ke komponen reaksi ini, buka /frontend/components/sections.js , dan tambahkan entri ke objek sectionComponents .

Tema khusus

Kami menggunakan CSS Tailwind untuk gaya. Untuk memodifikasi tampilan halaman Anda, Anda dapat mengedit tema di /front/tailwind.config.js . Baca dokumen Tailwind untuk melihat semua perubahan yang dapat Anda lakukan. Misalnya, Anda dapat mengubah warna utama seperti ini:

 const { colors } = require ( `tailwindcss/defaultTheme` )

module . exports = {
  theme : {
    extend : {
      colors : {
        primary : colors . green ,
      } ,
    } ,
  } ,
} 

Menyebarkan produksi

Anda perlu menggunakan proyek frontend dan backend secara terpisah. Berikut adalah dokumen untuk menggunakan masing -masing:

• Menggunakan strapi
• Menyebarkan Next.js

Jangan lupa untuk mengatur variabel lingkungan Anda di aplikasi produksi Anda.

Berikut yang diperlukan untuk frontend:

• NEXT_PUBLIC_STRAPI_API_URL : url backend strapi Anda, tanpa trailing slash
• PREVIEW_SECRET : String acak yang digunakan untuk melindungi halaman pratinjau Anda

Dan untuk backend:

• FRONTEND_URL : URL frontend Anda, tanpa slash trailing
• FRONTEND_PREVIEW_SECRET : Token Mode Pratinjau Next.js Ditentukan di Frontend

Bersenang -senang menggunakan starter ini!