Sumber Baharu untuk Pereka dan Pemaju Web (April 2018)

Bulan ini kita melihat beberapa pengumuman dari nama terkenal dalam teknologi. Sebagai contoh, Apple membuka sumber sistem pangkalan data baru, Google mengeluarkan alat baru untuk mengukur kelajuan laman web anda di telefon bimbit, dan Github dengan kursus percuma untuk membuat anda bermula dengan Git, Github, dan pengekodan secara umum.

Juga, dalam jawatan hari ini, saya juga akan Mempunyai beberapa alat baharu yang kini semakin meningkat. Mari kita melompat ke apa yang kita ada dalam senarai.

VuePress

Alat baru dari pencipta Vue, VuePress adalah a penjana tapak statik direka dengan Vue.j dalam fikiran. Ia menjana dan pra-membuat HTML statik untuk setiap halaman, dan berjalan sebagai SPA (Permohonan Single-halaman). Ia disertakan dengan beberapa ciri tanpa had termasuk keupayaan untuk menambah ID Google Analitis, carian, navigasi depan dan seterusnya, bar sisi, dan PWA.

IMG-2

Pustaka JavaScript yang memperkenalkan a elemen tersuai, img-2. Elemen baru menambah beberapa pengoptimuman yang tidak datang dengan standard img elemen, meningkatkan bagaimana imej dimuatkan untuk pengguna. Dengan unsur tersuai, imej itu akan diprapaukan sebelum ini, juga beban malas imej dan perkhidmatan akan dari cache hanya apabila imej memasuki viewport pengguna. Lihat demo itu.

Tabler

Panel Dashboard / Admin yang elegan berdasarkan Bootstrap 4. Papan pemuka mempunyai komponen pra-dibuat seperti Carta, Bentuk, Galeri, Jadual Harga, dan bagus koleksi Ikon tersuai. Titik permulaan yang bagus untuk membolehkan pemaju membina Panel Admin dengan cepat. Lihat demo itu!

DayJS

DayJS Pustaka JavaScript untuk memformat tarikh dan masa. Lebih-lebih lagi, DayJS mempunyai API yang serupa untuk Moment.js, tetapi saiznya hanya 2Kb. Memandangkan itu, ia boleh menjadi alternatif hebat untuk Moment.js, jika anda ingin perpustakaan yang lebih ringan lagi mengekalkan kebiasaan apa yang anda sudah dikenali.

UnifiedArchive

Perpustakaan PHP untuk menangani fail termampat, UnifiedArchive menyokong pelbagai format termasuk RAR, Zip, Gzip, Tar, dan banyak jenis mampatan lain. Dengan pustaka ini, anda boleh mengarkibkan dan mengekstrak fail atau direktori. Ia menyediakan a beberapa API untuk memanipulasi fail selepas ia diekstrak daripada arkib. UnifiedArchive boleh didapati sebagai pakej Komposer.

Makmal Pembelajaran Github

Github baru saja mengumumkan kursus percuma yang meliputi terutamanya Git di Github. Terdapat 5 kursus pada masa ini di mana anda boleh belajar beberapa perkara berguna seperti cara menggunakan Github untuk menjadi tuan rumah kod anda, bagaimana untuk menggunakan laman Github untuk mendapatkan tapak atau blog percuma untuk projek anda, dan bagaimana untuk menguruskan konflik Merge yang biasa berlaku apabila anda bekerja dengan banyak pemaju pada projek.

Pemproses UnitTest DOM WordPress

Petua yang baik dari Takayuki Miyauchi menguji DOMElement semasa melaksanakan UnitTest dalam aplikasi WordPress. Saya secara peribadi mendapati ini sangat berguna; harap anda dapati ia sama.

Popmotion

Pustaka JavaScript untuk animasi licin yang lancar di web, “Popmotion” menyediakan API yang dipanggil Fizik yang membolehkan anda membuat dengan kesan animasi kehidupan sebenar yang dekat. Ia tidak ditukar; perpustakaan semata-mata nilai output berdasarkan set spesifik konfigurasi. Ini membolehkan anda menggunakan output tersebut untuk menghidupkan mana-mana medium termasuk CSS, SVG, Three.js dan bahkan React.js.

