Jadual Kandungan[Sembunyi][Tunjukkan]
- Apakah Bubble.io?
- Apakah pengaturcaraan visual?
- Apakah jenis apl yang boleh anda bangunkan?
Membina apl dengan Bubble (Tutorial)+-
- 1. Bermula
- 2. Mengkonfigurasi pangkalan data
- 3. Membina aliran kerja
- 4. Mencipta berita
- 5. Memaparkan kandungan dinamik dalam suapan
- 6. Menghantar data antara halaman
- 7. Memaparkan kandungan dinamik pada halaman cerita
- 8. Memaparkan artikel penerbit
- 9. Mengikuti penerbit
- 10. Ciri tambahan yang anda boleh tambah
- 11. Hasilnya
- Kelebihan
- Kekurangan
- Harga
- Kesimpulan
Saya baru-baru ini berminat dengan pendekatan pembangunan web selain daripada HTML, CSS dan JavaScript.
Dengan landskap tanpa kod yang semakin berkembang, tidaklah menghairankan apabila mendapati terdapat beberapa alternatif kepada pendekatan yang lebih standard untuk membangunkan aplikasi web.
Anda mesti biasa dengan beberapa platform CMS yang lebih terkenal, seperti WordPress yang hampir bebas kod. Tetapi, jika anda ingin membina apl web, platform sedemikian mungkin kelihatan terhad.
Di sini saya memperkenalkan anda kepada Bubble.io, yang berkuasa alat tanpa kod yang membolehkan anda membina apl web seperti sebelum ini.
Mari kita terokainya secara mendalam!
Apakah Bubble.io?
Bubble ialah platform bukan teknikal yang menggabungkan bahasa pengaturcaraan visual dan a rangka kerja pembangunan web.
Pengguna boleh menggunakan alatan pengaturcaraan ini untuk membina aplikasi dalam talian yang unik, mengubah pangkalan data dan proses, menambah komponen halaman (imej, teks, borang input, peta) dan mereka bentuk antara muka mereka.
Ia adalah pasaran tempat anda boleh menemui templat, pemalam dan perkhidmatan yang ideal untuk membantu anda membina produk yang kukuh.
Tanpa perlu menyediakan rangka kerja pengaturcaraan biasa, anda boleh mencipta apa sahaja daripada pasaran ke rangkaian sosial kepada CRM (Pengurusan Perhubungan Pelanggan) menggunakan Bubble.
Ia memberi pelanggan keupayaan untuk mencipta dan memperibadikan apl mereka menggunakan antara muka mesra pengguna dan editor titik dan klik.
Anda boleh menggunakannya bersama-sama dengan perkhidmatan yang menyediakan API REST, seperti Facebook, SQL, analitis dan apl pembayaran. Ia membolehkan pengguna menumpukan masa untuk menambah baik kefungsian dan penampilan aplikasi mereka supaya kelihatan baik pada tablet dan peranti mudah alih.
Ia sesuai untuk semua saiz perniagaan, dari kecil hingga sederhana hingga besar; dan boleh diakses untuk Windows, Mac dan web.
Apakah pengaturcaraan visual?
Pengaturcaraan visual pada asasnya adalah seperti apa bunyinya. Daripada pengaturcaraan manual dengan menulis kod, anda melakukannya secara grafik dengan mengklik dan menyeret komponen ke dalam halaman.
Jangan terpedaya dengan penerangan ringkas itu.
Ia tidak seperti mana-mana apl pemotong kuki lain atau alat pembinaan tapak web yang anda temui dalam talian. Kebanyakan pembina aplikasi memerlukan anda bergantung pada templat asas dan mempunyai fungsi yang sangat terhad; ia hanya membenarkan anda membangunkan jenis apl tertentu dan mengehadkan pemperibadian anda.
Walaupun tanggapan "pengaturcaraan visual" dan "menyeret dan menjatuhkan" kelihatan mudah dalam Bubble, ia sangat berkuasa.
Persekitaran pengaturcaraan visualnya bukan sahaja membolehkan anda menyeret objek seperti teks, grafik, input dan banyak lagi ke halaman, tetapi ia juga membolehkan anda mengkonfigurasi perkara yang elemen tersebut lakukan.
Apakah yang dilakukan oleh Bubble?
Matlamat utama Bubble adalah untuk membolehkan sesiapa sahaja membuat apl web tanpa perlu menulis kod.
Walau bagaimanapun, walaupun ini menyediakan pernyataan matlamat yang mudah diingati, ia meninggalkan sedikit kisah yang penting. Laluan dari idea ke pasaran adalah lebih rumit daripada hanya mencipta baris kod.
Satu pasukan profesional terlatih yang bekerja pada bahagian tertentu penciptaan, pertumbuhan dan penyelenggaraan apl diperlukan dalam pembangunan konvensional. Pertimbangkan ini.
Apakah yang diperlukan oleh setiap aplikasi?
- Keselamatan untuk memastikan tiada sesiapa yang mempunyai akses tanpa kebenaran kepada data.
- Pangkalan data untuk menyimpan dan mendapatkan semula maklumat seperti item, artikel dan kemas kini media sosial.
- Kebolehskalaan untuk membolehkan pembangunan tanpa halangan pangkalan pengguna dan volum data.
- Antara muka pengguna yang menyenangkan untuk menjadikan apl itu menarik dan mudah digunakan.
- Integrasi dengan pelbagai perkhidmatan dan sistem.
Bubble menggantikan jauh lebih banyak daripada pengekod. Ia menyediakan semua perkhidmatan ini dalam cara yang menarik secara visual dan sangat automatik, menjadikannya boleh difikirkan, jika tidak mudah, untuk seorang sahaja mengendalikan segala-galanya.
Manakala platform tanpa kod sebelum ini telah cuba menggantikan pengekodan dalam pelbagai cara. Konsepnya adalah untuk mengalih keluar sebanyak mungkin halangan untuk apl mencapai pasaran, mengendalikan segala-galanya daripada reka bentuk responsif dan animasi kepada pengehosan, penggunaan versi, keselamatan dan operasi pangkalan data.
Menggunakan penyambung API untuk menyambungkan Bubble ke perkhidmatan lain
Penyambung APInya berkemungkinan pemalam paling penting di pasaran. Seperti namanya, ini membolehkan anda menyambung ke apl dan perkhidmatan lain untuk berkongsi tindakan dan data.
Daripada menyelidiki spesifik teknikal tentang cara ini berfungsi, pertimbangkan contoh ini tentang perkara yang mungkin dicapai oleh API:
- Mendapatkan akses kepada pembelajaran mesin kaedah seperti pengecaman imej dan terjemahan.
- Dapatkan maklumat cuaca terkini dari mana-mana sahaja di bumi.
- Apabila acara dicetuskan dalam Bubble, maklumat ditukar merentas sistem, seperti mewujudkan petunjuk dalam CRM anda atau janji temu dalam Kalendar Google anda.
- Tempah penerbangan atau penginapan hotel di mana-mana sahaja di dunia.
- Dapatkan nombor telefon, lokasi, gambar, logo dan ulasan untuk mana-mana syarikat di Peta Google.
Menggunakan pemalam untuk meningkatkan ciri asli
Secara teknikal, ia mencampurkan modul kod JavaScript, CSS dan HTML ke dalam nod berfungsi. Aplikasi yang ditulis dalam JS.JSON berfungsi sebagai asas untuk bahasanya sendiri.
Walaupun anda tidak perlu memahami sepenuhnya istilah tersebut untuk membina apl, ia menunjukkan satu fakta penting: ia mematuhi piawaian web yang diketahui dan diakui, membolehkan pembangun meningkatkan fungsi asalnya dengan ketara.
Ini sudah dilihat di tapak pemalam, di mana beratus-ratus sambungan percuma dan berbayar kepada fungsi asas tersedia. Ini juga membayangkan bahawa jika anda mencapai tahap keupayaan asasnya tidak mencukupi, terdapat ramai pakar JavaScript yang bersedia untuk menyediakan penyelesaian yang dipesan lebih dahulu untuk anda.
Apakah jenis apl yang boleh anda bangunkan?
Anda boleh membuat pelbagai aplikasi, beberapa daripadanya diberikan di bawah.
- Apl untuk pasaran khusus dengan komuniti.
- Apl untuk papan kerja dalam pelbagai sektor.
- Perisian untuk kakitangan hospital.
- Perisian tempat jualan untuk kedai fizikal.
- Perisian pejabat pergigian dengan label putih.
- Inventori perniagaan peribadi dan perisian perkhidmatan pelanggan.
- Aplikasi pengagregatan hartanah yang dihadapi oleh broker dan pelanggan.
- Apl untuk acara dan kursus di pasaran (dan juga bot).
- Sijil profesional memerlukan aplikasi ujian dalaman.
- Permohonan untuk responden pertama.
- Perisian pengurusan pekerja untuk kegunaan dalaman.
Sejujurnya, platform ini tidak direka untuk melakukan segala-galanya. Ini mungkin bukan pilihan yang ideal jika anda mereka bentuk apl permainan dengan visual dan gerakan yang kompleks. Selain itu, jika anda mencipta apl asli (satu untuk kedai aplikasi), anda perlu menyepadukannya dengan perkhidmatan pihak ketiga yang lain.
Ciri-ciri utama
Bubble penuh dengan ciri-ciri. Kami tidak akan dapat merangkumi kesemuanya di sini, tetapi kami akan cuba membincangkan yang paling penting.
1. Plugin
Ia membolehkan anda memasukkan fungsi daripada pelbagai alatan di Internet ke dalam anda aplikasi web. Sebagai contoh, jika anda mahu pengguna anda log masuk menggunakan akaun Facebook mereka, anda boleh menggunakan pemalam Facebook untuk melakukan ini.
2. Membangunkan
Ia membolehkan anda membina apl dinamik, berbilang pengguna untuk pelayar web desktop dan mudah alih, serta semua alatan yang diperlukan untuk membina tapak yang serupa dengan Instagram atau Airbnb.
3. Reka bentuk
Anda boleh membuat reka letak mesra mudah alih dan kandungan dinamik untuk memberikan sentuhan akhir kepada produk yang anda akan gembira untuk pamerkan kepada orang lain.
4. hosting
Tidak perlu risau tentang penyelenggaraan pelayan, infrastruktur atau operasi berulang kali.
Ia menjaga penempatan dan pengehosan untuk anda dengan cara yang selamat dan terjamin. Bilangan pengguna, volum trafik dan storan data semuanya tidak terhad.
Membina apl dengan Bubble (Tutorial)
Sekarang mari kita mula bertindak dan meneroka cara anda boleh membina apl berita di Bubble.
1. Bermula
Untuk memulakan, anda mesti terlebih dahulu daftar untuk akaun percuma di Bubble.
Kami akan mulakan dengan menggunakan alat reka bentuk visual Bubble untuk membentuk platform kami antara muka pengguna. Beberapa halaman utama untuk disertakan diberikan di bawah:
- Halaman muat naik – Laman web tempat penerbit akan membangunkan dan mengedarkan artikel.
- Halaman utama – Senarai cerita yang diterbitkan baru-baru ini dipaparkan.
- Halaman naratif - Halaman di mana setiap cerita unik boleh ditemui.
- Halaman penerbit- Halaman untuk memaparkan senarai cerita daripada penerbit tertentu.
2. Mengkonfigurasi pangkalan data
Selepas anda membentangkan paparan produk anda, anda boleh menumpukan pada membina medan data yang akan memacu aplikasi anda. Kami akan menggunakan medan ini untuk memautkan aliran kerja yang mendasari produk anda.
Untuk contoh ini, kami akan mewujudkan dua jenis data yang berbeza untuk setiap berita. Satu jenis data akan mengandungi fakta asas cerita (seperti tajuk, gambar yang ditampilkan dan penerbit), manakala jenis data yang lain akan mengandungi fail kandungan yang lebih besar seperti keseluruhan naratif itu sendiri.
Dengan mentakrifkannya sebagai jenis data diskret, kami hanya boleh memuatkan maklumat yang diperlukan apabila ia diperlukan, mengehadkan jumlah bahan yang perlu dihasilkan oleh editor Bubble.
Jenis data dan medan berikut akan dibuat:
Jenis data: pengguna
Bidang:
- Nama
- Penerbit berikut ialah senarai penerbit. Nota penting: Mencipta medan sebagai senarai berdasarkan jenis data yang berbeza membolehkan anda menggabungkan semua medan data pentingnya dengan mudah tanpa perlu membuat medan tambahan.
Jenis data: cerita
Bidang:
- Title
- Imej yang dipilih
- Penulis
- kategori
- Penerbit
- Kandungan cerita
Jenis data: Kandungan cerita
Bidang:
- Kandungan cerita
Jenis data: Penerbit
Bidang:
- Nama
- logo
- Pengikut
3. Membina aliran kerja
Memandangkan anda telah menyusun reka bentuk dan pangkalan data aplikasi anda, tiba masanya untuk mula menyusun segala-galanya dan menjadikannya berfungsi.
Aliran kerja ialah kaedah utama untuk mencapai ini dalam Bubble.
Setiap aliran kerja berlaku apabila peristiwa berlaku (cth, pengguna mengklik butang) dan kemudian melakukan urutan "tindakan" sebagai tindak balas (cth, "mendaftar pengguna," "membuat perubahan pada pangkalan data," dan sebagainya) .
4. Mencipta berita
Ciri pertama yang kami tawarkan ialah alat yang membolehkan penerbit menulis dan menyiarkan berita ke tapak.
Pada halaman muat naik, kami akan mulakan dengan memasukkan banyak item input yang akan digunakan untuk memasukkan data ke dalam pangkalan data kami. Input teks, pemuat naik gambar dan pilihan lungsur turun adalah contoh medan ini.
Kami juga perlu menyesuaikan menu lungsur turun penerbit untuk memaparkan senarai pilihan dinamik. Memandangkan setiap artikel baharu akan ditambahkan pada senarai jumlah artikel penerbit, kami perlu memilih penerbit sedia ada daripada pangkalan data kami.
Apabila menetapkan menu lungsur turun ini, kami akan memilih jenis pilihan untuk menjadi penerbit.
Selepas itu, sumber data kami akan mengimbas pangkalan data kami dan mengembalikan senarai semua penerbitan semasa. Akhir sekali, kami akan menukar kapsyen sumber untuk memasukkan nama penerbit.
Sebaik sahaja seorang penulis telah memasukkan maklumat yang diperlukan ke dalam setiap entri pada halaman, mereka akan mengklik butang terbitkan untuk menghasilkan kisah baharu.
Kemudian, dalam pangkalan data anda, anda akan mencipta perkara baharu dengan jenis data yang ditetapkan kepada naratif.
Kemudian kami perlu mula mengisi pangkalan data kami dengan medan yang diperlukan. Sambungkan setiap komponen input pada halaman ke lajur pangkalan data masing-masing.
Mula-mula, kami akan mencipta jenis kandungan cerita, yang akhirnya akan dikaitkan dengan kisah itu sendiri.
Seterusnya, kami akan menambah satu lagi peringkat pada prosedur ini, menjana sesuatu yang lain – kali ini, kisah itu sendiri.
Anda boleh menyepadukan data ini dengan mudah di seluruh platform anda dengan menyepadukan bahan naratif pertama yang kami bangunkan dengan kisah ini.
Kisah baharu akan dihasilkan setiap kali prosedur ini diaktifkan.
5. Memaparkan kandungan dinamik dalam suapan
Sebaik sahaja penerbit mula memuat naik bahan ke apl mudah alih anda, kami perlu mula mencipta logik pada halaman utama anda yang menunjukkan setiap artikel sebagai senarai dinamik. Ini boleh dicapai dengan menggunakan elemen kumpulan berulang kami.
Kumpulan berulang bekerja dengan pangkalan data anda untuk membentangkan dan memuat semula senarai bahan dinamik.
Apabila menggunakan kumpulan berulang, anda mesti memautkan elemen terlebih dahulu kepada jenis data dalam pangkalan data anda.
Dalam kes ini, anda akan mengkategorikan jenis bahan sebagai cerita. Anda juga perlu menyediakan sumber data sebagai senarai semua jadual dalam pangkalan data anda.
Kami juga akan mengatur kumpulan berulang ini mengikut tarikh mula setiap cerita, menunjukkan senarai dalam susunan kronologi terbalik. Anda kini boleh mula mengatur bahan dinamik yang akan muncul dalam setiap grid.
Hanya isikan baris atas dengan bahan yang sesuai yang anda mahu paparkan, dan elemen berkuasa ini akan mengisi lajur yang tinggal dengan data daripada pangkalan data semasa anda.
6. Menghantar data antara halaman
Ia juga mungkin untuk membina acara dalam setiap baris kumpulan berulang. Apabila membangunkan ciri navigasi untuk platform anda, fungsi ini akan berguna.
Halaman utama apl berita kami hanya menunjukkan pratonton setiap cerita, termasuk penerbit, imej yang ditampilkan dan tajuk cerita.
Walau bagaimanapun, ia tidak memaparkan keseluruhan kandungan artikel sehingga pengguna mengklik ke halaman cerita. Kami akan menggunakan editor aliran kerja kami untuk menghantar data antara halaman untuk memaparkan bahan ini.
Untuk memulakan, buat proses yang menghantar pengguna ke halaman cerita apabila gambar cerita diklik.
Gunakan acara navigasi untuk memindahkan pengguna ke halaman lain semasa membangunkan proses ini.
Pilih jenis halaman destinasi untuk menjadi halaman naratif daripada menu lungsur. Anda kemudiannya perlu memberikan maklumat lanjut ke halaman ini supaya editor Bubble memahami kisah unik yang ingin ditunjukkan.
Maklumat yang anda perlu berikan datang daripada kisah sel semasa.
7. Memaparkan kandungan dinamik pada halaman cerita
Anda boleh mendapatkan semula data acara ini dengan mudah dan menunjukkan bahan yang berkaitan daripada naratif apabila pengguna dihantar ke halaman cerita tertentu.
Untuk mencipta fungsi ini, anda mesti terlebih dahulu menyemak sama ada jenis halaman sasaran sepadan dengan sifat data yang anda hantar melalui aliran kerja. Dalam situasi ini, anda mesti mengaitkan halaman cerita dengan sifat cerita.
Ia hanya boleh menarik dan menyampaikan data yang sesuai daripada sumber sedia ada dengan mengkategorikan jenis kandungan pada halaman.
Anda kini boleh mula memasukkan bahan dinamik ke dalam medan yang memaparkan maklumat daripada satu jadual.
8. Memaparkan artikel penerbit
Selepas membaca item berita, pengguna boleh memilih untuk memeriksa keseluruhan katalog artikel penerbit. Jika anda telah membangunkan jenis data penerbit, membuat halaman berasingan untuk penerbit adalah semudah membuat halaman utama asal kami.
Pada halaman ini, kita perlu bermula dengan menetapkan jenis halaman kepada penerbit.
Kemudian, salin kumpulan berulang dari halaman utama dan edit tetapan.
Dalam kes ini, sumber data kumpulan berulang kami akan mencari semua artikel sedia ada yang penerbitnya ialah penerbit halaman semasa.
9. Mengikuti penerbit
Ciri asas ketiga yang akan kami bina untuk MVP kami ialah keupayaan untuk mengikuti penerbit di platform. Kami akan menambah butang ikuti pada halaman penerbit. Apabila kami mengklik ikon ini, kami akan melancarkan proses baharu yang mengubah suai sesuatu.
Menambah penerbit halaman semasa pada senarai penerbitan berikut akan mengubah pengguna semasa.
Selepas itu, kami perlu mengemas kini senarai pengikut penerbit halaman semasa dengan menambahkan pengguna semasa.
10. Ciri tambahan yang anda boleh tambah
Kini setelah anda selesa dengan membina medan data tersuai dan menyampaikan maklumat dinamik, anda boleh menjadi kreatif dengan pengalaman yang anda cipta untuk produk anda. Anda juga boleh memasukkan:
- Cipta ciri yang membolehkan pengguna menyimpan kandungan untuk bacaan kemudian.
- Di bahagian bawah setiap bahagian, sediakan koleksi berulang artikel yang dicadangkan.
- Cipta alat carian untuk membantu orang mencari kandungan baharu di tapak.
11. Hasilnya
Apl akhir anda akan kelihatan seperti ini.
Kelebihan
- Keupayaan untuk menyambung kepada banyak API dan pemalam.
- Aplikasi tanpa kod yang mudah digunakan.
- Orang yang tidak mempunyai pengalaman pengaturcaraan akan mendapat manfaat daripada ini.
- Alat reka bentuk yang serba boleh dan berkuasa.
- Pemprosesan pertanyaan pantas.
Kekurangan
- Peningkatan kebolehpercayaan.
- Kelajuan pemprosesan data adalah perlahan.
- Prestasi dikekang.
Harga
Pelan percuma membolehkan anda mempelajari tentang platform dan membangunkan aplikasi anda.
Langganan berbayar termasuk tambahan seperti pelabelan putih, domain tersuai, akses kepada API Buih dan kapasiti pelayan tersimpan, yang disenaraikan di bawah.
- Peribadi – $25/bulan (dibayar setiap tahun) atau $29/bulan (dibayar setiap bulan).
- Profesional – $115/bulan (dibayar setiap tahun) atau $129/bulan (dibayar setiap bulan).
- Pengeluaran - $475/bulan (dibayar setiap tahun) atau $529/bulan (dibayar setiap bulan).
Bermula dengan Bubble secara Percuma
Kesimpulan
Bubble ialah alternatif yang sangat baik untuk membina aplikasi web yang hanya boleh menunjukkan maklumat atau mempunyai UI yang minimum.
Ia agak mudah untuk digunakan, dan tutorial yang disediakan oleh Bubble sangat membantu. Editor visual dalam taliannya yang membolehkan anda mereka bentuk aplikasi web berdasarkan pilihan anda.
Dan bahagian yang terbaik ialah anda tidak memerlukan pengalaman atau kepakaran pengaturcaraan. Bubble sesuai untuk semua orang, tidak kira sama ada anda tahu cara mengekod atau tidak.
Walau bagaimanapun, pemahaman awal tentang bahasa bahagian hadapan boleh memberi anda kelebihan kerana ia membolehkan anda mengetahui dengan cepat perkara yang dilakukannya berkenaan pengendalian acara.
Jadi, apakah pendapat anda tentang keupayaan Bubble?
Marilah kita tahu dalam komen!
Arbehi
Bolehkah kedai dicipta untuk menjual produk menggunakan alat bubble.io?