Articles

miten rakentaa ravintola-arvostelusivusto ilman koodia

jos haluat löytää täydellisen ravintolan tai baarin, alustat kuten Yelp, Zagat tai Zomato (Urbanspoon) voivat auttaa sinua valitsemaan tuhansista ruokavaihtoehdoista.

jos olet kiinnostunut rakentamaan oman versiosi ravintola-arvostelusivustosta, kupla on kuitenkin ainoa alusta, jonka tarvitset.

Bubblen kaltaiset koodittomat työkalut mullistavat sen, miten arjen tekijät voivat rakentaa ohjelmistoja. Bubblen tehokas alusta on tehnyt ohjelmistojen rakentamisen aloittamisesta helpompaa kuin koskaan ilman, että on tarvinnut kirjoittaa yhtäkään riviä koodia.

visuaalisen ohjelmointityökalumme avulla on mahdollista suunnitella ja rakentaa nopeasti toimivia ohjelmistoja, jotka ylittävät staattiset kokemukset. Päättäjät käyttävät Bubblea rakentaakseen markkinapaikkoja, hakemistoja ja jopa sosiaalisia verkostoja.

tämä viesti käsittelee vaiheittaista prosessia, jossa rakennetaan kooditonta ravintolakatselmusta Bubblen avulla. Halusitpa kopioida koko tuotteen tai olet vain kiinnostunut hyödyntämään joitakin Alustan keskeisiä ominaisuuksia, tässä oppaassa kerrotaan, miten voit rakentaa tarvittavat työnkulut saadaksesi tuotteesi vauhtiin.

ohjeita koodittoman Yelp-tyylin rakentamiseen ovat:

Aloita

päästäksesi alkuun sinun on rekisteröitävä ilmainen Kuplatilisi.

rekisteröi tilisi kuplassa

Uusi kupla? Seuraa mukana meidän pikakurssi johdanto videoita tutustua perusasiat kupla.

suosittelemme myös täydentämään tutustumistuntejamme, jotka opastavat sinua yleisimpien Kuplaominaisuuksien vaiheittaisessa prosessissa. Tämä auttaa sinua saamaan käyntiin, kun rakennat no-code restaurant review-sovellusta.

suosittelemme myös ymmärtämään, miten käyttäjätilejä luodaan ja muokataan. Olemme aiemmin käsitelleet tätä yksityiskohtaisemmin muissa miten rakentaa oppaita.

kun kickstarting projekti, voit aloittaa wireframe tuotesuunnittelun, tai rakentaa tarvittavat kentät tietokantaan.

tässä oppaassa aloitamme Bubblen visuaalisen suunnittelun työkalulla muokkaamalla tuotteemme käyttöliittymää. Jos kopioit Yelpin tai Zomaton versiota, osa ydinsivuista, jotka haluat sisällyttää ovat:

  • Upload page – a backend portal where you can upload new restaurants
  • Home page – Näytä luettelo ravintoloista ja hakupalkeista
  • hakutulossivu – Näytä luettelo ravintoloista ja kategorioista, kun käyttäjä on hakenut paikan
  • yksittäiset ravintolasivut – sivu, jossa esitetään kaikki tiedot jokaisesta ravintolasta
  • Review submission page – sivu, jossa käyttäjät voivat lähettää ravintola-arvostelun

Bubblen tärkeä ominaisuus on kyky lähettää dataa sivujen välillä. Tämän avulla voit luoda yhden yleisen version sivusta ja sitten dynaamisesti näyttää asiaankuuluvan sisällön tietokannastasi, kun sitä tarvitaan.

kun kyseessä on sivustosi, sinun tarvitsee vain luoda yksi sivu, jolla voit esitellä yksittäisiä ravintoloitasi. Voimme sitten luoda tarvittavat työnkulut, jotta voimme näyttää vain asiaankuuluvan ravintolan kullakin sivulla, kun sitä tarvitaan (käsittelemme tätä yksityiskohtaisemmin pian).

