Pregled sadržaja[Sakriti][Pokazati]
- Što je Bubble.io?
- Što je vizualno programiranje?
- Koje vrste aplikacija možete razviti?
Izrada aplikacije s Bubbleom (Tutorial)+-
- 1. Početak rada
- 2. Konfiguriranje baze podataka
- 3. Izgradnja tijekova rada
- 4. Izrada vijesti
- 5. Prikaz dinamičkog sadržaja u feedu
- 6. Slanje podataka između stranica
- 7. Prikaz dinamičkog sadržaja na stranici priče
- 8. Prikaz članka izdavača
- 9. Sljedeći izdavači
- 10. Dodatne značajke koje možete dodati
- 11. Rezultat
- Prozodija
- Cons
- Cijene
- Zaključak
Nedavno su me zanimali pristupi razvoju weba osim HTML-a, CSS-a i JavaScripta.
Uz rastući krajolik bez koda, nije bilo iznenađujuće otkriti da postoji nekoliko alternativa standardnijim pristupima za razvoj web aplikacija.
Sigurno ste upoznati s nekim od poznatijih CMS platformi, kao što je WordPress, koje su uglavnom bez koda. Ali, ako želite izraditi web aplikacije, takve platforme mogu se činiti restriktivnim.
Ovdje vam predstavljam Bubble.io, moćan alat bez koda koji vam omogućuje izradu web-aplikacija kao nikad prije.
Istražimo ga u dubini!
Što je Bubble.io?
Bubble je netehnička platforma koja kombinira vizualni programski jezik i a okvir za razvoj weba.
Korisnici mogu koristiti ove programske alate za izradu jedinstvenih online aplikacija, mijenjanje baza podataka i procesa, dodavanje komponenti stranica (slike, tekst, forme za unos, karte) i dizajn njihovih sučelja.
To je tržište na kojem možete otkriti idealne predloške, dodatke i usluge koji će vam pomoći u izgradnji snažnih proizvoda.
Bez potrebe za postavljanjem tipičnog okvira za programiranje, pomoću Bubble-a možete stvoriti bilo što, od tržišta preko društvene mreže do CRM-a (Upravljanje odnosima s klijentima).
Korisnicima daje mogućnost da kreiraju i personaliziraju svoje aplikacije pomoću korisničkog sučelja i uređivača pokaži i klikni.
Možete ga koristiti zajedno s uslugama koje pružaju REST API, kao što su Facebook, SQL, analitika i aplikacije za plaćanje. Omogućuje korisnicima da posvete vrijeme poboljšanju funkcionalnosti i izgleda svojih aplikacija kako bi izgledale dobro na tabletima i mobilnim uređajima.
Prikladan je za sve poslovne veličine, od malih do srednjih do velikih; i dostupan za Windows, Mac i web.
Što je vizualno programiranje?
Vizualno programiranje u biti je ono što zvuči. Umjesto ručnog programiranja pisanjem koda, to radite grafički klikom i povlačenjem komponenti na stranice.
Neka vas taj kratki opis ne zavara.
Nije poput bilo koje druge aplikacije za rezanje kolačića ili alata za izradu web stranica na koje ste naišli na internetu. Većina graditelja aplikacija zahtijeva od vas da se oslanjate na osnovne predloške i da imaju izrazito ograničenu funkcionalnost; oni vam samo omogućuju razvoj određenih vrsta aplikacija i ograničavaju vašu personalizaciju.
Iako se pojam "vizualnog programiranja" i "povlačenja i ispuštanja" čini lakim u Bubbleu, on je iznimno moćan.
Njegovo vizualno programsko okruženje ne samo da vam omogućuje povlačenje objekata poput teksta, grafike, unosa i više na stranicu, već vam također omogućuje da konfigurirate što ti elementi rade.
Što Bubble radi?
Primarni cilj Bubble-a je omogućiti bilo kome stvaranje web-aplikacija bez potrebe za pisanjem koda.
Međutim, iako ovo omogućuje lako pamtljivu izjavu o golu, izostavlja značajan dio priče. Put od ideje do tržišta je složeniji od pukog kreiranja redaka koda.
U konvencionalnom razvoju potreban je tim visoko obučenih stručnjaka koji rade na određenim dijelovima izrade, rasta i održavanja aplikacije. Razmotrite ovo.
Što svaka aplikacija zahtijeva?
- Sigurnost kako bi se osiguralo da nitko nema neovlašten pristup podacima.
- Baza podataka za pohranjivanje i dohvaćanje informacija kao što su stavke, članci i ažuriranja društvenih medija.
- Skalabilnost kako bi se omogućio nesmetan razvoj baze korisnika i količine podataka.
- Ugodno korisničko sučelje koje aplikaciju čini privlačnom i jednostavnom za korištenje.
- Integracija s raznim servisima i sustavima.
Bubble zamjenjuje mnogo više od kodera. Pruža sve ove usluge na vizualno privlačan i vrlo automatiziran način, što ga čini zamislivim, ako ne i jednostavnim, da jedna osoba može sve rješavati.
Dok su prethodne platforme bez kodiranja pokušavale zamijeniti kodiranje na razne načine. Njegov je koncept ukloniti što više prepreka da aplikacija dođe na tržište, rukovanje svime, od responzivnog dizajna i animacija do hostinga, implementacije verzije, sigurnosti i operacija baze podataka.
Upotreba API konektora za povezivanje Bubblea s drugim uslugama
Njegov API konektor vjerojatno je najvažniji dodatak na tržištu. Kao što naziv implicira, to vam omogućuje povezivanje s drugim aplikacijama i uslugama za dijeljenje radnji i podataka.
Umjesto da ulazite u tehničke specifičnosti kako to funkcionira, razmotrite ove primjere onoga što bi API-ji mogli postići:
- Dobivanje pristupa stroj za učenje metode kao što su prepoznavanje i prijevod slike.
- Dobijte najnovije informacije o vremenu s bilo kojeg mjesta na zemlji.
- Kada se događaj pokrene u Bubbleu, informacije se razmjenjuju između sustava, kao što je uspostavljanje potencijalnog klijenta u vašem CRM-u ili sastanak u vašem Google kalendaru.
- Rezervirajte let ili hotelski boravak bilo gdje u svijetu.
- Dobijte telefonski broj, lokaciju, fotografije, logotip i recenzije za bilo koju tvrtku na Google kartama.
Korištenje dodataka za poboljšanje izvornih značajki
Tehnički, miješa module JavaScript koda, CSS i HTML u funkcionalni čvor. Aplikacija napisana u JS.JSON služi kao temelj za vlastiti jezik.
Iako ne morate u potpunosti razumjeti tu terminologiju da biste izradili aplikacije, one ukazuju na jednu ključnu činjenicu: pridržava se poznatih i priznatih web standarda, omogućujući razvojnim programerima da značajno poboljšaju svoju izvornu funkcionalnost.
To se već vidi na stranici dodataka, gdje su dostupne stotine besplatnih i plaćenih proširenja osnovne funkcionalnosti. To također implicira da ako dođete do točke kada su njegove temeljne mogućnosti nedostatne, postoji mnogo stručnjaka za JavaScript koji su spremni za vas pripremiti rješenje po mjeri.
Koje vrste aplikacija možete razviti?
Možete stvoriti širok raspon aplikacija, od kojih su neke navedene u nastavku.
- Aplikacije za specijalizirana tržišta sa zajednicom.
- Aplikacije za oglasne ploče u raznim sektorima.
- Softver za bolničko osoblje.
- Softver na prodajnom mjestu za fizičke trgovine.
- Softver dentalne ordinacije s bijelom naljepnicom.
- Osobni poslovni inventar i softver za korisničku podršku.
- Aplikacije za agregiranje nekretnina okrenute brokerima i klijentima.
- Aplikacije za događaje i tečajeve na tržištu (pa čak i brodove).
- Profesionalni certifikati zahtijevaju interno testiranje.
- Prijave za prve odgovore.
- Softver za upravljanje zaposlenicima za internu upotrebu.
Da budem iskren, platforma nije dizajnirana da radi sve. Možda nije idealan izbor ako dizajnirate aplikaciju za igru sa složenim vizualima i pokretom. Osim toga, ako izrađujete nativnu aplikaciju (onu za trgovine aplikacija), morat ćete je integrirati s drugom uslugom treće strane.
Ključne značajke
Bubble je prepun značajki. Ovdje ih nećemo moći sve pokriti, ali ćemo pokušati pokriti one najbitnije.
1. Dodaci
Omogućuje vam da u svoj program uključite funkcionalnost iz brojnih alata na Internetu web aplikacija. Na primjer, ako želite da se vaši korisnici prijave koristeći svoj Facebook račun, možete koristiti Facebook dodatak za to.
2. Razviti
Omogućuje vam izradu dinamičnih, višekorisničkih aplikacija za stolne i mobilne web-preglednike, kao i sve alate potrebne za izgradnju stranice slične Instagramu ili Airbnbu.
3. dizajn
Možete stvoriti izglede prilagođene mobilnim uređajima i dinamičan sadržaj kako biste dali završnu obradu proizvodu koji ćete rado pokazati drugima.
4. Hosting
Nikada iznova ne morate biti zabrinuti za održavanje poslužitelja, infrastrukturu ili operacije.
On se brine o implementaciji i hostingu umjesto vas na siguran i siguran način. Broj korisnika, promet i pohrana podataka su neograničeni.
Izrada aplikacije s Bubbleom (Tutorial)
Krenimo sada u akciju i istražimo kako možete izraditi aplikaciju za vijesti na Bubbleu.
1. Početak rada
Da biste započeli, prvo morate registrirajte se za besplatni račun na Bubbleu.
Počet ćemo korištenjem Bubbleovog alata za vizualni dizajn za oblikovanje naše platforme korisničko sučelje. Neke od ključnih stranica koje treba uključiti navedene su u nastavku:
- Stranica za učitavanje – web-mjesto na kojem će izdavači razvijati i distribuirati članke.
- Početna stranica – prikazuje se popis nedavno objavljenih priča.
- Narativna stranica – Stranica na kojoj se može pronaći svaka jedinstvena priča.
- Stranica izdavača - Stranica na kojoj se prikazuje popis priča određenog izdavača.
2. Konfiguriranje baze podataka
Nakon što ste postavili zaslon svog proizvoda, možete se usredotočiti na izgradnju podatkovnih polja koja će potaknuti vašu aplikaciju. Koristit ćemo ova polja za povezivanje tijekova rada koji su u osnovi vašeg proizvoda.
Za ovaj primjer uspostavit ćemo dvije različite vrste podataka za svaku vijest. Jedna vrsta podataka sadržavat će osnovne činjenice priče (kao što su naslov, istaknuta slika i izdavač), dok će druga vrsta podataka sadržavati veće datoteke sadržaja kao što je cijela pripovijest.
Definirajući ih kao diskretne tipove podataka, možemo učitati informacije koje su potrebne samo kada su potrebne, ograničavajući količinu materijala koju će uređivač Bubble morati proizvesti.
Izradit će se sljedeće vrste podataka i polja:
Vrsta podataka: korisnik
polja:
- Ime i Prezime
- Sljedeći izdavači su popis izdavača. Važna napomena: Stvaranje polja kao popisa na temelju različite vrste podataka omogućuje vam da bez napora uključite sva njegova bitna podatkovna polja bez potrebe za stvaranjem dodatnih polja.
Vrsta podataka: Priča
polja:
- Označite
- Istaknuta slika
- Pisac
- Kategorija
- Publisher
- Sadržaj priče
Vrsta podataka: Sadržaj priče
polja:
- Sadržaj priče
Vrsta podataka: Publisher
polja:
- Ime i Prezime
- logo
- Sljedbenici
3. Izgradnja tijekova rada
Sada kada ste organizirali dizajn svoje aplikacije i bazu podataka, vrijeme je da počnete sastavljati sve i raditi na tome.
Radni tokovi su primarna metoda za postizanje toga u Bubbleu.
Svaki tijek rada događa se kada se dogodi neki događaj (npr. korisnik klikne gumb), a zatim izvrši slijed "radnji" kao odgovor (npr. "prijava korisnika", "izmjena baze podataka" itd.) .
4. Izrada vijesti
Prva značajka koju ćemo ponuditi je alat koji izdavačima omogućuje pisanje i objavljivanje vijesti na web-mjestu.
Na stranici za učitavanje počet ćemo s ugradnjom puno ulaznih stavki koje će se primijeniti na unos podataka u našu bazu podataka. Unosi teksta, program za učitavanje slike i padajući odabir primjeri su ovih polja.
Također ćemo morati prilagoditi padajući izbornik izdavača za prikaz popisa dinamičkih opcija. Budući da će se svaki novi članak dodati na izdavačev popis ukupnih članaka, morat ćemo odabrati postojećeg izdavača iz naše baze podataka.
Prilikom postavljanja ovog padajućeg izbornika, odabrat ćemo vrstu opcija za izdavača.
Nakon toga, naš izvor podataka će skenirati našu bazu podataka i vratiti popis svih aktualnih publikacija. Konačno, promijenit ćemo naslov izvora tako da uključuje naziv izdavača.
Nakon što pisac unese potrebne podatke u svaki unos na stranici, kliknut će gumb za objavljivanje kako bi generirao novu priču.
Zatim, unutar svoje baze podataka, stvorit ćete novu stvar s tipom podataka postavljenom na narative.
Zatim ćemo morati početi popunjavati našu bazu podataka potrebnim poljima. Povežite svaku od ulaznih komponenti na stranici s njihovim odgovarajućim stupcima baze podataka.
Prvo ćemo kreirati tip sadržaja priče, koji će konačno biti povezan sa samom pričom.
Zatim ćemo ovom postupku dodati još jednu fazu, generirajući nešto drugo – ovaj put, samu priču.
Moguće je integrirati ove podatke bez napora u vašu platformu integracijom prvog narativnog materijala koji smo razvili s ovom pričom.
Svaki put kada se ovaj postupak aktivira, bit će proizvedena nova priča.
5. Prikaz dinamičkog sadržaja u feedu
Nakon što izdavači počnu prenositi materijal u vašu mobilnu aplikaciju, morat ćemo početi stvarati logiku na vašoj početnoj stranici koja svaki članak prikazuje kao dinamički popis. To se može postići korištenjem našeg ponavljajućeg elementa grupe.
Grupe koje se ponavljaju rade s vašom bazom podataka kako bi predstavile i osvježile popis dinamičkog materijala.
Prilikom primjene ponavljajuće grupe, prvo morate povezati element s vrstom podataka u vašoj bazi podataka.
U ovom ćete slučaju vrstu materijala kategorizirati kao priče. Također ćete morati navesti izvor podataka kao popis svih tablica u vašoj bazi podataka.
Također ćemo organizirati ovu ponavljajuću grupu prema datumu početka svake priče, prikazujući popis obrnutim kronološkim redoslijedom. Sada možete početi organizirati dinamički materijal koji će se pojaviti unutar svake mreže.
Jednostavno ispunite gornji red odgovarajućim materijalom koji želite prikazati, a ovaj moćni element popunit će preostale stupce podacima iz vaše trenutne baze podataka.
6. Slanje podataka između stranica
Također je moguće konstruirati događaje unutar svakog reda grupe koja se ponavlja. Prilikom razvoja navigacijskih značajki za vašu platformu, ova će vam funkcionalnost dobro doći.
Početna stranica naše aplikacije za vijesti samo prikazuje pregled svake priče, uključujući izdavača, istaknutu sliku i naslov priče.
Međutim, ne prikazuje cijeli sadržaj članka dok korisnik ne klikne na stranicu s pričom. Koristit ćemo naš uređivač tijeka rada za prijenos podataka između stranica za prikaz ovog materijala.
Za početak stvorite proces koji korisnika šalje na stranicu priče kada se klikne na sliku priče.
Koristite navigacijski događaj za prijenos korisnika na drugu stranicu tijekom razvoja ovog procesa.
Odaberite vrstu odredišne stranice koja će biti stranica naracije s padajućeg izbornika. Zatim ćete ovoj stranici morati dati dodatne informacije kako bi uređivač mjehurića razumio koju jedinstvenu priču prikazati.
Informacije koje ćete morati dati dolaze iz trenutne priče o ćelijama.
7. Prikaz dinamičkog sadržaja na stranici priče
Možete jednostavno dohvatiti podatke o ovom događaju i prikazati relevantan materijal iz priče kada se korisnik pošalje na stranicu određene priče.
Da biste stvorili ovu funkciju, prvo morate provjeriti odgovara li tip ciljne stranice svojstvu podataka koje isporučujete kroz tijek rada. U ovoj situaciji morate stranicu priče povezati sa svojstvom priče.
Može jednostavno povući i dostaviti odgovarajuće podatke iz postojećih izvora kategoriziranjem vrste sadržaja na stranici.
Sada možete početi umetati dinamički materijal u polja koja prikazuju informacije iz jedne tablice.
8. Prikaz članka izdavača
Nakon čitanja vijesti, korisnik može odabrati da pregleda cijeli katalog članaka izdavača. Ako ste razvili vrstu podataka izdavača, stvaranje zasebne stranice za izdavače jednostavno je kao i stvaranje naše izvorne početne stranice.
Na ovoj stranici morat ćemo započeti postavljanjem vrste stranice na izdavača.
Zatim kopirajte grupu koja se ponavlja s početne stranice i uredite postavke.
U ovom slučaju, izvor podataka naše ponavljajuće grupe tražit će sve postojeće članke čiji je izdavač trenutni izdavač stranice.
9. Sljedeći izdavači
Treća temeljna značajka koju ćemo izgraditi za naš MVP je mogućnost praćenja izdavača na platformi. Dodat ćemo gumb za praćenje na stranicu izdavača. Kada kliknemo ovu ikonu, pokrenut ćemo novi proces koji mijenja stvar.
Dodavanje trenutačnog izdavača stranice na njegov popis sljedećih publikacija promijenit će trenutačnog korisnika.
Nakon toga, morat ćemo ažurirati popis sljedbenika izdavača trenutne stranice dodavanjem trenutačnog korisnika.
10. Dodatne značajke koje možete dodati
Sada kada ste zadovoljni izgradnjom prilagođenih podatkovnih polja i predstavljanjem dinamičkih informacija, možete postati kreativni s iskustvima koja stvarate za svoj proizvod. Također možete uključiti:
- Izradite značajku koja korisnicima omogućuje spremanje sadržaja za kasnije čitanje.
- Na dnu svakog dijela navedite ponavljajuću zbirku predloženih članaka.
- Izradite alat za pretraživanje kako biste pomogli ljudima da pronađu svježi sadržaj na web mjestu.
11. Rezultat
Vaša konačna aplikacija izgledat će otprilike ovako.
Prozodija
- Mogućnost povezivanja s mnogim API-jima i dodacima.
- Jednostavna aplikacija bez koda.
- Ljudi bez iskustva u programiranju će imati koristi od ovoga.
- Alati za dizajn koji su svestrani i moćni.
- Brza obrada upita.
Cons
- Povećana pouzdanost.
- Brzina obrade podataka je spora.
- Izvedba je ograničena.
Cijene
Besplatni plan omogućuje vam da saznate više o platformi i razvijete svoju aplikaciju.
Plaćene pretplate uključuju dodatke poput bijele oznake, prilagođenu domenu, pristup Bubble API-ju i rezervirani kapacitet poslužitelja, koji su navedeni u nastavku.
- Osobno – 25 USD mjesečno (plaća se godišnje) ili 29 USD mjesečno (plaća se mjesečno).
- Profesionalni – 115 USD mjesečno (plaća se godišnje) ili 129 USD mjesečno (plaća se mjesečno).
- Proizvodnja – 475 USD/mjesečno (plaća se godišnje) ili 529 USD/mjesečno (plaća se mjesečno).
Započnite s Bubbleom besplatno
Zaključak
Bubble je izvrsna alternativa za izradu web aplikacija koje mogu prikazivati samo informacije ili imaju minimalno korisničko sučelje.
Prilično je jednostavan za korištenje, a tutoriali koje nudi Bubble od velike su pomoći. Njegov mrežni vizualni uređivač koji vam omogućuje dizajniranje web aplikacija na temelju vaših preferencija.
A najbolji dio je da vam ne treba nikakvo programsko iskustvo ili stručnost. Bubble je prikladan za sve, bez obzira znate li kodirati ili ne.
Međutim, prethodno razumijevanje frontend jezika može vam dati prednost jer vam omogućuje da brzo shvatite što radi u pogledu rukovanja događajima.
Dakle, što mislite o Bubbleovim mogućnostima?
Javite nam u komentarima!
Arbehi
Može li se napraviti trgovina za prodaju proizvoda pomoću alata bubble.io?