Perpustakaan dan kerangka JavaScript yang hebat yang harus anda ketahui

JavaScript: evolusi bahasa rangkaian dan ekosistemnya yang berterusan

JavaScript telah dilahirkan selama lebih dari 20 tahun dan terus berkembang. Dalam tahun-tahun kebelakangan ini, perkembangannya telah sangat pantas, dan ia membuatkan orang tertanya-tanya sama ada teknologi javascript depan yang popular hari ini akan kekal penting dalam beberapa tahun.

Walau bagaimanapun, adalah penting untuk mempunyai alat dan rangka kerja terkini untuk meningkatkan kecekapan pembangunan. Artikel ini akan meneroka beberapa perpustakaan, rangka kerja, dan alat JavaScript utama yang perlu anda pelajari sekarang.

Indeks Perpustakaan dan Rangka Kerja yang diliputi oleh artikel ini:

bingkai

• Bertindak balas
• Vue
• Ember.js
• Sudut
• Next.js
• Svelte
• Ionik
• Gatsby
• Meteor.js
• Menyatakan

Perpustakaan

• jQuery
• Chart.js
• Tiga.js
• D3
• Anime.js

Pelari tugas

• Gulp
• Eslint
• Babel
• Mengerang
• Webpack

Alat ujian

• Jest
• Jasmine
• Mocha

Pengenalan

Ekosistem JavaScript telah berkembang dan mempunyai perpustakaan sendiri, kerangka, alat, pengurus pakej dan bahasa baru yang disusun menjadi JavaScript. Menariknya, NPM adalah pengurus pakej de facto untuk JavaScript dan juga merupakan pusat pendaftaran perisian terbesar di dunia. Dikatakan dari artikel di Linux.com pada Januari 2017:

Pendaftaran NPM mempunyai lebih daripada 350,000 pakej, lebih daripada dua kali ganda bilangan pendaftaran pakej yang paling popular seterusnya (Apache Maven Repository). Malah, ia kini merupakan pusat pendaftaran pakej terbesar di dunia.

Dalam masa lapan bulan, pendaftaran NPM mempunyai kira -kira 500,000 pakej. Ini adalah peningkatan yang besar berbanding dengan gudang pakej lain.

Sebagai pemaju JavaScript front-end, adalah penting untuk bersaing dengan alat dan perpustakaan JavaScript moden. Apabila teknologi menjadi popular, permintaan untuknya akan tinggi, yang seterusnya bermakna lebih banyak pekerjaan pengekodan yang tinggi. Oleh itu, saya menyusun senarai teknologi JavaScript yang popular yang saya fikir anda perlu tahu.

bingkai

Rangka kerja ini mempunyai seni bina yang menentukan aliran kawalan aplikasi. Rangka kerja ini menerangkan struktur kerangka dan memberitahu anda bagaimana untuk mengatur segala -galanya. Fungsi asas yang diperlukan untuk memulakan dan menjalankan aplikasi juga disediakan oleh rangka kerja. Di samping itu, anda mesti mengikuti prinsip reka bentuk dan corak rangka kerja. Perbezaan antara kerangka dan perpustakaan ialah anda memanggil perpustakaan, dan kerangka itu memanggil anda.

Rangka kerja biasanya mengandungi banyak perpustakaan dan mempunyai tahap abstraksi yang lebih tinggi. Rangka kerja ini mempunyai fungsi terbina dalam seperti pemprosesan acara, panggilan Ajax, templat dan pengikatan data, dan ujian.

Bertindak balas

React adalah perpustakaan JavaScript yang dibina oleh pemaju Facebook dan Instagram. React telah dinilai sebagai salah satu teknologi yang paling popular untuk pemaju.

Jadi, mengapa React begitu popular? Dengan React, anda boleh membuat UI interaktif menggunakan kaedah deklaratif , dan anda boleh mengawal keadaan permohonan anda dengan mengisytiharkan bahawa "pandangan harus kelihatan seperti ini." Ia menggunakan model berasaskan komponen di mana komponen adalah elemen UI yang boleh diguna semula, masing-masing dengan keadaannya sendiri.

