Sumberdaya Segar untuk Desainer dan Pengembang Web (Maret 2016)

Dalam angsuran terakhir kami, kami fokus pada berbagai pustaka Javascript dan CSS untuk membantu membangun situs web dan aplikasi web yang lebih baik. Bulan ini, kami memiliki lebih banyak perpustakaan untuk direkomendasikan bersama dengan fokus kecil pada tipografi.

Dalam seri seri ini, Anda akan melihat beberapa perpustakaan JS yang akan Anda gunakan tetapi juga kumpulan tips, esai yang sangat panjang tentang tipografi, generator warna dan kerangka frontend yang ringan. Tanpa basa-basi lagi, mari kita periksa.

Klik untuk Lebih Banyak Sumber Daya

Temukan seluruh koleksi sumber daya kami yang direkomendasikan dan alat desain dan pengembangan web terbaik yang tersedia.

Tips JS

JS Tips adalah kumpulan tips JavaScript, beberapa di antaranya berputar sintaksis, beberapa tentang efisiensi dan kinerja kode, dan beberapa lainnya khusus untuk kerangka kerja seperti AngularJS. Kiat baru ditambahkan setiap hari dan saat ini ada 50 kiat yang dikeluarkan. Itu pada dasarnya bookmark harus situs untuk setiap pengembang web.

Manajer Vagrant

Manajer Vagrant adalah aplikasi GUI untuk mengontrol Vagrant. Mirip MAMP, di mana Anda dapat menghentikan atau menjalankan Vagrant, dan melihat mana Vagrant sedang berjalan. Aplikasi ini tersedia untuk OS X dan untuk windows. Jika Anda tidak yakin apa itu Vagrant, lihat posting kami sebelumnya tentang Cara menginstal WordPress secara lokal dengan Vagrant.

Bulma

Bulma adalah kerangka kerja frontend. Paket termasuk beberapa komponen UI umum dari web seperti navigasi, dropdown, dan (tentu saja) kisi yang sepenuhnya dibangun dengan Flexbox. Satu-satunya fitur yang hilang (setidaknya, untuk saat ini) adalah komponen JavaScript. Komponen Bulma jauh lebih ramping dibandingkan dengan Bootstrap, tetapi harus cukup untuk membangun situs web yang kecil namun rapi.

Gutenberg

Dinamai setelah Johannes Gutenberg, penemu pers massa. Gutenberg adalah koleksi aturan gaya untuk pengaturan tipografi yang tepat di web. Aturan gaya mengatur garis dasar, ukuran dan penskalaan font, dan tinggi garis. Pustaka gaya yang hebat untuk membuat konten situs web Anda terlihat jauh lebih baik.

OkayNav

OkayNav adalah jQuery untuk membangun navigasi yang responsif, tetapi bukan hanya yang lain. Plugin memiliki pandangan yang sedikit berbeda pada desain responsif: karena viewport diubah ukurannya menjadi lebih kecil, setiap menu akan menjadi bertahap digabung dalam ikon untuk mentoleransi ukuran viewport terbatas. Kedengarannya keren, bukan?

Tipografi Web Baru

Itu Tipografi Web Baru adalah esai yang membuka mata tentang tipografi. Ini membahas gaya dari masa awal buku hingga cara kita saat ini membangun dan mengkonsumsi di web. Diteliti dengan baik dengan banyak ilustrasi, dan sepenuhnya direferensikan, ini adalah artikel yang panjang oleh Robin Rendle, tapi pasti layak dibaca untuk mendapatkan pemahaman yang lebih baik tentang tipografi.

Warna Aman

Warna Aman adalah palet penghasil warna untuk web. Tidak seperti alat yang telah kami sebutkan sebelumnya dalam seri ini, ColorSafe hanya akan menghasilkan warna yang sesuai dengan standar WCAG untuk aksesibilitas warna.

Dialog Modal yang Dapat Diakses

Ini adalah perpustakaan JavaScript kecil (hanya ~ 0.5kb) untuk membangun jendela dialog modal. Karena dapat diakses, pengguna dapat dengan mudah membuka, menutup, dan menavigasi melalui dialog dengan keyboard dan mouse. Paket ini sederhana JavaScript, tanpa stylings, sehingga Anda dapat dengan bebas membentuk modal dialog dengan cara apa pun yang Anda suka.

Mo.js

Mo.js adalah paket lengkap perpustakaan animasi JavaScript. Muncul dengan beberapa preset sehingga Anda dapat mengatur dan menjalankan animasi dengan cepat. Ini modular, memungkinkan Anda untuk menghapus fungsionalitas yang tidak perlu, serta cairan dan halus. Menjadi perpustakaan baru yang baru, sayangnya, dokumentasinya belum siap (untuk saat ini).

Partikel

Perpustakaan ini menambahkan jaringan partikel mengambang di situs web Anda, hanya untuk membuat situs web Anda terlihat lebih keren secara instan. Partikel-partikel akan bereaksi terhadap pergerakan kursor. Reaksi serta elemen lain seperti warna, jarak, dan bentuk dapat dikonfigurasi melalui opsi.