
Làm quen với MithrilJS - Phần 2
Tiếp tục loạt bài thú vị về framework không ai xài Các hooks trong vòng đời của vnode và component Trong bài viết trước mình đã nói sơ về vnode, là cách thức mithril xây dựng cây DOM trong trang. Bạn dùng hàm m(selector, attributes, children) để tạo ra vnode. // <h1 class="title" ...

[Trở lại cơ bản] DOM attribute và property
Trong loạt bài Trở lại cơ bản này mình xin trình bày lại các khái niệm cơ bản về tất cả mọi thứ mình đã từng được học bằng ngôn ngữ đơn giản nhất có thể. Bài viết này, nằm trong mục Web development chủ yếu giải thích về các khái niệm xung quanh HTML và DOM. HTML Như các bạn đã biết ...

JavaScript MVVM lib within 200 LOC (part 1)
Build your own rendering engine We’re not going to re-invent the wheel. We’re going to do simple things that help you have deep understanding of how it is implemented. However, the code will not totally useless. The code is actually part of my library named HtmlJs. Hopefully after ...

quick note angular 1 autofocus fix
Vừa nãy mình làm một cái search component dùng angular 1, gồm một cái toggle khi ấn vào thì overlay search hiện ra. Tất nhiên cái này thì piece of cake mẹ rồi. Tuy nhiên vấn đề là cái search text input phải tự focus vào nó chứ không thể để người dùng phải thêm 1 extra click được. OK, vậy anh thêm ...

Cơ bản về async await trong javascript
Nếu cho tôi 6 tiếng để đốn hạ một cái cây, tôi sẽ dành 4 tiếng đầu tiên để mài rìu. -- Abraham Lincoln Bạn có thể đọc bài gốc tại đây Khi bắt đầu lập trình với nodejs, vì javascript(js) là bất đồng bộ(asynchoronous) nên mình gặp khó khăn trong việc tổ chức code giống như trong lập trình ...

k-prime sum problem with jasmine specs
A friend of mine liked a programing problem on Facebook. The header say something like: 90% of silicon valley engineers take more than 20 minutes to solve this problem. Sounds like an intrigue lure, huh? Not sure if they actually clicked like it or it's just Facebook that wants me to see. Anyway, I ...

Phân biệt Lexical Scope và Block Scope trong javascript
Trong javascript có 2 loại scopes: lexical scope và block scope Lexical scope là không gian biến được khai báo ở trong hàm (function) . Từ khoá “var” được dùng để khai báo biến trong lexical scope của hàm . Ví dụ: ...

Share framework data-binding mình tự viết.
Chào các bạn, sau 2 năm nghiên cứu, mình đã viết 1 framework JavaScript. Hôm nay mình xin chia sẻ mong đem lại lợi ích cho cộng đồng JS Việt Nam. Framework của mình tên là HtmlJs. Link trang chủ, Github Tại sao lại cần 1 framework khác? Đầu tiên mình muốn nhấn mạnh là mình không muốn chỉ ...

Sự khác nhau giữa Scala và Java 8 (Phần 1)
1. Scala - ngôn ngữ lập trình hàm (Functional Language) "write less, do more" Ví dụ , nhu cầu ứng dụng của bạn cần lựa chọn một số từ (string) thích hợp thỏa mãn tiêu chí điều kiện của bạn từ một danh sách các từ - List(). Để thực hiện logic này trong Java (7, 6), cú pháp sẽ có ...

Javascript Tips - Những điều có thể hay trong JS (ep1)
Những điều có thể bạn đã biết hoặc chưa, những kinh nghiệm nho nhỏ của mình chia sẽ khi lập trình javascript, mong nó có thể giúp ích cho các bạn đang lập trình ngôn ngữ này Tránh lỗi khi dùng những default function của array Các default array function của javascript như map, forEach, ...

Giới thiệu series học lập trình Angular (Angular 2)
Xin chào các bạn, trong thời gian vừa qua cộng đồng Javascript lại đón nhận một đứa con mới đến từ "nhà" Google. Trải qua quá trình thiết kế, phát triển từ rất nhiều ý kiến của người dùng từ phiên bản Angularjs (Angular 1), Angular 2 - mình sẽ gọi là Angular cho thống nhất với tên phiên bản hoàn ...