React menggunakan DOM maya, jadi anda tidak perlu bimbang tentang memanipulasi DOM secara langsung. Ciri-ciri penting lain React termasuk aliran data sehala, sintaks JSX pilihan, dan alat baris arahan untuk membuat projek React dengan konfigurasi sifar membina.

Sudut

Angular pernah menjadi teknologi JavaScript yang paling popular di kalangan pemaju front-end. Ia masih digunakan secara meluas dan disokong oleh Google serta komuniti individu dan korporat.

Beberapa ciri sudut termasuk:

• Gunakan TypeScript dan bukannya JavaScript sebagai bahasa lalai
• Senibina berasaskan komponen
• Prestasi yang lebih baik pada platform mudah alih dan web
• Alat dan pilihan perancah yang lebih baik

Vue.js

Mencari kerangka JavaScript terbaik untuk pemula? Rangka kerja Vue.js telah sangat popular pada tahun -tahun kebelakangan ini. Setakat bintang GitHub, ia juga merupakan kerangka JavaScript yang paling popular di GitHub. Vue mendakwa sebagai rangka kerja yang kurang sewenang -wenang, jadi mudah bagi pemaju untuk memahami. Sintaks templat berasaskan HTML Vue mengikat DOM yang diberikan untuk data.

Rangka kerja ini memberikan pengalaman seperti reaksi, dengan komponen maya dan komponen yang boleh digunakan semula yang boleh digunakan untuk membuat widget dan keseluruhan aplikasi web. Di samping itu, anda boleh menulis fungsi rendering secara langsung menggunakan sintaks JSX. Apabila keadaan berubah, Vue.js menggunakan sistem reaktif untuk menentukan perubahan yang telah berlaku dan membuat semula jumlah komponen yang paling sedikit. Vue.js juga menyokong integrasi mudah perpustakaan lain.

Next.js

Next.js memanggil dirinya sebagai "Rangka Kerja React untuk Persekitaran Pengeluaran", ia adalah rangka kerja berasaskan React yang menambah ciri-ciri baru, termasuk penjanaan laman web pelayan dan statik. React adalah pakej JavaScript yang biasanya digunakan untuk membuat aplikasi web yang diberikan menggunakan JavaScript dalam penyemak imbas klien. Ia memberi anda pengalaman pembangunan terbaik, dan semua ciri yang anda perlukan dalam persekitaran pengeluaran.

### Ember.js

Ember.js adalah rangka kerja JavaScript yang membantu pemaju membina aplikasi web tunggal halaman yang berskala dengan memanfaatkan bahasa, amalan terbaik, dan corak dari corak ekosistem aplikasi tunggal yang sedia ada. Ia membolehkan pembangunan aplikasi JavaScript pelanggan dengan menyediakan penyelesaian yang komprehensif termasuk pengurusan data dan aliran aplikasi. Jika anda mencari kerangka JavaScript terbaik untuk pemula, ini adalah pilihan yang hebat.

Svelte

Tidak seperti kerangka tradisional seperti React dan Vue di mana kebanyakan kerja mereka dilakukan dalam penyemak imbas, Svelte memindahkan kerja -kerja ini ke langkah -langkah penyusunan ketika membina permohonan. Ini menjadikannya pilihan yang berguna untuk pembangunan antara muka pengguna.

Ionik

Ionic adalah rangka kerja sumber percuma dan terbuka yang menyediakan satu suite komponen UI yang dioptimumkan mudah alih, gerak isyarat dan alat untuk membuat aplikasi berkelajuan tinggi, sangat interaktif. Ia membolehkan anda membuat aplikasi mudah alih hibrid.

### Gatsby

Penjana laman web statik sumber terbuka ini dibina menggunakan teknologi Webpack dan GraphQL dan dibina di atas kerangka pembangunan front-end React. Anda boleh menggunakan Gatsby untuk membuat aplikasi web progresif, serta laman web statik yang cepat dan selamat. Ia digunakan oleh banyak organisasi terkenal seperti Tinder, Snapchat dan mengesahkan, dan sangat cepat dan fleksibel ketika membina laman web.

Meteor.js

