Ilmainen CloudFlare-käyttöliittymän kehys Frontend-kehittäjille

CloudFlare ilmoitti äskettäin, että heidän järjestelmänsä uudistetaan merkittävästi alkaen selkäranka ja React.js. Tämä tuli päivitetty frontend-käyttöliittymän kehys ja joukkue päätti avata lähdekoodin kaikille.

CloudFlare-käyttöliittymä, lyhennetty CF-UI, on ilmainen avoimen lähdekoodin kirjasto, joka voi käyttää Frontend-koodeja sitoa React-työnkulkuun.

Joukkue on ollut hyvin avoin heidän liikkumisestaan mukaan lukien muut tekniikat kuten Lerna.js for hallita koodia useilla repoilla. Tämä kunnostus menee syvemmälle kuin pinnalliset komponentit, mutta nämä vapaat komponentit voivat tehdä valtavan eron työnkulussa.

CloudFlare lisäsi mukautetut komponentit kirjastoon yksikkötestit koodin laadun tarkistamiseksi. Näet a live-esittely kaikki tämän sivun komponentit mukaan lukien dokumentointi ja koodinpätkät.

Kaikki koodi on rakennettu Reactilla, niin se laajentaa luokkia valmistettu eri osiin, kuten sivutus, pudotusvalikot, syöttökentät ja jopa tekstin kopiointi.

Voit selata kaikkia paketteja GitHubissa ja ne voivat kaikki olla asennettu npm: n kautta. Huomaa, että tämä ei ole yksinkertainen etupaneelin kehys, kuten Bootstrap (vaikka se jäljittelee läheisesti niiden tyyliä). Sen sijaan tämä on a täydellinen React + Redux-lähestymistapa etuosan komponentteihin.

Huomaa, että sinun pitäisi jo tuntea olosi mukavaksi React-komponenttien kanssa, asentamalla kirjastoja npm: n kautta ja lisäämällä sidoksia React Reduxin kautta.

Kaikki nämä projektit ovat avoimen lähdekoodin ja helposti liitettävissä sivustoosi. Yksittäiset komponentit heillä on omat JS-tiedostot jonka voit lisätä sivustosi otsikkoon. Ja sinä voit selaa kaikkia osia GitHub-sivulla, jos haluat lisätietoja.

Live-esimerkkejä ja lähdekoodin katkelmia löydät täältä, jos haluat sukeltaa suoraan sisään. Ja jos sinulla on kysymyksiä tai ideoita teknisistä ominaisuuksista, sinun pitäisi selata keskusteluhakemisto lisätietoja. Voit myös kokeilla viestejä CloudFlare devs tai lähettää heille twiitti @Cloudflare.