evangelist

Komponen pemasaran bit.dev

Kumpulan komponen React yang dapat digunakan kembali yang digunakan untuk membangun situs web pemasaran bit.dev. Repositori ini adalah mikro-frontend berbasis komponen yang mengekspos komponen.

Koleksi komponen - pilih dan gunakan

Semua komponen dalam basis kode frontend ini dibuat dan diekspos menggunakan Bit sebagai kumpulan komponen yang dapat digunakan secara independen. Lihat cakupan evangelist di bit.dev untuk menjelajahi dan mengintegrasikan komponen apa pun ke dalam proyek Anda.

• Instal komponen independen dengan bbit install
• Gunakan bbit import untuk menjelajahi komponen di ruang kerja lokal Anda dan memodifikasinya sesuai kebutuhan Anda.
• Cobalah komponen apa pun secara langsung di taman bermain langsung dokumen dan di halaman 'komposisi'.

Ini adalah mikro-frontend berbasis komponen

Tunggu.. apa?

Seluruh platform dan situs web bit.dev tidak dibangun sebagai satu aplikasi monolitik . Sebaliknya, itu dibangun dari komponen yang dikelola dalam basis kode berbeda yang dikembangkan secara terpisah, kemudian diekspos dan diintegrasikan bersama menggunakan Bit.

Tunjukkan pada saya sebuah contoh!

Lihatlah beranda bit.dev.

Anda akan melihat bahwa itu dibangun dari komponen yang berada di basis kode front-end yang berbeda:

• komponen evangelist (di sini).
• komponen base-ui.
• Aplikasi kontainer (pribadi).
• dll.

Kami menggunakan Bit untuk memuat dan mengekspos komponen dari basis kode apa pun sebagai sekumpulan API di bit.dev yang dapat diintegrasikan ke dalam halaman dan aplikasi berbeda. Misalnya:

• Mengekspos komponen evangelist di bit.dev.
• Komponen base-ui terbuka di bit.dev.

Komponen utama

Halaman

halaman penuh dengan margin, latar belakang. Karena ukurannya, komponen Halaman tidak boleh berisi konten terperinci dan hanya mengatur tata letak untuk masing-masing bagian.

Bagian

Area individual berisi sebagian besar konten, dan dapat digunakan kembali antar halaman. Bagian mungkin menempati ruang berbeda di halaman berbeda, jadi sebaiknya hindari ukuran dan latar belakang

Isi

Objek data mentah untuk komponen visual (seperti model MVC). Satu komponen UI dapat menggunakan banyak komponen Konten di tempat berbeda, dan Konten dapat disajikan secara berbeda di komponen UI berbeda.

Atom / 'beton'

Komponen yang khusus untuk beranda ini. Sebagai komponen UI atom, komponen tersebut masih abstrak dan tidak boleh berisi teks dan konten.

Pengaturan

1. Instal Bit: npm install @teambit/bit --global
2. Kloning Ruang Kerja Bit ini: git clone https://github.com/teambit/evangelist.git evangelist
3. Buka direktori ruang kerja: cd evangelist
4. Instal semua paket dan impor semua komponen: bbit install
5. Jalankan UI Workspace untuk menjelajahi komponen Evangalist: bbit start dan buka https://localhost:3000
6. Menikmati!