sovelluksen määrittäminen

kun olet kartoittanut tuotteesi näytön, voit keskittyä luomaan tarvittavat tietokentät sovelluksen käynnistämiseksi. Luotamme näihin tietotyyppeihin, kenttiin yhdistääksemme tuotettasi tukevat työnkulut.

Bubblen valmiiksi rakennetun tietokannan avulla on helppo luoda erilaisia tietotyyppejä ainutlaatuisilla kentillä. Kun rakennetaan Yelpin kaltaista ravintolasovellusta MVP: ksi, on luotava seuraavat tietotyypit & kentät:

tietotyyppi: käyttäjä

kentät:

  • nimi
  • Kuva
  • toimitettu arvostelut-lista arvosteluista. Huomautus: kentän luominen erilliseen tietotyyppiin perustuvaksi listaksi mahdollistaa kaikkien asiaankuuluvien tietokenttien saumattoman integroinnin. Tämä säästää sinun tarvitse luoda kaikki lisätiedot kentät
kupla ei koodia yelp klooni opetusohjelma malli

tietotyyppi: ravintola

kentät:

  • nimi
  • kuvaus
  • Kaupunki
  • Logo
  • verkkosivun linkki
  • puhelinnumero
  • Jalkaluokat – lista
  • osoite
  • esillä olevat valokuvat-lista
  • arvostelut-luettelo arvosteluista
Bubble no code yelp clone tutorial template

tietotyyppi: Review

kentät:

  • sisältö
  • ravintola-Ravintola
Bubble no code yelp clone tutorial template

lisäämällä ravintolan alustalle

nyt kun olet määrittänyt tietokannan, voimme alkaa rakentaa työnkulkuja, jotka antavat virtaa sovelluksellesi. Ensimmäinen luomamme ominaisuus ei ole jotain, että käyttäjät suoraan sitoutuvat, vaan on sen sijaan back-end-työkalu uusien ravintoloiden lisäämiseen alustalle.

rakentamalla oman portaalin, jolla voi ladata listauksia tietokantaan, voit tehostaa uusien ravintoloiden lisäämistä hakemistoon.

lataussivullasi voit käyttää syöttökenttien yhdistelmää kartoittaaksesi tarvittavat tiedot jokaisesta uudesta ravintolasta. Kun Luo-painiketta napsautetaan, tämä käynnistää työnkulun, joka lisää tämän kollektiivisen tiedon uutena ravintolana tietokantaasi.

Bubble no code yelp clone tutorial template

kun rakennat työnkulkuasi, meidän on luotava uusi asia, joka määrittää tietotyypin ravintolaksi.

Bubble no code yelp clone tutorial template

tämän jälkeen yhdistät sivulla olevat asiaankuuluvat elementit tietokantasi ravintolatyypin alla oleviin tietokantoihin.

Bubble no code yelp clone tutorial template

dynaamisen sisällön näyttäminen

kun olet ladannut ravintolaluettelon, on aika aloittaa näiden näyttäminen yleisölle suunnatulla sivulla, jota käyttäjät voivat käyttää.

käyttämällä Bubblen toistuvaa ryhmäelementtiä voit näyttää luettelon dynaamisista tiedoista tietokannastasi-kuten olemassa olevista ravintoloistasi.

Huomautus: toistuvat ryhmät on rakennettu oletusarvoisesti pystysuuntaiseen muotoon, mutta elementti on myös mahdollista konfiguroida uudelleen näyttämään vaakasuunnassa.

ennen kuin aloitat sisällön lisäämisen toistoryhmääsi, sinun on linkitettävä Elementti tietokantasi tietotyyppiin. Tämä auttaa sitä tunnistamaan tietyn Sisällön se näyttää.

sisällön tyyppi, joka meidän on näytettävä, on tietenkin tietokannassanne olevat ravintolat.

