Dev

20 beste frontend-rammer for Bootstrap-alternativ

20 beste frontend-rammer for Bootstrap-alternativ

Frameworks er et av nyttige verktøy for front-end-utviklere for raskere og bedre utvikling. Med rammer kan du bygge en godt strukturert, vedlikeholdbart og oppgraderbart nettsted. Det hjelper deg også spare mye tid fordi det er mange lett tilgjengelige elementer du kan bruke.

I dag har antall rammer økt kraftig, og som du kanskje vet, er Bootstrap fra Twitter på topplasseringen. For å hjelpe deg med å velge det mest hensiktsmessige rammeverket å bruke, har vi listet opp 21+ beste rammer tilgjengelig i dag for Bootstrap-alternativ. De tilbyr unike og ertende funksjoner som skiller seg fra hverandre. Sjekk ut!

1. Ren

Hvis du planlegger å bygge en webapp som fungerer både på stasjonær og mobil, bør du vurdere å bruke Pure fra Yahoo. Pure har mye bedre ytelse når det gjelder mobile enheter enn Bootstrap. Som navnet antyder, kommer Pure kun som et rent CSS-rammeverk. Bygg på toppen av Normalize.css, har Pure en ekstremt liten filstørrelse med bare 4.5KB (minifisert og gzip).

2. UI-sett

UIkit er et gratis, lett og modulært frontend-rammeverk. UIkit er utviklet med MINDRE, og har en godt strukturert, utvidbar og vedlikeholdbar kode. Det tilbyr også et rutenett som er responsivt, flytende og nestbart. Med UIkit kan du bygge navigasjon, knapper, modeller, rullegardin og mer responsivt. Den omfattende dokumentasjonen vil gjøre det lettere for deg å komme i gang med UIkit.

3. MontageJS

MontageJS er et gratis open source front-end-rammeverk spesialisert for lage moderne enkeltsidesapplikasjoner (SPA). Ved å bruke grunnlaget for mange velprøvde rammeapplikasjoner, vil Montage forenkle utviklingsprosessen din mens de uttrykksfulle HTML-kodene fremdeles kan vedlikeholdes. Med MontageJS kan du synkronisere DOM-oppdateringene for jevnere brukeropplevelse, bygge og utvide UI-komponenter som kan gjenbrukes og mer.

4. Grunnarbeid

Grunnarbeid er et lett, fleksibelt og responsivt frontend-rammeverk skapt og vedlikeholdt av Gary Hepting. Bygget på toppen av Sass og Compass, tilbyr Groundwork et flott rutenett system som fleksibel, flytende og nestbar. Med rutenettet kan du lage en hvilken som helst layouttype som passer til hvilken som helst skjermstørrelse.

5. Gumby

Gumby er et fleksibelt og responsivt rammeverk bygget med kraften fra Sass for raskere nettutvikling. Med tilpasningen kan du enkelt tilpasse og tilpasse hele UI-settdesignet slik at det passer best. Gumby har flere typer nett med forskjellige kolonnevariasjoner, men som standard kommer Gumby med 960 rutenett.

6. HTML5 Kjeleplate

Akkurat som navnet, gir HTML5 Boilerplate deg HTML5-klar mal som er optimalisert for å oppfylle den mest standard av nye HTML-funksjoner. Ved å bruke denne malen kan du opprette en rask, robust og responsiv nettsted som er i stand til å tilpasse seg alle slags nettlesere, selv de gamle som Internet Explorer.

7. Skjelett

Skjelett er et lett CSS-rammeverk som bruker et 12-kolonne rutenett system. I motsetning til Bootstrap eller Foundation, gir Skeleton deg noen grunnleggende komponenter bare som knapp, lister, tabell, skjemaer som har som mål å starte utviklingsprosessen..

8. Bootflat

Bootflat er et open source CSS-rammeverk som er bygget med den kraftige Bootstrap 3. Bootflat er designet for å skape en fantastisk flat webdesign med raskere, enklere og mindre repeterende måte. Derfor leveres UI-settet med en vakker PSD-brukergrensesnittpakke som du kan bruke på nettstedet ditt, iOS eller Android-prosjektet.

9. Inuit

Inuit.css er et annet flott CSS-famework som fokuserer på Mobile First-tilnærming og overlater alt designet til deg. Mens mange andre rammeverk kommer med sin egen innebygde design CSS, gjør Inuit.css det imidlertid ikke. Inuit.css fungerer på OOCSS (Object Oriented CSS) måte som er en rask, skalerbar og vedlikeholdbar metode for å skrive gjenbrukbar CSS.

10. 960 Grid System

960 Grid System er et frontend-rammeverk som kan strømlinjeforme arbeidsflyten for nettutvikling basert på en 960 px bred container. Beholderen kan deretter kuttes opp i 12, 16 eller til og med 24 kolonner for lettere å legge ut innhold.

11. Materialiser

