Νέοι πόροι για σχεδιαστές ιστοσελίδων και προγραμματιστές (Απρίλιος 2018)

Αυτό το μήνα είδαμε μερικές ανακοινώσεις από τα αξιοσημείωτα ονόματα της τεχνολογίας. Για παράδειγμα, η Apple άνοιξε ένα νέο σύστημα βάσης δεδομένων, η Google κυκλοφόρησε ένα νέο εργαλείο για να μετρήσει την ταχύτητα του ιστότοπού σας στο κινητό και το Github με μια δωρεάν σειρά μαθημάτων για να ξεκινήσετε με το Git, Github και την κωδικοποίηση γενικά.

Επίσης, στη σημερινή θέση, θα είμαι επίσης παρουσιάζουν μια σειρά από νέα εργαλεία που βρίσκονται σε εξέλιξη. Ας πηδήσουμε σε αυτό που έχουμε περισσότερο στη λίστα.

VuePress

Ένα νέο εργαλείο από τον δημιουργό του Vue, το VuePress είναι α γεννήτρια στατικών τοποθεσιών σχεδιασμένο με γνώμονα το Vue.js. Δημιουργεί και προ-παρέχει στατική HTML για κάθε σελίδα, και λειτουργεί ως SPA (εφαρμογή σε μία σελίδα). Έρχεται με κάποιες δυνατότητες εκτός πλαισίου, συμπεριλαμβανομένης της δυνατότητας προσθήκης αναγνωριστικού Google Analytics, αναζήτησης, επόμενης και προηγούμενης πλοήγησης, πλευρικής γραμμής και PWA.

IMG-2

Μια βιβλιοθήκη JavaScript που εισάγει ένα προσαρμοσμένο στοιχείο, img-2. Το νέο στοιχείο προσθέτει μια σειρά βελτιστοποιήσεων που δεν συνοδεύουν το πρότυπο img στοιχείο, βελτιώνοντας τον τρόπο φόρτωσης της εικόνας για τους χρήστες. Με το προσαρμοσμένο στοιχείο, η εικόνα θα είναι προσωρινά αποθηκευμένη, επίσης τεμπέλης φορτίο οι εικόνες και η προβολή θα προέρχονται από την προσωρινή μνήμη μόνο καθώς οι εικόνες εισέρχονται στο παράθυρο προβολής του χρήστη. Δείτε το demo.

Πίνακας

Ένα κομψό πάνελ πίνακα / διαχειριστή με βάση το Bootstrap 4. Ο πίνακας διαθέτει προκατασκευασμένα στοιχεία, όπως Χάρτες, Μορφές, Γκαλερί, Πίνακα Τιμολόγησης και ένα ωραίο συλλογή προσαρμοσμένων εικονιδίων. Ένα εξαιρετικό σημείο εκκίνησης για να αφήσει τους προγραμματιστές να χτίσουν γρήγορα έναν διαχειριστικό πίνακα. Δείτε το demo!

DayJS

DayJS Βιβλιοθήκη JavaScript για τη μορφοποίηση ημερομηνιών και χρόνων. Ακόμη περισσότερο, το DayJS διαθέτει παρόμοια API με το Moment.js, αλλά είναι μόνο βάρος 2Kb σε μέγεθος. Δεδομένου ότι, θα μπορούσε να είναι α μεγάλη εναλλακτική λύση για το Moment.js, αν θέλετε μια ελαφρύτερη βιβλιοθήκη να διατηρεί την εξοικείωση με αυτό που έχετε ήδη γνωρίσει.

UnifiedArchive

Μια βιβλιοθήκη PHP για την αντιμετώπιση συμπιεσμένων αρχείων, το UnifiedArchive υποστηρίζει ένα ευρύ φάσμα μορφών συμπεριλαμβανομένων RAR, Zip, Gzip, πίσσα, και πολλούς άλλους τύπους συμπίεσης. Με αυτήν τη βιβλιοθήκη, μπορείτε να αρχειοθετήσετε και να εξαγάγετε αρχεία ή καταλόγους. Παρέχει ένα χούφτα API για χειρισμό αρχείων αφού έχει εξαχθεί από το αρχείο. Το UnifiedArchive είναι διαθέσιμο ως πακέτο Composer.