Meteor.js adalah rangka kerja JavaScript percuma untuk membangunkan aplikasi web dan mudah alih. Meteor mudah dan popular dan mempunyai UI reaktif. Jika anda seorang pemaju yang berpengalaman, maka anda harus mencuba meteor.js. Ia mempunyai proses pembangunan yang cepat dan mudah.

Meteor amat sesuai untuk menulis aplikasi stack penuh dengan asas kod bersama antara pelanggan dan pelayan.

Menyatakan

Express adalah alat yang popular dan berkuasa untuk menulis kod sisi pelayan untuk sebarang aplikasi web. Ia adalah sumber percuma dan terbuka. Ia digunakan untuk merekabentuk dan membuat aplikasi web dengan cepat dan mudah.

Perpustakaan

Cara terbaik untuk memahami perpustakaan JavaScript (perpustakaan JS) adalah menggunakannya. Perpustakaan adalah coretan kod yang boleh diguna semula yang menyediakan fungsi khusus. Ia adalah koleksi fungsi, objek, dan kelas yang boleh anda gunakan untuk aplikasi anda. Perpustakaan abstrak lapisan yang berbeza, jadi anda tidak perlu bimbang tentang butiran pelaksanaan mereka.

Tertanya -tanya tentang "Perpustakaan JavaScript yang harus saya gunakan?" Walau bagaimanapun, ia tidak menetapkan sebarang kekangan struktur yang mengehadkan bagaimana anda menggunakan perpustakaan. Mencari perpustakaan JavaScript yang paling biasa? Mulakan dengan perpustakaan JavaScript yang mudah. Perhatikan bahawa perpustakaan JavaScript asas yang popular termasuk:

jQuery

Mencari perpustakaan JavaScript terbaik untuk belajar? JQuery adalah salah satu perpustakaan JavaScript yang paling biasa. Ia adalah perpustakaan yang menjadikan JavaScript lebih mudah digunakan dan menjadikan manipulasi DOM lebih mudah daripada sebelumnya. Kurva pembelajaran mudah JQuery dan sintaks yang mudah digunakan telah menghasilkan generasi baru pemaju klien. Beberapa tahun yang lalu, JQuery dianggap sebagai penyelesaian yang boleh dipercayai untuk membina laman web yang mantap dengan sokongan silang pelayar. Ciri -ciri utama jQuery, seperti operasi DOM, pemprosesan acara, dan membuat panggilan AJAX berdasarkan pemilih CSS, telah mempromosikan popularitinya.

Walau bagaimanapun, perkara telah berubah dan persekitaran JavaScript sentiasa berkembang. Beberapa ciri JQuery telah dimasukkan ke dalam spesifikasi ECMAScript yang lebih baru. Di samping itu, perpustakaan dan rangka kerja baru yang digunakan hari ini mempunyai kaedah asli untuk mengikat DOM, jadi teknik operasi DOM biasa tidak lagi diperlukan. JQuery merosot populariti, tetapi saya tidak fikir ia akan hilang dalam masa terdekat. Sila periksa ini untuk memulakan dengan perpustakaan JavaScript (atau perpustakaan JS).

D3: Dokumentasi yang didorong oleh data

D3 (atau D3.js) adalah perpustakaan JavaScript yang kuat untuk menghasilkan visualisasi interaktif menggunakan piawaian web seperti SVG, HTML, dan CSS. Tidak seperti perpustakaan visual yang lain, D3 memberikan kawalan yang lebih baik ke atas kesan visual akhir.

D3 berfungsi dengan mengikat data ke DOM dan kemudian menukar dokumen. Ia juga mempunyai ekosistem sendiri, yang mengandungi plugin dan perpustakaan yang memperluaskan fungsi asasnya. Perpustakaan telah wujud sejak tahun 2011 dan mempunyai banyak dokumentasi dan tutorial untuk memulakan anda.

### Chart.js

Perpustakaan JavaScript yang indah ini direka untuk membolehkan pemaju dan pereka dengan mudah memvisualisasikan data menggunakan JavaScript. Chart.js adalah salah satu pakej visualisasi data yang paling banyak digunakan dan salah satu pakej yang paling mesra pengguna. Dengan hanya sedikit kod, carta.js boleh membuat visualisasi interaktif yang boleh digunakan untuk data anda. Ini adalah salah satu perpustakaan JavaScript terbaik untuk belajar.