seuraavaksi täytyy tunnistaa tietolähde, jotta Kuplaeditori tietää, mitkä tietyt ravintolat pitää näyttää. Meidän MVP, näytämme vain listan kaikista nykyiset ravintolat, mutta voit helposti lisätä rajoituksia tähän tietolähteeseen suodattaa ravintoloita niiden kaupungin tai elintarvikkeiden luokat.

Bubble no code yelp clone tutorial template

kun olet määrittänyt toistavan ryhmän oikein, sinun täytyy alkaa lisätä dynaamisia sisältöelementtejä, jotka haluat näyttää jokaisen solun sisällä. Meidän MVP, tämä sisältää ravintolan otsikko ja esillä kuva.

koska ravintolassa voi olla useita esillä olevia kuvia, määritämme dynaamisen sisällön näyttämään yhden näistä kuvista sattumanvaraisesti.

Bubble no code yelp clone tutorial template

tietojen lähettäminen dynaamisille sivuille

kun kotisivuillamme näytetään vain esikatselukortti jokaista ravintolaa varten, käyttäjien tulee klikata jokaiselle ravintolalle oma esittelysivu nähdäksesi sen koko sisällön ja arvostelut. Nämä lisätiedot löytyvät hakemuksesi ravintolasivulta.

toistoryhmästämme on mahdollista luoda tapahtumia, jotka perustuvat kunkin rivin sisällä tehtyihin toimiin. Tästä ominaisuudesta tulee hyödyllinen, kun rakennat navigointiominaisuuksia koko alustallesi.

ohjataksesi käyttäjän kotisivulta tietylle ravintoloiden esittelysivulle, sinun on rakennettava navigointiprosessi, joka käynnistyy, kun ravintoloiden esittelykuvaa napsautetaan.

Bubble no code yelp clone tutorial template

tämän jälkeen sinun on lähetettävä tälle sivulle lisätietoja, joiden avulla Bubble editor voi tunnistaa minkä tietyn ravintolan näyttää. Näytettävät tiedot otetaan nykyisen solun ravintolasta.

Bubble no code yelp clone tutorial template

Näytä dynaaminen sisältö esikatselusivulla

kun tiedot on lähetetty ravintolasivulle, voit helposti vetää tarvittavat tiedot ja näyttää tämän sisällön jokaisesta ravintolasta.

sinun on ensin varmistettava, että kohdesivun tyyppi vastaa työnkulun sisällä lähetettävää dataominaisuutta. Tällöin ravintolasivu konfiguroidaan ravintolakiinteistöksi.

Bubble no code yelp clone tutorial template

luokittelemalla sivun sisältötyypin Bubble voi helposti vetää ja lähettää asiaankuuluvaa tietoa olemassa olevista lähteistä.

voit nyt aloittaa dynaamisen sisällön lisäämisen kenttiin, jotka näyttävät nykyisen sivun ravintolan tietoja.

Bubble no code yelp clone tutorial template

etsivät sisältöä

ottamalla askeleen taaksepäin kotisivuillemme, meidän on myös rakennettava ominaisuus, jonka avulla käyttäjät voivat etsiä ravintoloita kaupungin perusteella. Tämä voidaan saavuttaa lisäämällä tekstinsyöttöelementti, jota käsittelemme hakupalkkina.

Bubble no code yelp clone tutorial template

täältä luomme uuden työnkulun, joka luokittelee käyttäjän hakutermin ja siirtää tämän tiedon erilliselle sivulle, joka on omistettu tälle hakukyselylle (lisää Tällä sivulla pian).

tämän työnkulun käynnistämiseksi luomme tapahtumakäynnistimen, joka tunnistaa, kun tuloarvoa muutetaan. Elementti on tietenkin tekstinsyöttökenttä.

Bubble no code yelp clone tutorial template