Github Learning Lab

Ο Github μόλις ανακοίνωσε ένα δωρεάν μαθήματα που καλύπτουν κυρίως το Git στο Github. Υπάρχουν 5 μαθήματα αυτή τη στιγμή όπου μπορείτε να μάθετε μερικά χρήσιμα πράγματα όπως πώς να χρησιμοποιήσετε το Github για να φιλοξενήσετε τους κωδικούς σας, πώς να χρησιμοποιήσετε τις σελίδες Github για να αποκτήσετε έναν ελεύθερο ιστότοπο ή ιστολόγιο για το έργο σας και πώς να διαχειριστείτε Συγκεντρώσεις σύγκρουσης που είναι κοινές για να συμβεί όταν εργάζεστε με πολλούς προγραμματιστές σε ένα έργο.

Μονάδα WordPressTest DOM Parser

Μια ωραία άκρη από την Takayuki Miyauchi δοκιμάστε DOMElement κατά την εκτέλεση του UnitTest σε εφαρμογές WordPress. Εγώ προσωπικά βρήκα αυτό πραγματικά χρήσιμο. ελπίζω να το βρείτε το ίδιο.

Popmotion

Μια βιβλιοθήκη JavaScript για μια ομαλή κινούμενη κίνηση στο διαδίκτυο, “Popmotion” παρέχει ένα API που ονομάζεται Φυσική που σας επιτρέπει να δημιουργήσετε με σχεδόν πραγματικές εφέ κίνησης. Είναι απρογραμμάτιστο. τη βιβλιοθήκη απλά εξάγει τιμές που βασίζονται στο συγκεκριμένο σύνολο της διαμόρφωσης. Αυτό σας επιτρέπει να εφαρμόσετε αυτές τις έξοδοι για να animate οποιοδήποτε μέσο συμπεριλαμβανομένων CSS, SVG, Three.js και ακόμη και React.js.

Driver.js

Μια βιβλιοθήκη JavaScript που σας επιτρέπει να κάνετε “οδηγώ” εστίαση χρήστη σε μια σελίδα. Αυτό είναι ιδιαίτερα χρήσιμο εάν θέλετε να εισαγάγετε συγκεκριμένες λειτουργίες ή να τις καθοδηγήσετε σε συγκεκριμένες εργασίες στη σελίδα. Ο Driver.js είναι απλά 4 KB σε μέγεθος, προσαρμόσιμη και φιλική προς το πληκτρολόγιο.

Αντικαταστήστε το κινούμενο GIF με βίντεο

Το GIF είναι παντού, μετά από μια μεγάλη επιστροφή. Αλλά το πρόβλημα σχετικά με το GIF είναι ότι είναι συνήθως πολύ τεράστιο. Είναι χάσιμο εύρους ζώνης, ωστόσο η γραφική ποιότητα είναι συχνά τρομερή. Αυτό κατευθυντήρια γραμμή από την Google δείχνει πώς “βίντεο” μπορεί να αντικαταστήσει το GIF για να εμφανίσει κινούμενα γραφικά.

Μάσκα κειμένου

Μια βιβλιοθήκη JavaScript στο μετατρέψτε το κείμενο που απαιτεί ειδική μορφοποίηση όπως έναν αριθμό τηλεφώνου, ένα νόμισμα ή έναν αριθμό πιστωτικής κάρτας. Καθώς ο χρήστης πληκτρολογεί στο κείμενο, θα μετατραπεί αυτόματα σε κατάλληλη μορφοποίηση, βελτιώνοντας την εμπειρία του χρήστη. TextMask μπορεί να χρησιμοποιηθεί με React, Vue, ή απλά παλιό JavaScript.

Συγκρίνετε την ταχύτητα του Mobile Site