Anime.js

Dengan perpustakaan animasi anime.js yang mudah dan berkuasa, anda boleh membuat pelbagai animasi pada sifat CSS serta imej SVG dan sifat DOM. Anda boleh membaca lebih lanjut mengenai anime.js di sini:

Tiga.js

Tiga.js adalah perpustakaan JavaScript untuk membuat dan menghidupkan imej komputer tiga dimensi dalam pelayar web. Ia adalah satu fail JavaScript yang mengandungi kesan, tetapan, kamera, pencahayaan, bahan, model, shaders, animasi, dan objek 3D.

alat

Alat adalah satu set rutin yang membantu anda dengan proses pembangunan. Tidak seperti perpustakaan, alat biasanya melaksanakan tugas pada kod klien. Ia mengambil kod anda sebagai input, melakukan tugas di atasnya, dan kemudian mengembalikan output. Alat yang biasa digunakan termasuk penterjemah dan membina alat, pemampat aset, bundlers modul, dan alat perancah.

Pelari tugas umum

Pelari Tugas Universal adalah alat yang digunakan untuk mengautomasikan tugas berulang -ulang tertentu. Pelari tugas umum yang popular termasuk:

Gulp

Gulp adalah toolkit JavaScript yang digunakan sebagai pelari tugas dan membina sistem dalam pembangunan web. Tugas berulang seperti kompilasi, pemampatan kod, pengoptimuman imej, ujian unit, dan pemeriksaan kod hendaklah automatik. Malah bagi mereka yang tidak begitu akrab dengan JavaScript, Gulp membuat proses menulis tugas lebih mudah.

Gulp menggunakan saluran paip untuk menstrim data dari satu pemalam ke yang lain, dan hasil akhir adalah output ke folder sasaran. Berbanding dengan Grunt, Gulp melakukan lebih baik kerana ia tidak membuat fail sementara untuk menyimpan hasil pertengahan, dengan itu mengurangkan jumlah panggilan I/O.

### Grunt

Runner Tugas dan Alat Automasi Grunt mempunyai antara muka baris arahan yang membolehkan anda menjalankan tugas-tugas tersuai yang ditakrifkan dalam fail bernama Gruntfile. Grunt mempunyai beribu -ribu plugin untuk dipilih, yang harus meliputi tugas berulang yang paling biasa yang akan anda hadapi. Dengan Grunt, anda boleh menjalankan semua tugas dengan satu arahan, yang memudahkan kerja anda.

### npm

Gulp dan Grunt memerlukan anda menghabiskan masa belajar dan menguasai alat baru, yang memerlukan masa. Anda boleh mengelakkan menambah kebergantungan tambahan kepada projek anda dengan memilih alternatif yang telah dibundel dengan Node.js. Walaupun NPM lebih dikenali sebagai pengurus pakej, skrip NPM boleh digunakan untuk melaksanakan sebahagian besar tugas yang disebutkan di atas.

### Eslint

Eslint adalah alat JavaScript yang boleh dimasukkan yang menganalisis kod anda untuk masalah yang boleh menyebabkan kesilapan atau ketidakkonsistenan.

### Prettier

Prettier adalah formatter kod dengan pendapat yang kuat. Ia menguatkuasakan gaya yang konsisten dengan menganalisis kod anda dan mencetak semula kod terhadap piawaiannya yang mengambil panjang garis maksimum dan memecahkan kod yang diperlukan. Ia berfungsi dalam pelbagai bahasa dan boleh diintegrasikan dengan beberapa editor kegemaran anda.

### Webpack

Menggunakan Bundler Modul Webpack, anda boleh membungkus fail JavaScript untuk penyemak imbas anda, dan Webpack juga boleh mengubah suai dan membungkus gaya dan aset anda.

### Babel