kun lähetät käyttäjän hakutulossivullemme, meidän täytyy lisätä ainutlaatuinen hakukysely URL-merkkijonoomme, jolloin seuraava sivu voi hakea nämä tiedot.

sen sijaan, että päätämme lähettää käyttäjän tietylle sivulle tässä työnkulussa, valitsemme ulkoisen verkkosivuston avaamisen. Näin voimme muokata URL-polkua sivujen välillä.

URL, johon lähetämme käyttäjän, on nykyisen verkkosivuston koti-osoite + hakutulossivumme URL + dynaaminen kyselyarvo tekstinsyöttökentästämme.

Bubble no code yelp clone tutorial template

Next, we ‘ ll finish building our dedicated search results page within our application. Kun rakennamme tätä sivua, meidän täytyy määrittää sivutyyppi ravintolalle, koska haluamme näyttää listan vastaavista ravintoloista.

Bubble no code yelp clone tutorial template

tätä sivua suunniteltaessa otetaan ensin mukaan toistuva ryhmäelementti, joka näyttää listan ravintoloista. Toisin kuin ensimmäinen toistuva ryhmä, meidän täytyy päivittää tietolähde tämän toistavan ryhmän vastaamaan hakukyselyn meidän URL merkkijono.

aloita määrittämällä Sisältötyyppi ravintolaksi. Seuraava, Päivitä tietolähde näyttää vain ravintoloita, jotka sisältävät URL merkkijonoja tekstiä niiden kaupungin kenttään.

Bubble no code yelp clone tutorial template

tämä näyttää nyt käyttäjien hakukyselystä vain kaupunkia vastaavat ravintolat.

seuraavaksi tällä sivulla haluamme päivittää kartan merkin aina, kun ravintoloiden otsikkoa napsautetaan, jolloin käyttäjät voivat nähdä sen osoitteen silmämääräisesti.

voit rakentaa tämän toiminnon käyttämällä Bubble workflow-muokkausta luodaksesi mukautetun tapahtuman, joka tunnistaa, kun ravintoloiden otsikkoa napsautetaan.

Bubble no code yelp clone tutorial template

täältä valitaan toiminto, jolla merkit näytetään.

Bubble no code yelp clone tutorial template

Now, we ‘ ll select to display the marker for our-page map, configuring its data source as the current cells restaurants address.

Bubble no code yelp clone tutorial template

lopullinen avaintoiminto, joka meidän täytyy lisätä hakutulossivullemme, on kategorian pudotusvalikosta, jonka avulla käyttäjät voivat suodattaa ravintoloiden kautta niiden ruokaluokkien mukaan, joita he palvelevat.

Bubble no code yelp clone tutorial template

kun olet määrittänyt pudotusvalikon asetukset, meidän täytyy lisätä toistuvaan ryhmäämme ehto, jonka avulla se voi vastata pudotusvalintaan.

tämän ehdon logiikka tunnistaa, milloin pudotusarvot eivät ole tyhjiä. Kun näin tapahtuu,se päivittää toistuvan ryhmän tietolähteen.

Uusi tietolähde sisältää jälleen kerran ravintoloiden haun, lisäämällä saman ehdon kaupunkien URL-merkkijonoon. Lisäämme myös toisen rajoituksen, joka varmistaa, että ravintolan ruokakategorioissa on sama arvo kuin pudotusvalikossa.

Bubble no code yelp clone tutorial template

nyt kun elintarvikeryhmä on valittu, tämä toistuva ryhmä päivittyy automaattisesti relevanteimmilla tuloksilla.

viimeinen tälle sivulle lisättävä toiminto on toinen navigointitapahtuma, joka ohjaa käyttäjän omalle ravintolasivullemme, kun ravintolakuvaa napsautetaan.

toistamme saman navigoinnin työnkulun, jonka loimme kotisivuiltamme toistoryhmästä.

Bubble no code yelp clone tutorial template

arvostelujen lisääminen ravintolaan

