Laman » Reka Bentuk Web » Sumber Daya Segar untuk Pereka dan Pemaju Web (Jun 2015)

    Sumber Daya Segar untuk Pereka dan Pemaju Web (Jun 2015)

    Bolehkah anda percaya bahawa siri ini telah berjalan selama hampir 3 tahun? Dalam masa yang singkat, kami telah memaparkan sekurang-kurangnya 30 senarai sumber segar untuk pereka dan pemaju web. Dan kami akan teruskan ini dengan kompilasi baru untuk bulan Jun.

    Dalam kompilasi ini, kami akan melihat beberapa perpustakaan JavaScript untuk memaparkan slider, menatal yang lebih lancar untuk jadual data, kesan lif sejuk untuk butang skrol ke atas, dan banyak lagi.

    Mari kita periksa mereka.

    Tegaskan Sederhana

    Sederhana telah dipuji kerana reka bentuknya; susun atur dan UI nampaknya telah difikirkan dengan teliti. Di samping itu, ia juga memberi inspirasi kepada pemaju web untuk membangunkan perpustakaan JavaScript atau CSS untuk meniru UI. Sederhana Sederhana Sederhana adalah salah satu perpustakaan JavaScript yang menyerupai kotak pop timbul atau dialog dalam Medium.

    Penguin

    Penguin adalah kerangka depan baru yang boleh anda gunakan sebagai asas tapak web anda. Dengan alat seperti Grunt dan Sass, anda boleh dengan mudah menambah atau mengalih keluar perpustakaan atau CSS yang anda tidak perlukan daripada kerangka menjadikannya ringan. Ia juga merupakan alternatif yang baik untuk Bootstrap dan Foundation.

    Elevator.js

    Adakah anda melihat butang itu dalam laman web yang membolehkan anda meluncur ke bahagian atas halaman? Kebanyakan butang hanya membawa anda ke bahagian atas, tetapi dengan Elevator.js, anda mendapat kesan pecutan gelongsor yang serupa dengan lif, muzik, dan “Ding!” bunyi apabila anda telah sampai ke tingkat teratas. Sangat bagus!

    X-Instagram

    X-Instagram adalah elemen adat Polimer yang menarik dan menunjukkan imej dari Instagram dengan tag. Unsur ini menjadikan keseluruhan proses lebih mudah. Kami hanya menambah elemen seperti elemen HTML biasa dan nyatakan kata kunci tag sebagai atribut elemen.

      

    Dan biarkan sihir bermula!

    CamanJS

    CamanJS adalah perpustakaan JavaScript yang hebat untuk manipulasi imej. Ia dilengkapi dengan set ciri yang biasanya anda cari dalam editor imej. Anda boleh menukar imej kabur, hitam dan putih, dan juga meningkatkan kontras.

    ClusterizeJS

    Clusterize.js adalah perpustakaan JavaScript yang akan meningkatkan prestasi apabila berurusan dengan banyak data dalam jadual. Seperti yang anda tatal ke bawah meja dengan, katakan, 5000 dalam senarai, biasanya pengalaman akan berubah laggy dan jerky. Perpustakaan JavaScript ini akan menangani isu ini, menjadikan tindakan menatal berjalan lancar sepanjang perjalanan.

    Duduk Ujian

    Duduk Ujian adalah koleksi soalan untuk menilai kemahiran dan pengetahuan anda mengenai CSS3, HTML5, dan JavaScript. Setiap ujian diberi beberapa soalan dan masa yang terhad untuk menyelesaikan semua soalan ini. Ini adalah sumber yang baik untuk mengetahui betapa baiknya kita dengan bahasa-bahasa ini.

    Anak panah HTML

    Ini adalah koleksi simbol Unicode asli khas yang boleh anda benamkan dalam HTML dan CSS. Watak-watak ini termasuk Anak panah, Mata Wang, dan Tanda baca. Anda akan mendapati bahawa, kadang kala, anda tidak memerlukan ikon fon untuk memaparkan aksara tersebut.

    Keletihan

    Flickity adalah perpustakaan JavaScript untuk memaparkan carousels, galeri, atau slider di laman web anda. Ia dioptimumkan untuk skrin sentuh; anda boleh slaid carousels dengan mudah dengan jari, atau trackpad jika anda berada di komputer riba. Ia juga dilengkapi dengan sekumpulan Pilihan yang membolehkan penyesuaian penuh dalam apa jua cara yang anda suka.

    Typeslab

    Typeslab adalah alat yang berguna untuk membuat poster jenis Slab. Cukup tulis kandungan dan memilih fon, Typelab akan menjana poster dengan serta-merta. Anda boleh memuat turun atau menyiarkannya di Imgur.

    MatchMedia

    Matchmedia adalah perpustakaan yang mereplikasi pertanyaan media CSS. Perpustakaannya tidak begitu segar, tetapi ia adalah perpustakaan yang sangat berguna yang saya memutuskan untuk dimasukkan ke dalam senarai. Jika anda perlu melakukan skrip berdasarkan saiz paparan pengguna atau jenis media, ini adalah perpustakaan yang anda mahukan.

    Berikut adalah contoh yang digunakan untuk menjalankan skrip dalam saiz paparan 320px dan di bawah:

     jika (matchMedia ('skrin sahaja dan (max-width: 320px)'). matches)  

    Sass Burger

    Sass Burger datang dengan Mixin yang membolehkan anda mencipta “Hamburger” ikon dan mengubahnya menjadi tanda silang dengan kurang kerumitan.

    Marx

    Marx adalah koleksi peraturan gaya CSS untuk menjadikan gaya elemen lebih konsisten. Ia boleh disesuaikan (dengan Sass), ringan, dan berfungsi di luar kotak. Satu alternatif yang baik untuk alat reset CSS yang sudah popular seperti Normalize.css.

    CSS.js

    CSS.js digunakan untuk menghuraikan fail CSS untuk perisytiharan gaya. Perpustakaan pada mulanya digunakan untuk pasukan di Jotform untuk membina pengalaman WYSIWYG untuk penyuntingan borang dengan CSS. Sekarang mereka mempunyai sumber terbuka untuk kita semua gunakan. Layak menyimpan, sekiranya anda memerlukannya kemudian.