Bygget basert på Googles materialdesignprinsipper, har Materialize kommet som et moderne responsivt frontend-rammeverk. Dette rammeverket er veldig godt egnet for de som ønsker å implementere Material Design look and feel på deres nettside uten noen kompleksitet. Den har kortdesign, ringeffektanimasjon, Sass mixin, dra ut mobilmenyen og mange flere.

12. Jeet

Jeet er et raskt, fleksibelt og mest forhåndsnettet system tilgjengelig i dag. Jeet hjelper deg med å bygge nett på en veldig intuitiv, ren, måte. Den støtter nesten alle moderne og gamle nettlesere.

13. Susy

Susy er et automatisert rutenettsystem som kan hjelpe deg med å bygge nettoppsett i hvilken som helst type kolonne du vil ha. Det gir deg frihet og fleksibilitet til å bygge design etter eget valg. Det er i stand til å håndtere om designet ditt har 5, 12, 24, 48 eller ulik kolonne.

14. Metro UI

Metro UI er et 12-rutenettbasert rammeverk som er inspirert av Windows 8 Metro-stilgrensesnitt. Det er veldig enkelt å bruke og har stil med en rekke vanlige komponenter som knapp, fliser, meny, datovelger og mye mer. Det er også en nyhetsportalmal som lett kommer i gang.

15. HTML KickStart

HTML KickStart er en ultra-mager HTML, CSS og Javascript kjeleplate for ekstremt raskere webutvikling. HTML KickStart ble utviklet basert på Twitter Bootstrap med ikonstøtten fra Font Awesome. Med sin klare meny, liste, tabeller, knapper, rutenett og mange flotte elementer, vil du lagre prosessen med å lage ditt webprosjekt i opptil 10 timer eller enda mer.

16. Enkelt rutenett

Simple Grid er et veldig lett, responsivt rutenettsystem. Det er ikke som andre rammer som har den fancy knappen, menyen, bordet osv., Simple Grid tilbyr bare et rent rutenett. Rutenettfunksjonen er basert på 1140 px skjermstørrelse med 12 kolonner som du kan tilpasse for å få ditt beste oppsett.

17. Stiftelse

Foundation er mest sannsynlig den tøffeste rivalen for Twitter Bootstrap. Det er veldig godt dokumentert, stabilt, fleksibelt og åpen kildekode-frontramme. Den har mange nyttige verktøy for å skape responsive, første mobilprosjekter raskere. Den støtter nesten alle tilgjengelige nettlesere i dag, bortsett fra IE7. Selv om mange utviklere for det meste bare bruker Foundation for HTML og CSS, har du muligheten til å portere den med Sass og Skinner.

18. Materiell brukergrensesnitt

Material UI er et annet rammeverk som implementeres Materiell design spesifikasjon. Det eneste som skiller det fra Materialize er at det er bygget av kjærligheten til React Javascript-biblioteket fra Facebook. Den har mange vakre UI-komponenter som du kan bruke fritt på websiden din.

19. Topplakk

TopCoat er et robust frontend-rammeverk laget av Adobe team for å utvikle webapplikasjoner designet med tanke på hastighet. Hver eneste detalj i TopCoat er optimalisert for ytelsesprioritet. Det tilbyr deg også tilpassbart tema, åpen kildekode og også PSD UI Kit for bruk med prosjektet ditt.

20. Blekk

Blekk er et front-end-rammeverk som er utviklet for raskere UI-utvikling ved hjelp av HTML, CSS og Javascript, akkurat som Bootstrap gjør. Du kan enkelt lage moderne oppsett med noen gjenbrukbare grensesnittelementer som tabell, faner, datavelger, modal, sorterbar liste, trevisning, galleri, skjemavalidator og mer. Det lar deg også ha DOM-manipulering, kommunikasjonsfasiliteter og fancy sideeffekter med JS Core-motoren.

21. Onsen UI

Onsen UI er et hybrid rammeverk som fungerer bra med PhoneGap og Cordova. Med AngularJS, jQuery, Font Awesome og TopCoat som grunnlag kan Onsen UI være et lovende verktøy for å utvikle fantastiske mobilapper. Onsen UI kan hjelpe deg med å bygge mobilapper enkelt ved å bruke konseptet Web Components.

Hvilken er ditt favoritt Bootstrap-alternativ? Gi oss beskjed i kommentarene nedenfor.

Hva er sosiale medier?
Begrepet Sosiale medier er et vanskelig begrep. Etter å ha gått gjennom mange Google-søk og mange artikler, skjønte jeg at det er bedre å uttrykke det...
Twitter vs. Facebook for profesjonell bruk
Hva kommer du til å tenke først når vi sier ordet 'Sosiale medier'? Til tross for at du kanskje bruker andre plattformer for å få tilgang til denne ve...
Test YouTube-videohastigheten din
YouTube-videohastighet er en viktig del av seeropplevelsen, siden den bestemmer hvor lang tid vi trenger å vente før vi kan begynne å se en video. Det...