kun käyttäjä on löytänyt uuden suosikkiravintolan (no-code-sovelluksen ansiosta), hän saattaa haluta antaa arvostelun ja jakaa kokemuksensa yhteisön kanssa.

lisäämme ravintolasivullamme vielä kertausryhmän ravintolan tietojen alle. Tätä toistoryhmää käytetään näyttämään lista ravintoloiden ajankohtaisista arvosteluista.

tätä toistuvaa ryhmää määritettäessä tietotyyppi asetetaan arvosteluun,ja tietolähteemme vetää kaikki arviot nykyisistä sivuista ravintola.

Bubble no code yelp clone tutorial template

tästä luomme uuden työnkulun, kun lisää arvostelu-painiketta napsautetaan.

Bubble no code yelp clone tutorial template

tämä työnkulku ohjaa käyttäjän omalle sivulle, jossa hän voi luoda uuden arvostelun. Kun lähetät käyttäjän tälle sivulle, haluamme myös välittää tiedot nykyisistä sivuista ravintola.

Bubble no code yelp clone tutorial template

meidän täytyy päivittää sivutyyppi myös ravintolaksi, jolloin voimme vetää nykyiset ravintolatiedot.

Bubble no code yelp clone tutorial template

lopuksi meidän on luotava toinen työnkulku, joka käynnistyy, kun post review-painiketta napsautetaan.

Bubble no code yelp clone tutorial template

tämän työnkulun avulla luodaan uusi asia – Uusi arvostelu.

Bubble no code yelp clone tutorial template

kuten olet aiemmin tehnyt, voit sitten sovittaa sivulla olevat elementit tarvittaviin tietokenttiin luodaksesi kelvollisen arvostelun.

kun uusi arvostelu on luotu, se lisätään automaattisesti kertausryhmään takaisin ravintolat-sivulle.

lisäominaisuudet

kun olet rakentanut tärkeimmät ominaisuudet MVP: llesi, tutustut mukautettujen tietokenttien luomiseen ja dynaamisen sisällön näyttämiseen. Jos haluat jatkaa lisäominaisuuksien lisäämistä hakemistoon, voit harkita:

  • ominaisuuden lisääminen, jonka avulla käyttäjät voivat lähettää kuvia ravintolasivulle
  • käyttäjäprofiilien luominen-listan näyttäminen käyttäjätilin tiedoista ja arvosteluista, joita he ovat luoneet koko alustalla

Launch

kehittäjän tai dev-tiimin palkkaaminen tämän sovelluksen rakentamiseen maksaisi tuhansia, ellei kymmeniä tuhansia dollareita. Kun käynnistät ja kasvaa käyttäjien, meidän maksettu suunnitelmia voit isännöidä sovelluksen omalla mukautetun verkkotunnuksen niin vähän kuin $25 kuukaudessa. Jotkin mallit ja liitännäiset saattavat maksaa enemmän, mutta voit rakentaa kaikki hakemiston toiminnot ilman lisäkustannuksia.

Templates

jos et halua rakentaa ravintola-arvosteluasi tyhjästä, voit ostaa yhden yhteisömme jäsenten tekemistä templateista. Joitakin vastaavia malleja ovat:

  • Canvas Reviews Platform by AirDev
  • Location Based Reviews by Zeroqode
  • Directory & Listing by Zeroqode

Start Building

kupla voi auttaa sinua rakentamaan ravintola-arvostelusivuston tai minkä tahansa muun valitsemasi tuotteen! Ei ole koskaan ollut helpompaa rakentaa jotain uskomatonta ilman koodausta.

jos haluat aloittaa ilmaiseksi, rekisteröidy tästä.

Voit myös olla yhteydessä muihin intohimoisiin tekijöihin, jotka rakentavat kuplaa yhteisöfoorumillamme.

Vastaa

Sähköpostiosoitettasi ei julkaista.