Driver.js

Pustaka JavaScript yang membolehkan anda “memandu” fokus pengguna pada halaman. Ini amat berguna jika anda ingin memperkenalkan ciri-ciri tertentu atau membimbingnya ke tugas tertentu pada halaman. Driver.js hanya Saiznya 4 KB, boleh disesuaikan dan mesra papan kekunci.

Gantikan GIF Animasi dengan Video

GIF ada di mana-mana, selepas membuat kembali hebat. Tetapi masalah tentang GIF adalah biasanya ia sangat besar. Ia membazir lebar jalur, namun kualiti grafik sering teruk. Ini garis panduan dari Google menunjukkan bagaimana “Video” boleh menggantikan GIF untuk menunjukkan grafik animasi.

Topeng Teks

Pustaka JavaScript kepada mengubah teks yang memerlukan pemformatan khas seperti nombor telefon, mata wang, atau nombor kad kredit. Oleh kerana pengguna menaip dalam teks secara automatik akan diubah menjadi format yang sesuai untuk meningkatkan pengalaman pengguna. TextMask boleh digunakan dengan React, Vue, atau JavaScript biasa saja.

Bandingkan Kelajuan Tapak Mudah Alih

Ini adalah satu lagi alat berguna dari Google. Alat ini akan membolehkan anda untuk semak kelajuan laman web anda apabila memuatkan dari mudah alih dan menganggarkan jumlah kehilangan hasil apabila laman web dimuatkan perlahan. Awak boleh pilih negara dan kelajuan yang mana laman web anda akan diuji.

VueNut

Teman pembangunan semasa membina aplikasi web dengan Vue.js dan Vuex, VueNut menjadikannya lebih mudah untuk meneroka keadaan data yang disimpan dan membolehkan anda memanipulasi data semasa pembangunan dengan mudah. Barang sejuk!

FoundationDB

Baru-baru ini Apple membuat sumber terbuka FoundationDB di Github. Ianya adalah sistem pangkalan data pasangan kunci yang menjanjikan kebolehkerjaan dan prestasi. Senang untuk mempunyai syarikat teknologi tinggi mula menumpukan untuk membuka sumber beberapa produk mereka.

StoryBooks

StoryBooks adalah alat untuk membina komponen React dalam pengasingan. Ia menyediakan UI pada penyemak imbas yang membolehkan anda melihat keadaan berbeza dari setiap komponen dan juga menguji komponen.

GhostText

Sambungan pelayar yang akan menyegerakkan apa yang anda tulis pada pelayar ke editor teks anda atau sebaliknya. Saya mendapati ini sangat berguna jika anda ingin menulis di laman web dengan kemudahan dan ciri-ciri editor kod anda. GhostText tersedia untuk Chrome, Firefox, dan Opera.

Coala

Coala adalah a CLI menyediakan antara muka untuk mengenali dan menetapkan kod tanpa mengira bahasa yang digunakan. Anda boleh menggunakan Coala dalam editor kod, mengintegrasikannya dengan CI (Integrasi Berterusan), dan menyesuaikannya dengan sintaks konfigurasi dalam .coafile. Coala menyokong banyak bahasa seperti CSS, JavaScript, PHP, dan anda boleh mencari lebih banyak lagi dalam direktori ini.

ReactStrap

ReactStrap adalah koleksi komponen Bootstrap 4 yang diubah menjadi komponen reaktif yang boleh diguna semula. Sekiranya anda ingin memodenkan laman web lama Bootstrap anda, pustaka ini adalah sesuatu yang anda ingin lihat.

Reacto

Alat lain yang berkaitan dengan Reacto, Reacto adalah IDE dibina di atas Electron dan direka bentuk untuk membangunkan aplikasi web dengan ReactJS. Ini kelihatan sangat berguna jika pembangunan utama anda berkisar ReactJS.

PicoJS

Pustaka JavaScript yang membolehkan pengesanan muka. Ia berfungsi dengan foto pegun atau dari kamera bersepadu. Ia sangat menarik bagaimana teknologi web berkembang sejak beberapa tahun kebelakangan ini.