Tuấn Đỗ

Engineer

Posts

Tích hợp dự án React vào dự án Angular khác

October 25, 2021

Chắc có lúc bạn sẽ thắc mắc là có cách nào để gắn một dự án được phát triển bằng React vào một dự án được phát triển bằng Angular được không? Và câu trả lời là có thể và rất đơn giản nhé. Demo: https://micro-frontends.tuando.net/demo/angular-react Source code: https://github.com/dotuan9x/micro-frontends/tree/master/angular-react Tạo một project React đơn giản # Khai báo một HTML Custom Element phục vụ cho việc render bên project container ...

Hướng dẫn cấu hình Webpack đơn giản

August 15, 2021

Webpack là gì? # Webpack hiểu đơn giản là một công cụ giúp chúng ta đóng gói (bundle) các tài nguyên như js, css, images, fonts… thành một file hoặc nhiều file theo cách có tổ chức, gọn gàng, sạch sẽ, thơm tho… Link trang chủ: https://webpack.js.org/ Tại sao nên sử dụng Webpack? # Đóng gói nhiều file JS, CSS thành một file duy nhất, điểm đặc biệt là Webpack sẽ tổ chức nội dung trong các file một cách khoa học hợp lí Gói gọn các file JS và CSS thành dạng minify (nội dung file là một dòng duy nhất, loại bỏ các khoảng trống thừa hay comment trong code giúp file nhỏ gọn nhất) Thực thi các file SCSS một cách tự động, nếu bạn nào làm việc nhiều với SCSS thì chắc chắn sẽ thích tính năng này Tối ưu hóa Images, SVG, nén các file với dung lượng nhỏ nhất, hoặc chuyển đổi file thành URL (Base64) và chèn URL này vào Bundle Giúp thao tác local, development hay server một cách thuận tiện như tự động loading (build) khi save, hay kiểm soát quá trình upload file tránh sai sót… Cài đặt hàng loạt ứng dụng một cách đơn giản: SCSS, ReactJS… Hàng loạt tính năng khác chờ bạn khám phá: biên dịch Babel ES6 sang ES5, biên dịch CoffeeScript sang Javascript, tách nhỏ thành nhiều file… Và quan trọng là webpack hoàn toàn miễn phí Hướng dẫn cấu hình webpack đơn giản # https://viblo. ...