Αυτό είναι ένα άλλο εύχρηστο εργαλείο από την Google. Αυτό το εργαλείο θα σας επιτρέψει να ελέγξτε την ταχύτητα του ιστοτόπου σας κατά τη φόρτωση από κινητό και υπολογίστε τη συνολική απώλεια εσόδων όταν ο ιστότοπος φορτώνει αργά. Μπορείς επιλέξτε τη χώρα και την ταχύτητα των οποίων ο ιστότοπός σας θα δοκιμαστεί κατά.

VueNut

Ένας σύντροφος ανάπτυξης όταν δημιουργεί μια εφαρμογή web με Vue.js και Vuex, το VueNut το κάνει ευκολότερη διερεύνηση της αποθηκευμένης κατάστασης δεδομένων και σας επιτρέπει να χειρίζεστε εύκολα τα δεδομένα κατά την ανάπτυξη. Καλό πράγμα!

FoundationDB

Πρόσφατα η Apple έκανε το FoundationDB ανοιχτή πηγή στο Github. Είναι ένα Σύστημα βάσεων δεδομένων ζεύγους κλειδιών που υπόσχεται κλιμάκωση και απόδοση. Είναι δροσερό να έχουμε μεγάλες εταιρείες τεχνολογίας που αρχίζουν να αφιερώνουν σε ανοιχτού κώδικα κάποια από τα προϊόντα τους.

Βιβλία ιστορίας

Το StoryBooks είναι ένα εργαλείο για να δημιουργήστε ένα στοιχείο React μεμονωμένα. Παρέχει ένα UI στο πρόγραμμα περιήγησης που σας επιτρέπει να δείτε τις διαφορετικές καταστάσεις κάθε συστατικού καθώς και δοκιμάστε τα εξαρτήματα.

GhostText

Μια επέκταση προγράμματος περιήγησης που θα το κάνει συγχρονίστε αυτό που γράφετε στο πρόγραμμα περιήγησης στον επεξεργαστή κειμένου ή το αντίστροφο. Βρήκα αυτό τελικά χρήσιμο αν θέλετε να μπορείτε να γράφετε σε έναν ιστότοπο με την ευκολία και τις δυνατότητες του επεξεργαστή κώδικα. Το GhostText είναι διαθέσιμο για Chrome, Firefox και Opera.

Coala

Το Coala είναι α Το CLI παρέχει μια διεπαφή για τη χαλάρωση και τον καθορισμό κώδικα ανεξάρτητα από τις γλώσσες που χρησιμοποιούνται. Μπορείτε να χρησιμοποιήσετε το Coala μέσα σε ένα πρόγραμμα επεξεργασίας κώδικα, να το ενσωματώσετε σε CI (συνεχής ενσωμάτωση) και να το προσαρμόσετε με μια σύνταξη διαμόρφωσης στο .καφενείο. Το Coala υποστηρίζει πολλές γλώσσες, όπως CSS, JavaScript, PHP, και μπορείτε να βρείτε περισσότερες σε αυτόν τον κατάλογο.

ReactStrap

Το ReactStrap είναι μια συλλογή από στοιχεία Bootstrap 4 που μετασχηματίζονται σε επαναχρησιμοποιήσιμα στοιχεία React. Εάν θέλετε να εκσυγχρονίσετε τον παλιό ιστότοπο που βασίζεται σε Bootstrap, αυτή η βιβλιοθήκη είναι κάτι που μπορεί να θέλετε να εξετάσετε.

Reacto

Ένα άλλο εργαλείο που σχετίζεται με το Reacto, είναι το Reacto Το IDE ενσωματώνεται στην κορυφή του Electron και έχει σχεδιαστεί για την ανάπτυξη εφαρμογών ιστού με το ReactJS. Αυτό φαίνεται πολύ βολικό αν η πρωτογενής σας ανάπτυξη περιστρέφεται γύρω από το ReactJS.

PicoJS

Μια βιβλιοθήκη JavaScript που επιτρέπει την ανίχνευση προσώπου. Λειτουργεί με μια φωτογραφία ή από την ενσωματωμένη κάμερα. Είναι πραγματικά συναρπαστικό πώς εξελίσσεται η τεχνολογία ιστού τα τελευταία χρόνια.