Rất chào các bạn, Như các bạn đã biết, trong kỉ nguyên công nghệ, song song với sự sinh ra dày đặc của các trang web mới cũng là sự biến mất của những trang web "lạc hậu" hay hoạt động kém hiệu quả. Một trang web hấp dẫn người dùng luôn có cách cung cấp nội dung hiệu quả, sáng tạo, dễ dàng nắm bắt; và các bức ảnh chất lượng, thú vị là cách tốt nhất để thực hiện điều...
Happy New Year HTML javascipt best tips Front-end
Hi xin chào các bạn, tiếp tục chuỗi chủ đề về cái thằng JavaScript này, hôm nay mình sẽ giới thiệu cho các bạn một số thủ thuật hay ho khi làm việc với chuỗi trong JavaScript có thể bạn đã hoặc chưa từng dùng. Cụ thể như nào thì hãy cùng mình tìm hiểu trong bài viết này nhé (go) 1. Sao chép một chuỗi nhiều lần Thay vì phải gõ 1 chuỗi lặp đi lặp lại thì bạn có thể sử dụng method...
Front-end JavaScript
Hầu hết các lập trình viên web thường làm việc với Chrome. Theo Wikipedia, khoảng 65% người dùng internet thường xuyên sử dụng Chrome, đây là một trong những lý do tại sao các nhà phát triển chọn Chrome để phát triển ứng dụng. Vì vậy, nếu bạn là một lập trình viên web nói chung và front-end nói riêng thì khả năng cao bạn sẽ làm việc với Chrome nhiều, do đó sau đây mình sẽ giới thiệu cho các...
Happy New Year Front-end
Dạo này ăn dầm nằm dề với "nàng" React nhiều quá, lắm khi không ngóc đầu lên được. Ông bà ta có câu "Chán cơm thèm phở", nên lang thang trên các blog để mong tìm được 1 chút thú vui khác React đã khá quen thuộc, thì vô tình thấy một frameworkJS là MithrilJS, tuy nó chưa quá nổi tiếng trên cộng đồng Frontend, nhưng đọc lướt qua phần giới thiệu lại thấy khá ấn tượng... 1....
Happy New Year Front-end JavaScript
1. Giới thiệu CSS Grid là một cách mới để tạo bố cục hai chiều trên web. Chỉ với một vài dòng CSS, bạn có thể tạo một lưới mà trước đây khó có thể thực hiện được nếu không có JavaScript. Không có plugin hoặc cài đặt phức tạp, không có tệp bổ sung nặng, không có nhiều giới hạn thiết kế do chỉ có 12 cột. 2. Có thể dùng những dạng lưới nào ? Bạn có thể tìm thấy tổng quan tốt...
Front-end Responsive
Chúng ta sẽ cùng nhau tìm hiểu 3 kiểu hiển thị phần tử trong CSS đó là Block, Inline và Inline-block xem chúng có gì khác nhau nhé ! Trước khi vào bài viết thì giả sử chúng ta có đoạn mã HTML như sau: <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- displays site properly based on user's device --> <link rel="stylesheet" href="main.css"> ...
HTML Front-end CSS
Hi các bạn, tiếp tục chuỗi chủ đề bàn luận về JavaScript hôm nay mình sẽ tiếp tục chia sẻ đến các bạn các thủ thuật khi làm việc cùng JS để tối ưu hóa hiệu suất công việc cũng như tạo các "helpers" xịn xò nhất để sẵn sàng đánh chiếm các dự án lớn. Cụ thể như nào thì hãy cùng kéo xuống dưới để tìm hiểu cùng mình nhé (go) 1. Lọc các giá trị unique trong mảng Trong ES6...
Front-end JavaScript May Fest
Hi xin chào các bạn, lâu rồi không có chủ đề gì bàn về CSS, trong một ngày thời tiết nóng nực thế này chúng ta sẽ cùng thư giãn với một chút CSS cho mềm mại nhé =)). Chủ đề hôm nay mình muốn giới thiệu đến các bạn đó là hiệu ứng Skeleton khi tải trang. Chắc chắn khi sử dụng các app lớn như Facebook, Youtube,... bạn cũng đã gặp nó rồi. Skeleton hiểu đơn giản là một bộ khung được...
Front-end CSS3 May Fest
CSS Box-sizing Xin chào các bạn, hôm nay mình sẽ tìm hiểu về thuộc tính Box-sizing của css. Để hiểu rõ tính ứng dụng, cũng như tác dụng của nó khi thêm vào thì mình xin đưa ra một ví dụ như sau: Mình sẽ tạo 1 thẻ <div class="box">Đây là nội dung bài viết</div> Thêm luôn cho nó css: .box{ width: 100px; height: 100px; color: white; background-color: darkorchid; } Bây giờ mình muốn thêm...
Front-end CSS ReactJS SCSS Box-sizing
Xin chào mọi người! Hôm nay mình sẽ giới thiệu cơ bản về lifecyle của component trong reactjs, gồm các giai đoạn nào và mỗi giai đoạn sẽ gọi những hàm gì? Hy vọng sẽ được thảo luận cùng anh em. Life cycle là gì? Là vòng đời của một sự vật từ khi sinh ra, lớn lên đến khi mất đi. Lưu ý: Life cyles trong bài này cho class component, việc hiểu rõ life cycle rất quan trọng để hiểu rõ cách hoạt...
Front-end ReactJS basic reactjs
Hi anh em, Hôm nay chúng ta sẽ cùng nhau tìm hiểu cách routing trong reactjs qua thư viện react-router-dom. Hy vọng được thảo luận cùng anh em đang học reactjs. Không để mọi người chờ lâu, bắt đầu nào! Tại sao phải cần tìm hiểu về routing? Khi chúng ta truy cập 1 trang web. Nhập đường dẫn url sẽ load(render) ra các trang(Component) tương tứng. Để làm được điều này ta cần quản lý routing trong ứng dụng...
Front-end ReactJS basic reactjs react-router-dom routing trong reactjs
Hi, xin chào bác bạn, chắc hẳn trong quá trình làm việc với JavaScript bạn sẽ gặp phải nhiều tình huống bắt buộc phải clone 1 array sang array mới để không làm ảnh hưởng đến dữ liệu của array gốc. Vậy trong trường hợp đó bạn thường dùng cách nào ? hãy cùng mình tìm hiểu qua bài viết dưới đây để xem liệu có bao nhiêu cách có thể clone 1 array nhé (go) Trong JavaScript ta hay nghe nói đến 2...
Front-end JavaScript
Trường hợp lỗi hiển thị Ví dụ khi chúng ta muốn hiển thị giá trị trong object ra template <template> <p>{{ data.user.name }}</p> </template> Trong trường hợp này nếu thuộc tính user không tồn tại, trình duyệt sẽ báo lỗi Error in render: "TypeError: Cannot read property 'name' of undefined" Và nó có thể khiến cho một một số component của thư viện UI không hiển thị, vậy nên có một cách đó là...
Front-end JavaScript frontend VueJS Webpack
Tại sao cần sử dụng Khi chúng ta muốn hiển thị giá trị trong object ra template <template> <p>{{ data.user.name }}</p> </template> Trong trường hợp này nếu thuộc tính user không tồn tại, trình duyệt sẽ báo lỗi Error in render: "TypeError: Cannot read property 'name' of undefined" Và nó có thể khiến cho một một số component của thư viện UI không hiển thị, vậy nên có một cách đó là check if...
Front-end JavaScript frontend VueJS Webpack
Tại sao cần sử dụng Khi chúng ta muốn hiển thị giá trị trong object ra template <template> <p>{{ data.user.name }}</p> </template> Trong trường hợp này nếu thuộc tính user không tồn tại, trình duyệt sẽ báo lỗi Error in render: "TypeError: Cannot read property 'name' of undefined" Và nó có thể khiến cho một một số component của thư viện UI không hiển thị, vậy nên có một cách đó là check if...
Front-end JavaScript frontend VueJS Webpack
Tại sao cần sử dụng Khi chúng ta muốn hiển thị giá trị trong object ra template <template> <p>{{ data.user.name }}</p> </template> Trong trường hợp này nếu thuộc tính user không tồn tại, trình duyệt sẽ báo lỗi Error in render: "TypeError: Cannot read property 'name' of undefined" Và nó có thể khiến cho một một số component của thư viện UI không hiển thị, vậy nên có một cách đó là check if...
Front-end JavaScript frontend VueJS Webpack
Như chúng ta đã biết, props trong Vuejs là phương pháp truyền dữ liệu trực tiếp từ component cha xuống component con một cách nhanh chóng và hiệu quả. Thông thường, chúng ta hay sử dụng props để truyền dữ liệu dạng string, object, array, number, boolean… mà ít khi để ý rằng props cũng có thể truyền một hàm logic. Sử dụng props truyền logic có nhiều lợi ích trong việc phát triển code như việc tăng khả...
Front-end JavaScript frontend VueJS HTML5