Group Details Private

Global Moderators

Forum wide moderators

  • 33 khái niệm cần nắm trong JavaScript – Lộ trình học JavaScript

    Qua bài viết Tổng quan về JavaScript và học JS để làm gì? Chúng ta phần nào cũng hiểu được tầm ảnh hưởng của JS và bắt đầu con đường tìm hiểu thứ ngôn ngữ lập trình thú vị này.

    Để học ngôn ngữ JavaScript một cách hiệu quả, chúng ta nên tìm hiểu sơ bộ qua tất cả, vạch ra một lộ trình cụ thể và sau đó sẽ học chuyên sâu vào từng vấn đề. Cho nên trong bài viết này, mình sẽ đi sơ lược qua tất cả các khái niệm cần nắm trong JavaScript chúng ta có thể tạo ra lộ trình học Javascript cho riêng mình.

    Lưu ý: Bài viết này mình đi qua các khái niệm mà không giải thích cụ thể vì nó sẽ rất dài. Mình sẽ có các bài viết khác để nói sâu hơn về các vấn đề này ở Series về JavaScript, mọi người theo dõi nhé

    lo-trinh-hoc-js-banner.png
    Lộ trình học Javascript - Khái niệm cần nắm trong javascript

    Khái niệm cơ bản

    1. Biến (Variables) và Kiểu biến (Type Variable)

    Biến là nơi chứa các giá trị để chúng ta có thể sử dụng lại sau này qua tên biến. Chúng ta có thể khai báo biến bằng var, let, const

    var num;
    let str = "Hello";
    const NAME = "Dyno Nguyễn";
    

    JS là ngôn ngữ sử dụng biến động (dynamic type), có nghĩa là nó có thể nhận bất kỳ kiểu dữ liệu nào mà ta truyền cho nó. JS cung cấp từ khoá typeof để chúng ta kiểm tra kiểu của biến.

    Đến nay thì JS có 9 kiểu dữ liệu và chia làm 3 loại:

    6 Data Types là các kiểu nguyên thuỷ (primitives): undefined, boolean, number, string, bigint, symbol.
    2 Structural Types: object và function.
    1 Structural Root Primitives: null

    var x; // typeof x = "undefined"
    x = "Dyno"; // string
    x = 10; // number
    x = {}; // object
    x = function(){}; // function
    x = null; // object
    x = false; // boolean
    

    2. Ghi chú (Comment)

    comment-code.jpeg
    Comment Trong Code

    Comment trong code rất quan trọng, nó giúp người khác có thể hiểu được code của chúng ta, dễ bảo trì sau này. Vì thế nó thói quen comment code là rất tốt. Nhưng “Hãy comment tại sao phải làm như vậy” thay vì “Comment nó là cái g”.

    Trình thông dịch sẽ không biên dịch câu comment của bạn.

    Có 2 cách comment trong JavaScript:

    // Đây là comment đơn dòng. Sử dụng dấu //
    /*
      Đây là commnent đa dòng.
      Sử dụng dấu /* */
    */
    

    3. Input và Output trong JS

    Cách để nhập input phổ biến nhất là chúng ta sẽ dùng thẻ <input /> trong HTML, sau đó dùng JS để lấy giá trị của nó. Bạn tìm hiểu thêm ở phần DOM bên dưới.

    Cách thứ 2 là dùng method prompt , trình duyệt sẽ hiển thị một popup cho chúng ta nhập dữ liệu.

    var age = prompt("Nhập tuổi của bạn: ");
    

    Về output, bạn có thể dùng các cách sau để hiển thị kết quả:

    var x = 10;
    console.log(x); // Cách này tiện nhất
    alert(x);
    document.write(x);
    

    4. Toán tử (Operator)

    Có rất nhiều toán tử trong JS, mình sẽ cung cấp các từ khoá để bạn tìm hiểu nhé.

    • Toán tử số học (Arithmetic Operators): + – * / % ++ — **
    • list itemToán tử gán (Assignment Operators): = += -= *= /= %= **=
    • Toán tử so sánh (Comparison Operators): == === != !== > < >= <= ?
    • Toán tử logic (Logical Operators): && || !
    • Toán tử về bit (Bitwise Operators): & | ~ ^ << >> >>>
    • Toán tử về kiểu (Type Operators): typeof, instanceof

    Tham khảo: W3School JavaScript Operators

    5. Câu điều kiện (Conditionals)

    Điểu kiện rẽ nhánh giúp bạn phân loại các trường hợp xãy ra và xử lý logic nhất.

    Các từ khoá: if, else, else if, switch case

    const condition = 5;
    if(condition > 2){
      console.log("5 > 2")
    }else{
      console.log("5 < 2")
    };
    // "5 > 2" 🤣 đương nhiên rùi
    

    6. Vòng lặp (Loop)

    Vòng lặp giúp chúng ta tận dụng sức mạnh của máy tính để lặp lại có thao tác tính giống nhau nhiều lần liên tục.

    Trong JS có các loại vòng lặp sau: for, while, do while, for in, for of

    let sum = 0;
    for(let i = 0; i < 100; ++i){
      sum += i;
    }
    console.log(sum); // 4950
    

    7. Hàm (Function) và Phương thức (Method)

    Hàm hay chức năng nó giúp chúng ta gom nhóm các câu lệnh lại để thực hiện một công việc nhất định, và sau này thực hiện lại công việc đó chúng ta chỉ cần thực hiện lời gọi hàm.

    // khai báo hàm
    function sum(num1, num2){
      return num1 + num2;
    }
    // thực hiện hàm
    const result = sum(2, 3);
    console.log(result); // 5
    

    Phương thức cũng là một hàm, nhưng hàm này được định nghĩa trong một class hoặc object.

    var name = "Dyno Nguyen";
    name = name.toLowerCase(); phương thức toLowerCase của string
    console.log(name); // "dyno nguyen"
    

    8. Đối tượng (Object)

    JS thao tác rất nhiều với đối tượng thay vì lớp. Các bạn có thể hiểu đối tượng là một sự vật, sự việc có chung tính chất và chúng ta gom nó thành một biến. VD:

    // Tạo một đối tượng person chứa thông tin của một người
    const person = {
      name: 'Dyno',
      age: 18,
      country: 'Việt Nam',
      talk: function(){
        console.log("Hello");
      }
    }
    // truy xuất các thuộc tính, phương thức của đối tượng
    console.log(person.name); // "Dyno"
    console.log(person["age"]); // 18 - cách truy xuất khác
    person.talk(); // Hello
    

    9. Mảng (Array)

    Array bản chất cũng là một object. Array chứa các phần tử liên tiếp cùng kiểu dữ liệu với nhau (Thật ra, bạn hoàn toàn có thể thay đổi bất kỳ phần tử nào trong đấy khác kiểu với các phần tử còn lại, nhưng mình nghĩ điều đó là không nên vì sẽ sai đi ngữ nghĩa của array).

    const arr = [1, 2, 3, 4, 5];
    console.log(arr[1]); // 2
    arr[1] = "Dyno"; // Không nên làm vầy
    console.log(arr); // [1, "Dyno", 3, 4, 5]
    

    10. Chuỗi (String)

    Có một điều mình muốn thú nhận là làm việc với string trong JS thật sự rất sướng. Các method hỗ trợ tận răng luôn 😊 Demo chút nhé

    let str = "  Dyno ngUyen 123  "; // Expect: str = "dyno nguyen"
    str = str.replaceAll(/\d/g,'').trim().toLowerCase();
    

    11. Phương thức xây dựng sẵn (Built-in Methods)

    Hầu như các object hay class được xây dựng sẵn trong JS đều có các method hỗ trợ cho chúng ta. Việc học các method này giúp chúng ta code nhanh và tối ưu hơn thay vì phải tự đi xây dựng lại. Mọi vài method phổ biến.

    • Array: map(), filter(), find(), findIndex(), includes(), concat, reduce(), sort(), …
    • String: indexOf(), split(), slice(), replace(), …

    12. DOM (Document Object Model) & BOM (Browser Object Model)

    Để xây dựng các thành phần động trong một trang website thì chúng ta cần tìm hiểu về cách thao tác với DOM và BOM.

    DOM.png

    window-object_zjkb0u.png

    Khái niệm nâng cao

    1. Ép kiểu (Type Conversion)

    Trong rất nhiều trường hợp chúng ta bắt buộc phải đổi kiểu dữ liệu của một biến để nó phù hợp với ngữ nghĩa. Đa phần thì sẽ từ string sang number hoặc ngược lại.

    Có 2 dạng ép kiểu là Explicit (Rõ ràng) và Implicit (Ngầm định).

    const num = 18;
    const numStr = num.toString() + " tuổi"; // typeof numStr = "string" - Explicit
    const str = "18";
    const age = str * 1; // typeof age = "number" - Implicit
    

    2. Phân biệt == (equality operator) với === (identity operator)

    Đây là khái niệm dễ gây nhầm lẫn và khó hiểu với những người mới học. Hiểu đơn giản, với == thì nó tự động ép kiểu và sau đó so sánh, còn === sẽ so sánh trực tiếp cả về giá trị lẫn kiểu dữ liệu.

    Mình khuyến khích nên dùng === để code tường minh hơn, tránh gây ra những bug không đáng có.

    3. Truthy và Falsy

    Truthy là các giá trị khi ép về kiểu Boolean thì trả về true. Falsy thì ngược lại.

    Các giá trị Falsy: false, 0, -0, 0n, "", null, undefined, and NaN

    Ngoài các giá trị trên thì tất cả còn lại đều là Truthy.

    4. Tham chiếu (Pass by Reference) và Tham trị (Pass by Value)

    Nếu bạn đã học qua C/C++ thì chắc cũng đã nghe đến tham chiếu và tham trị. Đó là 2 cách quản lý bộ nhớ khác nhau, bạn cần hiểu rõ để tránh nhầm lẫn trong việc so sánh và sử dụng bộ nhớ tối ưu hơn.

    const a = 123;
    const b = 123;
    console.log(a === b); // true do so sánh 2 giá trị giống nhau (pass by value)
    const c = { x : 1 };
    const d = { x : 1 };
    console.log(c === d); // false do so sánh 2 địa chỉ vùng nhớ khác nhau (pass by reference)
    

    5. Sao chép nông (Shallow Copy) và Sao chép sâu (Deep Copy)

    Như vấn đề về tham chiếu ở trên, khi ta copy 1 object hoặc 1 array từ 1 object khác thì nên cẩn thận, vì nếu chúng ta dùng kỹ thuật shallow copy thì rất dễ bị chung vùng nhớ, dẫn đến object bị sai không đáng có.

    Mình có đề cập ở đây, bạn có thể đọc thêm: JavaScript tips & tricks

    6. Khối (Block) và Phạm vi hàm (Function Scope)

    Block là các đoạn code để thực hiện một chức năng nào đó mà chúng ta muốn gom nhóm nó lại, thì tất cả các code nằm trong { } thì gọi là một block.

    Function scope cũng như block nhưng nó áp dụng cho phạm vi bên trong 1 hàm nào đó.

    Bạn cần hiểu rõ 2 khái niệm này để dễ dàng tiếp cận với kiến thức chuyên sâu bên dưới hơn.

    Khái niệm chuyên sâu và ES6+

    1. Hàm tạo (Constructor Function) và từ khoá new

    Đây là một cách khởi tạo ra một đối tượng trong JS, nó cũng gần giống như class vậy. Và chúng ta sẽ dùng từ khoá new để tạo ra một object đó.

    function Person(name, age){
      this.name = name;
      this.age = age;
      
      this.sayName = function(){
        console.log("My name is " + this.name);
     }
    }
    const dyno = new Person("Dyno", 18);
    console.log(dyno.name); // "Dyno"
    

    2. Prototypes

    Đây là một điều đặc biệt của JS, prototype là một cơ chế để object có thể kế thừa có thuộc tính và phương thức với nhau, điều này giúp tiết kiệm bộ nhớ khi tạo các object.

    prototype.png
    Prototypes trong JavaScript

    3. Class

    Tuy JS không phải là một ngôn ngữ thuần OOP nhưng hiện nay thì JS cũng đã hỗ trợ chúng ta rất đầy đủ các tính chất OOP cho mọi người vọc vạch nhé 😎

    4. Hoisting

    Khi khai báo một biến với từ khoá var thì chúng ta rất dễ bị rơi vào tình trạng hoisting và điều này dẫn đến các kết quả không mong muốn và rất khó debug.

    Từ phiên bản ES6 thì JS đã hỗ trợ từ khoá const và let để thay cho việc sử dụng var.

    5. Function context, từ khoá this và bind

    6. Arrow function

    Trong ES6 có một cách khai báo function đó chính là dùng Arrow function, đều này giúp code chúng ta gọn gàng hơn và hưởng được một số đặc tính khác những.

    const myFn = () => {
      // do something ...
    }
    

    7. Một vài từ khoá khác trong ES6+

    Template string, arguments, call, apply, spread operator, object destructuring, …

    Bạn có thể xem các tips với ES6+ tại đây nhe: JS tips & tricks

    8. Các khái niệm nâng cao khác

    Sau đây là một vài khái niệm nâng cao, để hiểu rõ hơn bản chất của JS thì chúng ta cần hiểu các khái niệm sau. Do nó khá phức tạp nên mình sẽ có các bài viết riêng cho các từ khoá này:

    • Event loop trong JS.
    • Strict Mode
    • Callback & Promise
    • Async/Await và bất đồng bộ trong JS
    • HOF (Higher Order Functions)
    • Cà ri à không Currying function 😂
    • Clousure
    • IIFE (Immediately Invoked Function Expression)
    • Modules, Import và Export trong JS

    Tóm tắt

    Trên đây là tất cả các khái niệm mà trong lúc mình học JS thì mình đã học qua, ngoài ra còn rất nhiều thứ khác nữa.

    Chia sẻ tí kinh nghiệm học JS của mình là mọi người nên học sơ bộ qua các khái niệm một lượt, sau đó bắt tay vào hiểu sâu từng khái niệm. Và để hiểu sâu về nó thì chỉ có thực hành thì mới nhanh được, đừng chỉ học mỗi lý thuyết.

    Thời gian tới mình sẽ ra các bài viết khác đi sâu vào các vấn đề trên tại Series về JavaScript, mong được sự ủng hộ và góp ý của mọi người 😊

    Cảm ơn mọi người đã đọc bài viết ❤

    posted in Javacsript
  • Tổng quan về JavaScript. Học JavaScript như thế nào cho hiệu quả ?

    js-cover-840.jpeg
    Dạo gần đây, JavaScript là một cái tên được nhắc đến rất nhiều trên các cộng đồng lập trình, nhà nhà người người thi nhau đi học JavaScript. JavaScript cũng đứng thứ 2 (sau Python) trong top 10 ngôn ngữ phổ biến nhất năm 2020 (Theo: Northeastern University). Vậy JavaScript là gì? Bài viết này sẽ nói tổng quan về JavaScript để giúp bạn hiểu rõ hơn bản chất của ngôn ngữ này nhé 😉

    1. JavaScript là gì ?

    JavaScript (viết tắt là JS – đọc là da-va-sờ-cờ-ríp 😂) là một ngôn ngữ lập trình thông dịch (Interpreted Programming Language) hay ngôn ngữ kịch bản (Scripting Language).

    Ngôn ngữ thông dịch (Interpreted Languages) là ngôn ngữ biên dịch và thực thi cùng lúc trên từng dòng code, tốc độ thực thi chậm: Javascript, PHP, Python, Ruby, …
    Ngôn ngữ biên dịch (Compiled Languages) là ngôn ngữ biên dịch trước, thực thi sau trên toàn bộ mã nguồn. Tốc độ thực thi rất nhanh: C, C++, C#, Go, Rust, …
    JS được sinh ra với mục đích chính là nhúng vào file HTML để biến một website tính trở nên sinh động hơn.

    2. Lịch sử phát triển của JavaScript ?

    Brendan-Eich.jpeg
    Brendan Eich - cha đẻ của JavaScript

    JS được ra đời và tháng 5 năm 1995, cha đẻ là Brendan Eich một nhà công nghệ Mỹ, đồng sáng lập Mozilla và là một lập trình viên của Netscape.

    Các phiên bản của JavaScript cho đến nay:

    5/1995: Mocha
    9/1995: LiveScript
    12/1995: JavaScript
    6/1997: ECMAScript 1 (ES1). ECMAScript là một phiên bản chuẩn hoá của JS.
    6/1998: ES2
    12/1999: ES3
    12/2009: ES5
    6/2011: ES5.1
    6/2015: ES6 – ES2015 (Phiên bản ổn định của JS)
    Các năm tiếp theo JS ra tiếp các phiên bản ES7, ES8, … Và hiện tại là ES12 với các tính năng rất nổi bật.

    3. Cách thức hoạt động và điểm khác biệt của JavaScript

    JS là một ngôn ngữ đơn luồng (Single Thread) hay nói cách khác JS chỉ có duy nhất một call stack, một heap và trong cùng một thời điểm chỉ chạy duy nhất một dòng lệnh.

    JS có thể chạy được trên trình duyệt là nhờ vào các JavaScript Engine. Các engine này sẽ chuyển đổi code JS thành mã máy mà máy tính có thể hiểu được.

    Có rất nhiều các JS Engine phổ biến như SpiderMonkey (Firefox), Chakra, Rhino, Carakan, JavaScriptCore, Tamarin, … và nổi tiếng nhất là Google V8 được sử dụng trong Google Chrome và NodeJS runtime.
    js-engine-1.jpeg
    JavaScript Engine - Tổng quan về JavaScript

    4. Học JavaScript để làm gì và hệ sinh thái của nó ?

    Một trong những ưu điểm lớn của JS mà khiến nhiều người học nó đó chính là tính đa dụng của nó. Nếu không quá quan tâm về mặt hiệu năng thì JS có thể đảm nhiệm mọi vai trò trong thế giới của phát triển phần mềm.

    he-sinh-thai-js.png
    Hệ sinh thái của JavaScript

    Phát triển ứng dụng Frontend Web

    Đây cũng chính là mục tiêu ban đầu mà JS lúc vừa mới ra đời. Nếu như HTML là khung sườn của trang web, CSS là công cụ trang điểm thì JS chính là trái tim, linh hồn của trang web đó.

    JS giúp cho website của chúng ta trở nên sinh động hơn, người dùng có thể thao tác với các thành phần trên web một cách trực quan hơn, …

    Các thư viện, framework ưu chuộng: ReactJS, VueJS, Angular, Jquery, Ember, Backbone.js, Three.js, …

    Phát triển ứng dụng Backend Web

    nodejs.png
    Phát triển ứng dụng Backend với NodeJS

    Hiện nay, JS cũng rất có ưu thế trong việc phát triển Backend Server hay viết APIs nhờ phát triển của NodeJS Runtime JavaScript.

    Từ đó,chỉ với JS chúng ta hoàn toàn có thể xây dựng một ứng dụng vừa và nhỏ một cách nhanh chóng mà không cần học thêm ngôn ngữ khác.

    Các thư viện, framework ưu chuộng: Expressjs, Koa, Fastify, NestJs, …

    Phát triển Game 2D, 3D

    Thông qua HTML5 Canvas APIs thì chúng ta hoàn toàn có thể tạo nên một game hoàn hảo trên trình duyệt một cách nhanh chóng và dễ dàng hơn bao giờ hết. Chúng ta cũng có thể sử dụng canvas để tạo ra các hiệu ứng siêu đẹp trên website của mình.

    Bên cạnh đó, cũng có rất nhiều các engine hỗ trợ chúng ta tạo nên những game 2D, 3D với hiệu năng cao trên web dễ dàng hơn như BabylonJS, LimeJS, …

    Phát triển ứng dụng Mobile

    react-native.png
    Phát triển ứng dụng Mobile với React Native

    Dạo gần đây, xu hướng phát triển các ứng dụng đa nền tảng trên điện thoại (Hybrid App – Cross Platform) trở nên phổ biến vì chỉ cần viết một lần mà dùng ở nhiều nơi, việc này giúp giảm chi phí và thời gian phát triển ứng dụng.

    Một vài công nghệ hỗ trợ việc này như Flutter (được viết bằng Dart) và React Native được viết bằng JavaScript. Ngoài ra còn có NativeScript, Ionic, …

    Phát triển ứng dụng Desktop

    electron.png
    Xây dựng desktop app với Electron

    Giờ đây, chúng ta có thể xây dựng một ứng dụng trên desktop đa nền tảng dễ dàng với Electron, một thư viện mã nguồn mở của Github. Các ứng dụng quen thuộc của chúng ta được viết bở Electron như Visual Studio Code, Slack, Figma, Microsoft team, …

    Yeah, vậy là đủ các nền tảng phổ thông cho anh em dev phát triển phần mềm rồi nhé. Thoải mái nghịch ngợm, tạo nên các ứng dụng đa nền tảng chỉ với JS. Nhưng mà khoan 😐 Nếu JS ngon vậy thì cần gì học ngôn ngữ khác nữa? Xem tiếp bên dưới nhé.

    5. Ưu và nhược điểm của JavaScript

    Ưu điểm
    Thật sự mà nói, JS có rất nhiều ưu điểm khiến mọi người yêu thích nó:

    JS rất dễ học, dễ bắt đầu cho người mới. Nếu so với các ngôn ngữ biên dịch như C, C++, C# thì JS dễ hơn rất nhiều.
    Bạn có thể chạy JS ở bất kỳ đâu vì nó không cần một trình biên dịch. Bạn có thể dùng ngay trên console web browser hay Runtime NodeJS.
    JS làm được rất nhiều thứ như mình nói ở trên, bạn dễ dàng xây dựng một ứng dụng đa nền tảng mà không cần mất quá nhiều thời gian. Ví dụ như bạn học ReactJS thì rất dễ để qua React Native.
    JS rất dễ bắt lỗi, debug trong lúc code, vì nó thông dịch theo từng dòng nên đến dòng nào debug dòng đó.
    Cộng đồng ae JS hùng hậu, stackoverflow đầy đủ không ngại con bug nào 🐞·
    Hơn 92% các trang web hiện nay có sử dụng JS (2016), vì thế học JS không lo không có chỗ dùng, trừ khi website không dùng JS nữa 🤣
    Số lượng tuyển dụng lập trình viên biết Javascript cao, dễ có cơ hội việc làm hơn.
    Tuyển dụng JavaScript
    Tuyển dụng JavaScript
    Nhược điểm
    Cái gì cũng có nhược điểm của nó, JS cũng thế. Và đôi khi chính những ưu điểm của JS cũng trở thành nhược điểm của nó.

    Dễ học nhưng kiến thức không hàn lâm nên rất khó để nắm được chuyên sâu về hệ thống. Không như C, C++, JS là kiểu dữ liệu động, không thuần OOP, không có khái niệm con trỏ, … Vì thế, rất khó để chuyển sang ngôn ngữ khác nếu học JS đầu tiên.
    Dễ dàng chạy trên trình duyệt vì thế rất dễ bị tấn công phía client bởi các script mà hacker nhúng vào.
    Chạy đa nền tảng tuy nhiên hiệu năng không thể cao như các ngôn ngữ native khác.
    Cộng đồng đông mã nguồn mở nhiều nên hệ thống có thể dễ bị khai thác lỗ hổng.

    6. Học JavaScript ở đâu ?

    JS rất dễ học và có rất nhiều nguồn để học JS. Bạn có thể tham khảo vài nguồn ở dưới đây nhé:

    Website: W3School, Mozilla, Freecodecamp, F8 fullstack, Nodemy.vn (tiếng Việt, thầy giảng). Class.nodemy.vn (học video)
    Đọc Blog: Blog của mình, Blog toidicodedao, viblo, ..
    Học qua các kệnh Youtube
    Sách: You don’t know JavaScript, Eloquent JavaScript, Head First JavaScript Programming, …

    7. Học JavaScript như thế nào cho hiệu quả ?

    Thật ra, bạn học như thế nào cũng được, bản thân bạn thấy thoải mái, tiến bộ mỗi ngày là được. Nhưng mình có một vài lời khuyên cho những bạn mới bắt đầu học như sau:

    Hãy tìm hiểu sơ lược hoặc kỹ càng về bản chất của JS. Cách thức mà nó hoạt động và học nó để làm gì, đừng học chỉ vì nó đang làm trend.
    Luôn đặt ra các câu hỏi trong lúc học một cái mới như cái này là cái gì? Học nó để làm gì? Có cách nào khác để làm điều đó không?…
    Hãy học kỹ căn bản đừng vội lao vào học framework. Ban đầu có thể bạn sẽ cảm thấy chậm, nhưng tin mình đi sau này bạn sẽ không phí thời gian đâu.
    Đừng ôm học quá nhiều framework hay thư viện, hãy học chuyên sâu một cái đã. Tổng quan thì chúng cũng như nhau cả thôi.
    Đừng quá lạm dụng vào các thư viện có sẵn, cái nào dễ thì hãy tìm cách làm.
    Và đặc biệt là đọc nhiều blog và xem video từ nhiều nơi, từ đó bạn có thể tích góp được nhiều cái hay ở nhiều nơi.

    8. Vậy có nên học JavaScript ?

    Câu trả lời là “Tuỳ vào bạn”, nếu bạn vẫn đang cảm thấy phân vân thì hãy đọc lại blog này hoặc tìm đọc cái blog liên quan khác. Sau đó, hãy trả lời câu hỏi này. Còn nếu bạn vẫn thực sự chưa trả lời được thì cứ học thôi, đừng quan tâm ai nói gì? Tự học thì bạn sẽ tự ngộ ra câu trả lời thôi nè 😎

    Tạm kết
    Cảm ơn bạn đã đọc bài viết này, hy vọng nó sẽ giúp bạn phần nào hiểu hơn về ngôn ngữ vạn người mê ngàn người lú JavaScript này nhé. Nếu thấy hay và bổ ích hãy chia sẻ bài viết này nhé. Mọi thắc mắc gì, bạn cứ bình luận bên dưới ❤

    Bạn có thể theo dõi Series Về Javascript của mình để cập nhật các kiến thức hay ho về JS nhé.
    Nguồn:
    https://dynonguyen.com/tong-quan-ve-javascript/

    posted in Javacsript
  • RE: Chia sẻ web làm bài test trắc nghiệm lập trình

    Web rất hữu ích. Cảm ơn bạn đã chia sẻ

    posted in Chia sẻ
  • RE: #nodejs #jwt

    Về luồng hoạt động thì ổn rồi em nhé.

    posted in Hỏi Đáp
  • RE: Những thủ thuật “ Bá đạo ” mà bạn có thể làm với Chrome Developer Tools

    @Văn-Anh-Đào Bài viết hay quá. Rất hữu ích

    posted in Tutorials
  • HỌC LẬP TRÌNH SAO CHO VÀO ĐẦU, SAO CHO HIỆU QUẢ

    HỌC LẬP TRÌNH SAO CHO VÀO ĐẦU, SAO CHO HIỆU QUẢ

    NODEMY.png

    Trước có bạn sinh viên từng tâm sự với mình:
    "Anh ơi em bế tắc lắm rồi, em đã cố gắng hết sức rồi mà xin thực tập mãi không được nhận? Giờ em phải làm sao anh, a cho em lời khuyên với?"
    Tôi: Em học lập trình bao lâu rồi, học ra sao ns anh xem?
    Em học C++, HTML, CSS, Java, PHP, Javascript, Python, em học trên youtube được 2 tháng rồi, (chụp ngay cả chồng sách to tướng về lập trình).
    Tôi: 2 tháng mà học lắm thứ thế em, ms 2 tháng thì ăn thua gì, đâu học xong làm đc gì show xem.
    HTML CSS cắt được mỗi cái giao diện chưa reponsive, Các ngôn ngữ khác thì học mỗi mấy câu lệnh căn bản if else, for, while thế này thì chưa đi làm được là đúng rồi

    Qua câu chuyện trên mình nhận ra một điều là các bạn newbie hầu hết đang nghĩ sai về mức chuẩn có thể đi làm mà cũng chẳng biết cần những gì để đi làm được.
    Cái các bạn học là nền tảng chỉ để hiểu. Ae đừng lầm tưởng là cứ biết càng nhiều ngôn ngữ là sẽ ngon, nên chú trọng chiều sâu một chút, thế chiều sâu là gì:

    kiến thức:

    1. Hiểu về cách làm ra một sản phẩm
    2. Kiến thức cốt lõi sử dụng trong ngôn ngữ đó(core - có cái này lỗi vặt cũng ít)
    3. Học thêm một số lib, framework ngôn ngữ đã chọn
    4. Hiểu nguyên lý một ngôn ngữ lập trình, lib, framework hoạt động
    5. Các vấn đề, bài toán cần xử lý thường xuyên gặp trong các dự án
    6. Luyện thuật toán, luyện não phản xạ vs code.

    Kỹ năng:

    1. Vận dụng nền tảng như phản xạ, quen tay, quen mắt
    2. Xử lý vấn đề khi gặp lỗi, debug, search siếc ra làm sao
    3. Đọc tài liệu gốc (chẳng cần giỏi tiếng anh đâu, cần google translate, vừa đọc vừa search lâu sẽ quen)
    4. Kỹ năng viết code sạch, dễ hiểu
    5. Kỹ năng quản lý code, làm việc nhóm
    6. Kỹ năng chủ động trình bày vấn đề (gặp vấn đề là k đc ỉm)
    7. Kỹ năng đặt câu hỏi (đừng bao giờ hỏi chung chung: anh ơi em bị lỗi gì ý mà nên tìm hiểu nguyên nhân lỗi trước - bằng hết sức có thể hãy tìm ra keyword gây lỗi, cái này dùng 5WHY nhé)
    8. Kỹ năng chia nhỏ vấn đề ra xử lý, khoanh vùng nó lại tập trung giải quyết.

    Mindset:

    1. Mới học thì chọn 1 ngôn ngữ thôi, học phải có MỤC TIÊU, KẾ HOẠCH rõ ràng, đạt được nó đến cùng.
    2. Phải tự áp dụng làm được một sản phẩm riêng mình bằng kiến thức đã học
    3. Làm sản phẩm phải hoàn thiện sẽ được mọi người sử dụng nên cần chỉnh chu(làm ít mà phải chất)
    4. Thái độ làm việc nghiêm túc, trách nhiệm (mình là ng đi làm không phải thích làm thì làm, nghỉ thì nghỉ).
    5. Công việc ưu tiên hàng đầu, k đc trễ deadline đã định.
    6. K ngừng học nâng cao (kinh nghiệm, kiến thức tăng theo thời gian, 2 tháng có giá của 2 tháng, 1 năm có giá của 1 năm)

    Sương sương thế thôi chứ nói ra còn rất dài, ae cố gắng học như trên chắc chắn sẽ thành công. Đã là lập trình viên thì nên có tính tự học, tìm tòi vì kiến thức NGÀNH nó rộng lắm.
    Nhưng mình biết k phải ae nào cũng nhớ và áp dụng được mấy cái trên thế nên tốt nhất nếu mới bước chân vào lập trình thì có người hướng dẫn, dạy mình là k bao giờ thừa.

    Team mình phát triển hệ thống học tập online có đủ kiến thức từ số 0 đến đi làm được:
    https://class.nodemy.vn

    *Lưu ý: mình phải đính chính lại là kiến thức này mình public hết trên youtube Nodemy rồi (free hết). Trong hệ thống là công sức để đội mentor(hướng dẫn mọi người, teamview chữa bài, inbox ngày đêm)
    Ytube: https://www.youtube.com/channel/UCMfiIOjAzHZ9vyoqNdcPvNA

    Bạn nào ở Hà Nội thì sắp tới đang có chương trình đào tạo JS,
    Link đk: https://forms.gle/VqCJszUKSA5aUp7r6

    Trên đây là quy trình bên mình áp dụng đào tạo cho học viên gần 2 năm nay, rất ok. Hi vọng giúp đc các bạn mới và có ích với các cty đang cần training nhân sự

    posted in Tutorials
  • 5 Bước đưa web Nodejs lên mạng trong 6 phút

    Hãy tưởng tượng xem website do chính mình tạo ra được nhiều người sử dụng và yêu thích thì quá là tuyệt vời phải không ae?

    Hôm nay mình sẽ hướng dẫn ae một cách cực kỳ đơn giản để Deploy web Nodejs lên mạng chỉ với 5 bước.

    Đầu tiên chúng ta cần chuẩn bị sẵn :

    Ok, vậy là đủ rồi, cùng chiến thôi.

    Bước 1: Cài đặt Remote SSH kết nối với VPS theo cú pháp ssh [email protected]
    VD: ssh [email protected]
    73065cfe-1773-4320-bfd7-80022f732205-image.png

    Mở terminal để thao tác với VPS thôi:
    0a40d2aa-b592-4fbe-9a75-150ecc01e6ac-image.png

    Bước 2: Cài đặt môi trường trong VPS
    Để chạy được ứng dụng Nodejs trong VPS thì chúng ta cần cài môi trường trong ubuntu như sau:

    sudo apt update
    

    Cài GIT:

    sudo apt install git-all
    

    Cài Nodejs:

    sudo apt install nodejs
    

    Cài Npm:

    sudo apt install npm
    

    Bước 3: Tải Project về VPS, install các thư viện cần thiết trong package.json
    Clone Project từ git:

    git clone https://github.com/namndwebdev/nodemy-server.git
    
    npm install
    

    Bước 4: Cài đặt pm2 quản lý ứng dụng chạy trên VPS
    Tiếp đến ta cần pm2 quản lý các ứng dụng Nodejs trên VPS, nhằm mục đích khi VPS không may khởi động lại thì pm2 sẽ luôn chạy lại website cho chúng ta:

    sudo npm install pm2 -g
    pm2 start npm --name "Nodemy-server" -- start
    pm2 save
    pm2 startup
    

    Bước 5: Mở cổng cho phép mọi người truy cập vào hệ thống website
    Vậy là cuối cùng website Nodejs của chúng ta đang chạy với cổng port: 3000.
    Để người dùng truy cập từ bên ngoài ta cần VPS cho phép. Vì vậy chúng ta sẽ mở cổng 3000 để mọi người có thể truy cập thoải mái

    sudo ufw enable
    sudo ufw allow 3000
    sudo ufw reset
    

    Và cuối cùng tận hưởng thành quả thôi nào:
    ee116c2c-e48e-4822-a49d-056ee8e21fa0-image.png

    PHÁT TRIỂN THÊM TÍNH NĂNG
    Để phát triển thêm nhiều tính năng mới, thú vị hơn cho website của mình,
    ae có thể code theo 2 cách

    Cách 1: Sửa code trực tiếp trên VPS thông qua extension Remote SSH ban đầu
    chọn folder làm việc trên Visual studio code
    f50db7dd-bf04-414c-8001-1d05ae7b19ac-image.png

    Sửa code rồi chạy lại lệnh để áp dụng code mới nhất :

    pm2 reload all
    

    Cách 2: Sửa code dưới máy làm việc tại nhà (máy host)
    Khi sửa xong sẽ đẩy code lên GIT với git push origin master
    Từ VPS, ae pull code về với git pull origrin master

    cuối cùng để code mới áp dụng ngay và luôn ae chỉ cần :

    pm2 reload all
    

    Quá đơn giản phải không nào. Hi vọng bài viết hữu ích với ae chưa biết deploy ra sao.
    Chúc ae Noder Deploy thành công!

    VIDEO HƯỚNG DẪN:

    5 bước đưa nodejs lên mạng.png

    posted in Tutorials
  • Tổng quan về CNTT cho các bạn mới tìm hiểu về lập trình

    TỔNG QUAN VỀ NGÀNH CNTT

    Các bạn mới học bơi hết vào đây nhé, Topic này giải đáp tập trung các câu hỏi các bạn đang thắc mắc.
    Dưới đây là một số câu hỏi mà các bạn hỏi đi hỏi lại hàng trăm lần trong group, các bạn có thể tìm thấy câu tl bên dưới:

    1. CNTT có những ngành gì?

    CNTT có nhiều mảng, ngành, nhưng phổ biến nhất là
    Kỹ thuật phần mềm: Thiết kế phần mềm website hay các ứng dụng mobile, game ... tóm lại là lập trình viên
    An toàn thông tin: setup hệ thống mạng, bảo vệ dữ liệu hệ thống, xử lý sự cố, phân tích tìm lỗ hổng ...
    Thế muốn trở thành hacker thì học gì? Hack là can thiệp chỉnh sửa vào hệ thống, thay đổi cách hoạt động ban đầu của nó tùy mục đích.
    Thế nên muốn thành hacker thì phải giỏi lập trình, kiến thức mạng, phần cứng ... tốt nhất giỏi lập trình đã rồi tính.

    2. Học lập trình ra trường làm gì?

    Học lập trình thì khối thứ để làm, làm web, làm phần mềm, làm app mobile, game ...
    Cao cấp hơn là quản lý dự án (PM), đi khách (BA) ..., đánh thuê (freelancer) hoặc tự làm sản phẩm riêng.
    Yên tâm là Cái gì cũng ra tiền nhé. Học xong không có việc ra tiền thì cứ tìm đến ông Nam, xin được hết :)))

    3. Không biết tiếng anh có học được lập trình không?

    CÓ GÌ MÀ KHÔNG ĐƯỢC! quan trọng là ham tìm hiểu, không biết tiếng anh thì tìm mentor hướng dẫn bằng tiếng việt.
    Tiếng anh cần để mai này ae học cái mới cho dễ, nhiều tài liệu, thế nên biết thì tốt hơn. Chứ tiếng anh không phải rào cản, lý do để ngừng học lập trình.

    4.Lập trình có yêu cầu bằng cấp không, học trường tư liệu có xin được việc

    Cái này ae hỏi cả tỉ lần rồi. Giờ nó dựa vào năng lực để trả lương, ae kiến thức ít làm được ít thì tiền ít, làm tốt thì lương cao thế thôi.
    Không cần bằng cấp, chỉ cần ae giỏi thôi. Trường tư hay công quan trọng đầu ra các ae phải có kiến thức. Nếu có kiến thức mà không có việc thì quá vô lý. Đến gặp ông Nam, Tôi check thực lực biết ngay.

    5. Em mới học lập trình thì có học được không

    Được. Không cần giải thích nhiều. Dựa vào thực tế, Mình đào tạo quá nhiều ae mới học để đi làm ngay rồi, nên khẳng định là được.

    6. Học CNTT cần những gì

    Đam mê, có chút logic, cố gắng, Laptop, lộ trình chuẩn, cần có người hướng dẫn.

    7. Cần những kỹ năng gì để đi làm.

    THÁI ĐỘ, TRÁCH NHIỆM HẾT MÌNH VÌ CÔNG VIỆC, kiến thức, kỹ năng google, kỹ năng làm việc nhóm...

    8. Máy tính nào đủ để học CNTT

    Thiết bị tùy vào mục đích học tập. Cá nhân mình nghĩ mua để học tập đủ dùng thôi, sinh viên mới nhập học nên mua máy cũ tiết kiệm tiền, mai này biết mình thích gì thì đầu tư mua sau
    Mua cũ thì mua được máy cấu hình tốt vs chi phí rẻ hơn.
    Học web: thì mua máy ram 8GB, chip i5 là vừa tầm dùng ổn - Giá tầm 9tr quay đầu
    Học App Mobile: nếu thêm được ram thì sẽ ổn định 16GB, chip i5 - giá tầm 11tr quay đầu
    Một số khái niệm :
    Ram: bộ nhớ lưu trữ trên máy tính khi chạy, tắt đi thì mất, cái gì lưu trên ram thì đọc rất nhanh. Phần mềm chạy được đều cần Ram, nên để chạy nhiều phần mềm cùng lúc ổn định cần Ram nhiều
    Chip: tốc độ xử lý, chip cao thì xử lý càng nhanh và ngốn điện, có nhiều dòng chip tiết kiện pin, tạm thời i5 là đủ dùng
    Ổ cứng: HDD loại thường, SSD: ghi đọc nhanh, đắt hơn. VD: cứ cái gì tới dùng ổ cứng thì SSD sẽ vượt trội hơn hẳn
    Chẳng hạn khởi động máy siêu nhanh, mở chương trình nhanh, copy dữ liệu nhanh ...

    ĐỊNH HƯỚNG LẬP TRÌNH

    9. Học lập trình bắt đầu từ đâu, như nào

    Thường: kiến thức trên trường học nền tảng kiến thức máy tính cả các môn đại cương bắt buộc tốn ít nhất 3 năm + 4 tháng đồ án + 6 tháng thực tập => nhanh nhất 4 năm đi làm
    Với mình thì mình khuyên mọi người đi làm sớm lấy kinh nghiệm, vừa học vừa làm. Để làm được vậy thì nên như sau:
    Học đồng thời kiến thức bên ngoài, 2 tháng nền tảng + 3 tháng tập trung làm 1 ngôn ngữ + 1 tháng project => 6 tháng đủ đi làm ngay.
    Tất nhiên là để đạt được tốc độ trên thì cần có người hướng dẫn, chứ một mình không thể đạt được tốc độ trên được.
    Bỏ tiền đi học thêm là xứng đáng, đầu tư học cho bản thân kiến thức theo mình cả đời, từ kiến thức mới kiếm tiền sớm. Suy nghĩ xa một chút, chứ đừng lãng phí khoảng thời gian sinh viên an nhàn.
    Các bạn sẵn sàng bỏ gần trăm triệu + 4 năm đại học trong khi không biết mình có việc hay không, thay vì đó bỏ khoảng 15tr vào một trung tâm họ đào tạo kiến thức trong 6 tháng có thể đi làm ngay lại đắn đo?
    Mình không hướng các bạn không theo trường mà hãy đặt câu hỏi sao mình không học cả 2 bên. Kiến thức học được có thể giúp việc học trên trường dễ hơn, điểm cao hơn...
    Nếu các bạn sẵn sàng dành thời gian khoảng 4-6 tháng xác định học tập nghiêm túc thì đến Nodemy tìm ông Nam. Mình tự tin giúp các bạn có kiến thức đi làm được.

    10. Nên học ngôn ngữ nào đầu tiên, học ra sao

    Tùy quan điểm mỗi người, thường ae hay bảo học C. Nhưng chuẩn thì các bạn nên học Java. Mà thực tế học cái gì quen cái đấy, nên tập trung một ngôn ngữ thôi, học được concept cách tạo ra 1 sản phẩm mới quan trọng.
    Có concept thì mai sau học ngôn ngữ khác cũng thế. Mà để đi ra sản phẩm nhanh nhất thì ae nên theo Javascript(JS)
    JS học 1 có thể làm web, server, mobile ... đủ cả gọi là fullstack
    Chốt ae nào theo mình thì học JS.

    11. Tài liệu học và nên học ở đâu.

    Giờ 4.0 thông tin không thiếu trên internet, google, youtube có hết, có các course trên Udemy ...
    Mình có 1 channel về JS mọi người có thể follow, Nodemy: https://www.youtube.com/channel/UCMfiIOjAzHZ9vyoqNdcPvNA
    Đó là một phần thôi, như mình nói việc các bạn học kiến thức nhưng kinh nghiệm vận dụng khi đi làm lại là khác.
    Mình rất vui nếu các bạn có thể tự học được vì tự học là cần thiết với lập trình viên. Nhưng đổi lại có kiến thức sâu, hệ thống chuẩn để đi làm nhanh nhất thì mình khuyên chân thành nên xác định đầu tư đi học.
    Các bạn bỏ công sức, thời gian, tiền bạc thì nhất định sẽ được những thứ khác biệt so với các bạn khác. Yên tâm là vậy.
    Bạn nào có ở Hà Nội có thể qua trực tiếp Nodemy gặp mình trao đổi, mình cho các bạn trải nghiệm, 1 tuần các bạn sẽ thấy khác biệt hoàn toàn.

    Nếu mọi người đọc đến đây vẫn còn thắc mắc thì các bạn để lại comment bên dưới, mình sẽ giải đáp. Ngoài ra mình có tạo 1 group trao đổi trên slack cho bạn nào thực sự quan tâm, mình sẽ tư vấn cho các bạn trên đó.
    Để tránh loãng group mọi câu hỏi tương tự hãy comment tập trung trong POST này, sẽ có người giải đáp cho bạn.

    posted in Chia sẻ
  • RE: Hiểu về Scope trong Javascript

    Bài viết rất hữu ích. Mình có bổ xung thêm,
    Lí do và chúng ta nên sử dụng let thay cho var trong vòng for vì như vậy sẽ kiểm soát được biến i khi vòng for kết thúc, đảm bảo không ảnh hưởng với những đoạn code bên ngoài về sau (nếu như code bên ngoài cũng đang sử dụng một biến tên i)

    Với var

    for(var i = 0; i < 10; i++){
    
    }
    console.log(i) // kết quả = 10
    
    

    Với let

    for(let i = 0; i < 10; i++){
    
    }
    console.log(i) // i không tồn tại, i is not defined
    
    
    posted in Tutorials
  • RE: Sprite Sheet - Khi những bức ảnh nhảy múa trên Website

    Tuyệt nhỉ,
    Cái này làm animation trong game thì tuyệt rồi.

    posted in Case Study Thực Tế
});