Babel adalah pengkompil JavaScript sumber terbuka percuma yang menukarkan ciri bahasa baru ke dalam ciri bahasa lama. Ia juga dipanggil "penterjemah". Jika anda hanya menggunakan bundler, sesiapa sahaja boleh menulis kod yang menggunakan semua ciri JavaScript moden, tetapi berjalan pada pelayar yang lebih tua.

### Alat ujian

Ujian adalah proses mengesahkan dan mengesahkan bahawa permohonan memenuhi keperluan perniagaan dan teknikal yang diharapkan. Kaedah pembangunan yang didorong oleh ujian juga membantu mengesan kesilapan dan harus dipertimbangkan sebagai sebahagian daripada timbunan pembangunan depan moden.

Jest

Jest adalah rangka kerja ujian yang agak baru yang ditulis oleh Facebook dan popular dengan komuniti React. Terdapat salah tanggapan yang meluas bahawa Jest direka khusus untuk digunakan dengan React;

Walaupun Jest mungkin dianggap sebagai pelari ujian spesifik reaksi, ia sebenarnya merupakan platform ujian sejagat yang boleh menyesuaikan diri dengan mana-mana perpustakaan atau rangka kerja JavaScript. Anda boleh menggunakan jest untuk menguji mana -mana kod JavaScript.

Kelebihan terbesar menggunakan JEST ke atas suite ujian lain ialah anda hanya memerlukan konfigurasi sifar atau konfigurasi minimum untuk memulakan ujian menulis. Rangka kerja ini mempunyai perpustakaan dakwaan terbina dalam dan menyokong penggunaan fungsi mock atau mata-mata.

Jest mempunyai ciri yang dipanggil ujian snapshot yang membolehkan anda memastikan bahawa UI aplikasi anda tidak berubah tanpa diduga. Pemaju Facebook dan penyumbang lain telah melabur banyak kerja pada projek ini sejak kebelakangan ini, jadi tidak akan mengejutkan jika Jest menjadi kerangka ujian JavaScript yang paling popular pada tahun -tahun akan datang.

Mocha

Rangka kerja ujian JavaScript ini mempunyai sokongan penyemak imbas, sokongan asynchronous termasuk janji, pelaporan liputan ujian, dan API JavaScript untuk menjalankan ujian. Mocha biasanya digunakan dengan perpustakaan pernyataan seperti chai, harus.js, jangkaan.js, atau lebih baik kerana ia tidak mempunyai perpustakaan pernyataan itu sendiri.

Jasmine

Jasmine adalah rangka kerja ujian yang didorong oleh tingkah laku untuk JavaScript. Jasmine direka untuk menjadi penyemak imbas, platform dan rangka kerja-agnostik. Jasmine mempunyai perpustakaan dakwaan sendiri yang dipanggil Matchers, yang memberikan sintaks yang bersih dan mudah dibaca. Jasmine tidak mempunyai pelari ujian terbina dalam, anda mungkin perlu menggunakan pelari ujian tujuan umum seperti karma.

Meringkaskan

JavaScript, bahasa web, telah mengekalkan kaitannya sejak penubuhannya pada tahun 1995. Ia mungkin tetap seperti ini selagi penyemak imbas tidak memutuskan untuk menggantikannya dengan bahasa lain. Walaupun terdapat banyak bahasa lain yang disusun untuk JavaScript, tiada bahasa skrip lain akan menggantikan JavaScript untuk masa depan yang boleh dijangka. Kenapa? Kerana JavaScript telah menjadi terlalu popular untuk diganti.

Persekitaran JavaScript pasti berkembang, seperti yang dapat dilihat dalam trend semasa dalam pembangunan web. Perpustakaan dan kerangka lama telah digantikan oleh teknologi baru. Generasi baru perpustakaan, rangka kerja dan alat baru muncul dan mendapat penerimaan yang meluas.

Artikel ini telah dikemas kini dan termasuk sumbangan dari Ezekiel Lawson. Ezekiel adalah pemaju front-end yang memberi tumpuan kepada menulis kod yang bersih, boleh dikekalkan menggunakan teknologi web seperti JavaScript, Vue.js, HTML, dan CSS.

Atas ialah kandungan terperinci Perpustakaan dan kerangka JavaScript yang hebat yang harus anda ketahui. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!