Sự tiến hóa của Javascript và những công cụ tương trợ ở Frontend

có mặt trên thị trường có mục đích là một các ngôn ngữ lập trình web ngôn ngữ sẽ được thực thi ở browsers phía client-side, trong giai đoạn phát triển hơn 20 năm, Javascript đã có một bước tiến thần kì lúc giờ đây nó được dùng cả trong việc xây dựng các xử lí ở phía server duyệt Node.js nữa. Không những thế, việc biên dịch được mã Javascript ở phía server-side là một câu chuyện hoàn toàn khác. Trong bài này, chúng ta sẽ tập kết vào thời kỳ phát triển của Javascript dưới vai trò là 1 ngôn ngữ được thực thi ở phía client-side (trên các browsers), cách mà nó đã tiến hóa để khiến cho các lập trình phía front-end đau đầu như thế nào.

ví như đã từng khiến cho việc mang Javascript ở dòng thời mà web còn sơ khai, bạn sẽ thấy cách để ứng dụng Javascript vào hệ thống web của bạn khá đơn giản: việc bạn cần khiến là tạo 1 file javascript với phần mở rộng là *.js và load vào html duyệt tag <script>. Hiện giờ, khiến việc với Javascript ở phía client-side ko còn đơn giản như vậy nữa. Bạn sẽ phải biết qua về thao tác cái lệnh (command-line), sử dụng webpack để đóng gói những file, tiêu dùng babel để transpile sourcecode cho tương hợp sở hữu những trình duyệt y cũ, minify sourcecode, quản lí packages, sử dụng task runners tương trợ,… mang quá đa dạng thứ can hệ làm bạn đau đầu ko biết chúng là gì và vai trò cụ thể của nó là gì.

Tham khảo =>>https://mindx.edu.vn/course/web-basic

Bài viết này ra đời sở hữu tiêu chí nói chung bí quyết sử dụng Javascript để lớn mạnh trang web, đi từ việc dùng “Javascript thuần” mà không mang bất kì dụng cụ gì tương trợ, cho tới việc vận dụng phần nhiều các công cụ tương trợ mới nhất hiện nay để mọi người với thể hình dong vai trò của từng thành phần trong ấy.

Thuở nguyên sơ trong việc dùng Javascript
Chúng ta hãy bắt đầu sở hữu việc sử dụng Javascript theo cách cổ điển nhất với thể. Khi đó, trang web của chúng ta chỉ đơn giản là những file html với nhúng javascript chuẩn y tag<script>, ví dụ file index.html của ta sẽ trông như sau:

Đoạn mã <script src='index.js'></script> đóng vai trò load một file javascript ở thư mục cộng cấp mang file html và thực thi nó ở trên browser khi trang web được load. Đây là hầu hết những gì ta cần phải làm cho để dùng được javascript bên trong trang web, rất thuần tuý và trực giác phải ko nào.

Hãy đi tới bước kế tiếp, ta cần thao tác sở hữu một đôi dữ liệu dạng mảng trong javascript, các hàm mang sẵn thì ko đủ có ích nên ta đành dùng thêm một thư viện bên ngoài là lodash để tương trợ. Thư viện lodash phân phối 1 số dụng cụ hữu dụng như so sánh 2 mảng chả hạn (trong javascript thuần không mang hàm này):

nghi vấn đặt ra là: vì lodash là 1 thư viện javascript được cung ứng bởi bên thứ 3, khiến thế nào để thêm lodash vào trang web của bạn? Hãy đi đến trang chủ của lodash và xem hướng dẫn:

Xem thêm =>> https://mindx.edu.vn/blog/post/python-la-gi

sở hữu chỉ dẫn này, ta thấy công tác phải khiến cũng khá là đơn giản: tải file lodash.js về máy và đặt trong thư mục source, sau đó dùng tag <script> để load file này vào trong trang web của ta. Lúc đó file index.html của ta sẽ trông như sau:

như vậy là ta đã mang thể dùng lodash thả phanh trong file index.js rồi:

Thật thuận lợi phải ko nào! Chỉ với 1 lưu ý là: để tiêu dùng được lodash trong file index.js, ta cần phải sử dụng tag <script> để load lodash lên trước lúc ta load file index.js (hoặc mang bất kì file javascript nào muốn tiêu dùng được lodash, ta cũng phải load ở phía sau).

tới đây, câu hỏi về việc làm cho thế nào để thêm một thư viện bên ngoài (3rd-party-library) đã được giải đáp. Một đôi phân tách tóm gọn như sau:

Điểm tốt: cách giải quyết này thuần tuý.
Điểm hạn chế: giả dụ ta cần update thư viện thì khắc phục như thế nào? Chả lẽ cứ phải download tay chân hay sao? Việc kiểm soát version của thư viện cũng hơi khó khăn.
Điểm tránh này tồn tại rất lâu, cho tới một ngày …

npm – bộ quản lí thư viện xuất hiện
Chúng ta đang nói về việc dùng javascript ở phía client-side. Không những thế, tới thời khắc này, ta buộc lòng phải đề cập qua về việc tiêu dùng javascript ở phía server-side một chút, mình sẽ giải thích “tại sao” ở những phần tiếp sau đây nhé. Bắt đầu có sự xuất hiện của Node.js vào năm 2009

Vào năm 2009, mang sự xuất hiện của Node.js, javascript giờ đây không những với thể biên dịch và chạy ở browser, mà nó còn với thể chạy được ở phía server-side phê chuẩn trình biên dịch là Node.js. 1 Năm sau ấy, npm ra đời với vai trò là một “công cụ quản lí package” cho những project Node.js. Khoan hãy đề cập về phương pháp mà javascript được thực thi bởi Node.js, ta sẽ xem cách thức mà npm quản lí package ra sao nhé:

Tóm lại
Chúng ta đã đi được một chặng tuyến phố khá dài đề cập từ khi bắt đầu, việc tiêu dùng javascript để lập trình phía frontend ngày nay đã phát triển thành phức tạp hơn hầu hết so sở hữu trước đây, điều này làm lập trình viên frontend cần phải biết thêm số đông kĩ năng và phương tiện để sở hữu thể khiến việc được. Tính từ lúc việc tiêu dùng file javascript được load thuần túy trong file html, sau đó ta tiêu dùng npm như là 1 phương tiện để kiểm soát các thư viện sử dụng ngoài. Để có thể dùng cú pháp import/export cởi mở, chúng ta đã phải vay mượn cú pháp của Node.js (hoặc mới hơn là ES6 đã hỗ trợ) và cần phải thực hiện đóng gói modules bằng webpack để với thể dùng được mã nguồn ở phía client-side. Việc ứng dụng Babel và Task runner vào cũng giúp chúng ta phổ thông hơn trong việc đảm bảo tính tương xứng cũng như giai đoạn build source code ra dạng production.

mặc dù sở hữu hồ hết những dụng cụ và định nghĩa mới mà lập trình viên phải học hỏi, tin phải chăng là giờ đây các công cụ này dần trưởng thành và ổn định hơn phổ quát so có thời gian trước đây. Việc hiểu được vai trò của từng công cụ cũng như lí do vì sao nó thành lập sẽ giúp bạn bắt nhịp được sở hữu thiên hướng ví như sở hữu các sự đổi mới xảy ra. Hi vẳng là nội dung tóm lược ngắn gọn này có thể giúp ích cho mọi người trong thời kỳ vững mạnh của mình.