Hvis du er en front-end-utvikler som meg, er jeg sikker på at du har endt opp i denne situasjonen før. Du har enten bygget en enkel statisk side, eller du har lastet ned en fin statisk mal, og da har du tenkt "Oh, hvis jeg bare kunne legge et kontaktskjema på dette" eller "Jeg vil bare legge til en betalingsknapp". Dette er de slags spørsmål som gjør et lite prosjekt til et mye større dyr.
Men det trenger ikke å være slik. Det er mange verktøy og funksjoner du kan legge til på et statisk nettsted uten å måtte introdusere PHP, Ruby eller noen annen form for backend-utvikling. I denne artikkelen har jeg oppført noen ressurser som gjør nettstedet ditt litt mindre statisk.
Ja, jeg skjønner at dette egentlig ikke er en front-end ressurs eller et verktøy, men hvis du vil at noen skal se nettstedet ditt, må du sette det på nettet.
For statisk web hosting er en av mine to favoritter sikkert GitHub Pages. GitHub Pages er designet for å la folk lage nettsteder for å falle sammen med sine webprosjekter på GitHub.com. Det gjør også en god jobb, så mye at folk bruker det til å være vert for deres hovedportefølje eller personlige nettsteder på den. Ta en titt på følgende opplæringsprogrammer for å lære mer:
Merk: Hvis du har lastet ned en mal fra Envato Market eller ønsker å være vertskap for sensitivt materiale på GitHub Pages, må du betale for en privat repo. I disse situasjonene er det viktig at folk ikke kan fritt laste ned koden direkte fra GitHub.com
Overspenning er en annen favoritt av meg og er kjempebra for statisk hosting, spesielt hvis du liker å trykke nettsteder live via kommandolinjen. Installasjonsprosessen er hyggelig grei.
Surge's walrusSurge plus, som tilbyr mer robuste funksjoner enn den gratis prisplanen, for eksempel passordbeskyttelse og HTTPS, vil (på tidspunktet for skriving) sette deg tilbake $ 13 per måned.
Skjemaer, for meg, pleide å være tipping punktet der jeg ville innrømme at "Jeg skal trenge noe PHP her". Vel, ikke lenger, takket være verktøy som Formspree, Disqus og til og med Google Forms.
Formspree lar deg omdanne en statisk HTML-skjema til et fullt fungerende kontaktskjema. Hvis du vil prøve det selv, skrev jeg en artikkel om hvordan du legger til Formspree-skjemaer på et statisk nettsted.
Hvis jeg trengte å legge til et kommentarsystem til et hvilket som helst nettsted, ville jeg gå direkte til Disqus; Det ser bra ut og fungerer perfekt (håndtering av spam ekstremt godt). Utover det legger det til sosiale og gamendynamik til kommentarer, anbefaler diskusjoner, samler trender fra hele nettet, og lar brukerne tjene poeng gjennom fellesskapstemmer.
Den tilbyr til og med inntektsgenerering ved å la utgivere tappe inn i Disqus egen annonseplattform.
På den annen side, mens Google Forms antagelig er et mindre kjent verktøy, er det ganske bra å administrere tilbakemelding og samle pollingsdata. Jeg vil også anbefale å sjekke ut de nye Google Forms som de har oppdatert brukergrensesnittet og skjemaene for å følge det nye materialdesignsystemet.
Mmmm ... marshmallowsHelt siden jeg oppdaget CloudFlare har jeg brukt den til å sette opp alle mine domener. Sette opp domenet ditt med CloudFlare låser opp mange funksjoner du kan aktivere fra administrasjonsgrensesnittet. Fleksibel SSL, nettstedssøk, HTML-komprimering og mer. Hvis du skal inkludere tredjeparts widgets og plugins til din statiske nettside, vil CloudFlers optimaliseringsverktøy sikre at nettstedet ditt utfører så godt det kan. Her er en fullstendig liste over tilgjengelige apper.
Tar betalinger på en statisk nettside? Er du gal!? Vel faktisk nei, så lenge du har det riktige SSL-sertifikatet og har alt satt opp på en sikker måte, kan du ta betalinger på et statisk område like enkelt som noe annet slag.
Envato Market har hundrevis av statisk maler for detaljhandel, ideell for å selge ting online, uten å være bundet til en dynamisk plattform.
Hvis du ønsker å ta enkeltbetalinger for et produkt, vil jeg anbefale å bruke Stripe Checkout. Utformingen av dialogvinduet er topp, noe som gir en ren brukeropplevelse, i stedet for å lede brukeren til et helt annet nettsted.
Også, fordi det er knyttet til Stripe-kontoen din, kan du bruke sin offisielle app til å spore betalinger.
Leter du etter noe litt mer kraftig? Noe som kan tillate flere produkter, en kurv og en full kasseprosess? Ikke noe problem, Gumroad har ryggen med sin Inline Purchase Widget.
Hvis du legger til dette på hvert produkt på ditt statiske nettsted, kan brukeren legge til flere produkter i kurven sin og betale for dem via Gumroad-betalingssystemet, som du kan administrere fra din Gumroad-konto. Lære mer:
Det finnes et par andre verktøy der ute som du kan ha nytte av hvis du lager et nettsted ved hjelp av statiske sider.
Hvis du vil legge til et kart på nettstedet ditt, anbefaler jeg MapBuildr, som gir et relativt enkelt grensesnitt for å lage ditt eget kart som er innebygd ved hjelp av Google Maps API.
En annen funksjon du kanskje vil legge til er en blogg. Uten å bruke en generator som Jekyll, kan du ikke enkelt implementere en blogg i et statisk område, men du kan bruke en tjeneste som er spesielt utviklet for blogging. Medium har blitt ekstremt populært for enkeltpersoner og bedrifter, for å blogge med, og det er faktisk en måte å legge inn middels artikler på en statisk side.
Presentasjonen av embedet er elegant og rent, så det bør ikke kollidere med ditt nettsteddesign.
Som du kan se, trenger et statisk område ikke å være statisk. Det er mange kraftige verktøy der ute for å få statiske maler til liv, de fleste er helt gratis å sette opp. Alle ovennevnte verktøy er bygget og designet med omhu og oppmerksomhet, og hvis du får sjansen til å bruke en av dem, anbefaler jeg at du prøver dem ut.