Tìm hiểu về Biến trong CSS
Sử dụng biến trong CSS Những website lớn thường sẽ sử dụng rất nhiều CSS với lượng lớn giá trị bị lặp lại. Giả sử khi bạn muốn sửa màu chủ đạo của website thì rất có khả năng bạn sẽ phải sửa ở rất nhiều vị trí ví dụ như button, navbar, title,.... Điều này gây ra rất nhiều khó khăn khi code cũng ...

JavaScript Closures
Chào mừng sự trở lại sau kì nghỉ, đây cũng là bài viết cuối cùng trong năm 2015 của tôi. Trong bài viết này tôi sẽ giới thiệu với các bạn về Closure. Một khái niệm vô cùng quan trọng trong Javascript. Nếu muốn master Javascript một trong những thứ quan trọng bạn cần phải hiểu đó là Closure. ...

Code Monk(ey): Kiểm tra Array trong JS
Chuyên mục Code Monk(ey) bàn về những lỗi tai hại thường gặp khi code. Những lỗi này thoạt nhìn có vẻ rất hiển nhiên và vặt vãnh. Khi cần kiểm tra một Array có phải là một Array hay không trong JS, một số người sẽ viết đoạn code như thế này: // Giả sử `kips` là biến cần kiểm tra if (kips ...

scope và closure là khỉ gỉ ?
Scope = cửa hậu aka lỗ đen. Black holes are where God divided by zero - Albert Einstein Chúng ta là những lập trình viên thiên tài, chúng ta thổi hồn vào vạn vật, đôi khi trong quá trình sáng tác ra một chương trình vĩ đại với hàng hà sa số bug nhỏ bug to hô to gọi nhỏ, chúng ta mơ ...

Giới thiệu Userscript và cách sử dụng
Userscript là gì? Userscript (hoặc User script) là các script dùng trong trình duyệt, hướng tới việc đọc thông tin của trang web hoặc thay đổi chúng. Về cơ bản, Userscript là JavaScript, được bổ sung một số API mạnh mẽ mà thông thường không được phép. Userscript thường không được ...

NodeJS - require, exports, module.exports
1. Javascript FUNCTIONAL OR OBJECT ORIENTED? 2. JavaScript, object oriented? 3. Nodejs require exports vs module.exports 4. Referrence Trả lời: 1. Javascript FUNCTIONAL OR OBJECT ORIENTED? "JAVASCRIPT: FUNCTIONAL OR OBJECT ORIENTED?" Vậy nghĩa là Javascript(JS) là ngôn ...

Ứng dụng toán tử logic trong Javascript để viết code gọn gàng hơn
Chào các bạn, chủ đề hôm nay mình muốn chia sẻ với các bạn đó là làm thế nào để viết code Javascript trông gọn gàng hơn bằng cách ứng dụng toán tử logic trong Javascript nhé. Trước tiên mình xin nói sơ qua về các toán tử logic có trong JS. Chúng ta có tổng cộng ba toán tử logic đó là toán ...

Học ReactJS trong 15 phút (Phần cuối)
Chúng ta đã được tìm hiểu về props và state trong React ở bài trước, ở bài cuối cùng này chúng ta sẽ cùng tìm hiểu về cách dữ liệu di chuyển trong React. Nào cùng bắt đầu bấm đồng hồ đếm ngược năm phút nhé. Inverse data flow Chúng ta đã nói rất nhiều về việc làm thế nào luồng dữ liệu chỉ có ...

Học ReactJS trong 15 phút (Phần 2)
Trong bài trước chúng ta đã có 5 phút để tìm hiểu về component, JSX và cách thức tạo multiple nested component trong ReactJS. Trong 5 phút lần này, chúng ta sẽ tìm hiểu về Props và State. Props & State là gì? Có hai kiểu của data trong React đó là props và state. Sự khác biệt giữa hai ...