Ingyenes ES5 / ES6 JavaScript fájl feltöltési bővítmény - Uppy
A tervezés egyik legnehezebb formája az fájlfeltöltés. Alapértelmezett HTML-stílusa van, de ez nem a legszebb dolog a világon.
Uppy a fájl feltöltéseket teljesen új szintre emeli a egyéni felület és a dinamikus Ajax-stílusú betöltési folyamat.
Azt az ES5 / ES6 kódon fut, így a webes alkalmazásokat a legfrissebb JavaScript-szabványokkal építheti. És még támogatja a felhő tárolóhelyekről történő fájl feltöltéseket például a Dropbox vagy a Google Drive, így a sokoldalú fájl feltöltő szkript az interneten.
Uppy az teljesen szabad és nyílt forráskódú, egy repóval a GitHub-on. A plugin telepítésének legegyszerűbb módja az npm vagy a fonal, így lehet úgy, mint egy igazi csomag.
Miután megkapta a webhelyéhez hozzáadott fájlokat, csak tartalmazza az Uppy.js fájlt és a CSS kódot. Ezután a kívánt bemeneti mezőt célozza meg, és az Uppy gondoskodik a többitől.
Egyedülálló felülettel rendelkezik úgy néz ki, mint egy nagy négyzet elhelyezés a fájlok húzásához. Te is válasszon elemeket a merevlemezről vagy akár fájlok feltöltése külső URL-ekből. Elég őrült!
A teljes telepítési folyamat megtalálható a dokumentációs oldalon, de az megköveteli legalább az ECMAScript 6 megértését. Ez a könyvtár a szkriptek jövőjére néz, és nem a legegyszerűbb a tiszta vanília JavaScript használatával.
De ha komolyan gondolod a webfejlesztést, érdemes megismerni az ES6-ot. Találhatod tonna erőforrások online az öntanításhoz és az Uppy-t is használhatja az elsőnek “igazi” a projekt a merüléshez és a tanuláshoz.
Nézze meg a műszerfal példáját lásd Uppy akcióban. Ehhez az oldalhoz a A feltöltés egy trigger gomb mögött van elrejtve, ahol a gombra kattint, hogy megjelenjen egy modális feltöltési mező.
Innen kiválaszthatja, hogy feltölt-e egy képet a számítógépről, az internetről vagy akár a webkameráról!
A példák oldalon egy csomó nézhet át, beleértve a húzza a példát, együtt egy nemzetközivé vált demóoldal.
De hogy valóban megtanulják, hogyan működik ez, azt javaslom, hogy a dokumentumokat és a GitHub fő repóját böngészjük. Ön is megoszthatja gondolatait a Twitter @transloadit alkotóival.