--------------- <> -----------------
--- KHOA HỌC - CÔNG NGHỆ - GIÁO DỤC - VIỆC LÀM ---
--- Học để đi cùng bà con trên thế giới ---

Tìm kiếm trong Blog

OOP (2) - Lập trình cấu trúc

Bài trước: OOP (1) - Lập trình tuần tự
-----

2.1.1       Lập trình cấu trúc


Trong phương pháp lập trình tuần tự, chương trình sẽ được thực thi tuần tự từng lệnh, từ trên xuống dưới. Phương pháp lập trình này không thể giải quyết được những bài toán phức tạp.

Để giải quyết những bài toán phức tạp đòi hỏi chương trình không những chỉ xử lý theo tuần tự mà còn phải có khả năng ra quyết định hoặc thực hiện lặp lại một khối lệnh cụ thể.

Phương pháp lập trình cấu trúc[1] là phương pháp lập trình không những cho phép xử lý các câu lệnh theo kiểu tuần tự từ trên xuống, mà còn có thể xử lý tùy theo tình huống và lặp lại nhiều lần. Phương pháp này sử dụng các cấu trúc điều khiển (if…else), cấu trúc lặp (while, for), các khối lệnh (block structures), và các chương trình con (subroutine).

Ví dụ, viết chương trình để thực hiện các chức năng sau:

Nhập một số nguyên dương n (n >= 0):

– Kiểm tra đầu vào, nếu không hợp lệ, cho người dùng nhập lại

– Xuất dãy số từ 1 đến n

– Tính tổng từ 1 đến n

– Tính tổng các số lẻ

– Tính tổng các số chẵn

[C++]

[C#]

[JavaScript]

-----
Cập nhật: [28/02/2020]
-----
Xem thêm: OOP (3) -
Xem thêm: Danh sách bài học

OOP (1) - Lập trình tuần tự

1.1       Lập trình là gì?


Lập trình gọi đầy đủ là lập chương trình máy tính hay lập trình máy tính (computer program). Lập trình là tạo ra chương trình cho máy tính, để thực hiện một công việc xử lý thông tin nào đó.

Chương trình là một tập các lệnh (chỉ thị) được tổ chức theo một trình tự nhất định để máy tính thực hiện.

Để lập trình cần sử dụng ngôn ngữ lập trình.

Có ba loại ngôn ngữ lập trình:

– Mã máy

– Hợp ngữ

– Ngôn ngữ cấp cao: C, C++, C#, Java, PHP, Python, JavaScript, Ruby, SQL và nhiều ngôn ngữ khác

1.2       Các phương pháp lập trình


Một số phương pháp lập trình:

– Lập trình tuần tự

– Lập trình cấu trúc

– Lập trình hướng sự kiện

– Lập trình hướng đối tượng

Lập trình tuần tự

Lập trình tuần tự (sequential programming), là cách lập trình theo kiểu tuần tự, chương trình chỉ là một dãy các lệnh được thực hiện tuần tự từ đầu đến cuối (đơn luồng).

Kiểu lập trình này đơn giản, tuy nhiên phương pháp này không thể xử lý được các bài toán phức tạp.

Cả chương trình chỉ có một hàm.

Đọc thêm về lập trình PLC (Programmable Logic Controller – bộ điều khiển logic có thể lập trình được). Lập trình PLC được sử dụng trong điều khiển máy in, máy đánh sợi, máy se chỉ, máy chế biến thực phẩm, máy cắt tốc độ cao, hệ thống phân bổ giám sát trong dây chuyền sản xuất.

Ví dụ một chương trình để điều khiển một hệ thống tự động:[1]

Khi bạn nhấn Start. Nếu có phôi ở vị trí cấp phôi thì quy trình sẽ diễn ra theo trình tự như sau:

1 Tay gắp đi qua vị trí trạm 2

2 Xy lanh đẩy phôi đi ra và kẹp phôi

3 Tay gắp quay về phía trạm 1

4 Bật giác hút lên để hút phôi

5 Xy lanh lui về (không kẹp phôi nữa)

6 Tay gắp đi về phía trạm 2

7 Nhả phôi ra

8 Tay gắp trở lại vị trí ban đầu (trạm 1) để không làm cản trở hoạt động của trạm 2

Kết thúc chu trình. Chu trình có thể tiếp tục khi bạn nhấn nút Start

Ví dụ: Viết chương trình theo kiểu tuần tự để đoán số bạn đang nghĩ trong đầu?

Thuật toán:

1. Bạn tự nghĩ ra một số (bí mật)

2. Lấy số đó cộng với 5

3. Lấy kết quả nhân với 2

4. Lấy kết quả trừ 10

5. Lấy kết quả nhân 3

6. Lấy kết quả cộng 66

7. Lấy kết quả chia 6

Nói kết quả, giáo viên sẽ nói cho bạn biết bạn đã nghĩ số nào trong đầu.

Bài tập: viết chương trình “đoán số” trên theo kiểu tuần tự bằng các ngôn ngữ lập trình C++, C# và JavaScript.

Trước khi viết một chương trình bất kì, luôn đặt ra hai câu hỏi?

– Viết mã nguồn bằng chương trình nào?

– Dùng chương trình nào để biên dịch/thông dịch mã nguồn?

Mã nguồn tham khảo,

[C++]

Muốn lập trình bằng ngôn ngữ C++, bạn có thể sử dụng chương trình Visual Studio để vừa viết mã nguồn, vừa biên dịch mã nguồn và tạo ra tập tin thực thi.

– Mở Visual Studio, vào menu File > New > Project > trong khung Templates (bên trái), chọn Visual C++ > trong khung ở giữa, chọn Empty Project > để mọi thứ mặc định, bấm OK để tạo dự án

– Trong cửa sổ Solution Explorer (khung bên phải) > chuột phải vào Source Files > chọn Add  > New > Item… > chọn C++ File (.cpp) > bấm Add để thêm tập tin mã nguồn cho dự án và sẵn sàng để nhập đoạn mã chương trình

– Nhập đoạn mã nguồn sau:

#include <iostream>
using namespace std;

void main()
{
            int n;
            cout << "Ban hay nhap mot so (bi mat): ";
            cin >> n;
            n = n + 5;
            n = n * 2;
            n = n - 10;
            n = n * 3;
            n = n + 66;
            n = n / 6;
            cout << "Ket qua la: " << n;
            system("pause"); // dung man hinh
}

– Bấm F5 hoặc Fn + F5 hoặc vào menu Debug > Start Debugging để chạy chương trình và xem kết quả. Đem kết quả tới hỏi giáo viên để biết bạn đã nghĩ số mấy trong đầu.

[C#]

Muốn lập trình bằng ngôn ngữ C#, bạn có thể sử dụng chương trình Visual Studio để vừa viết mã nguồn, vừa biên dịch mã nguồn và tạo ra tập tin thực thi.

Để tiện cho việc học C++ và C# cùng lúc, bạn nên thêm luôn vào solution đã tạo project C++ ở bước trên một project C# mới. Như vậy, một solution sẽ có hai project (một C++ và một C#). Muốn biên dịch và chạy project nào thì chuột phải vào project đó (trong cửa sổ Solution Explorer) chọn Set as StartUp Project.

– Cách thêm project C#: trong cửa sổ Solution Explorer (khung bên phải) > chuột phải vào Solution ‘tên solution’ > Add > New Project > ở khung bên trái, chọn Visual C# > ở khung giữ chọn Console Application > bấm OK để hoàn thành việc tạo project mới, sẵn sàng nhập mã nguồn.

­– Nhập đoạn mã nguồn sau:

static void Main(string[] args)
        {
            int n;
            Console.Write("Ban hay nhap mot so (bi mat): ");
            n = Int32.Parse(Console.ReadLine());
            n = n + 5;
            n = n * 2;
            n = n - 10;
            n = n * 3;
            n = n + 66;
            n = n / 6;
            Console.WriteLine("Ket qua la: " + n);
            Console.ReadLine(); // dung man hinh
        }

– Bấm F5 hoặc Fn + F5 hoặc vào menu Debug > Start Debugging để chạy chương trình và xem kết quả. Đem kết quả tới hỏi giáo viên để biết bạn đã nghĩ số mấy trong đầu.

[JavaScript]

Muốn lập trình bằng ngôn ngữ JavaScript, bạn có thể sử dụng chương trình Visual Studio Code để viết mã nguồn, dùng trình duyệt để thông dịch và thực thi mã nguồn.

– Mở VS code hoặc Sublime Text hoặc notepad hoặc một code editor bất kì

– Nhập vào đoạn mã JavaScript sau, lưu thành tập tin .html (ví dụ index.html):

<script>
            var n;
            n = prompt("Ban hay nhap mot so (bi mat): ");
            n = parseInt(n);
            n = n + 5;
            n = n * 2;
            n = n - 10;
            n = n * 3;
            n = n + 66;
            n = n / 6;
            console.log("Ket qua la: " + n);
</script>

– Mở tập tin index.html bằng trình duyệt, mở Developer Tools của trình duyệt > chọn tab Console để xem kết quả.




[1] http://www.dientuvietnam.net

-----
Cập nhật: [28/02/2020]
-----
Bạn muốn tự học HTML bài bản? Xem thêm

Làm web (js06) - JS: DOM

Bài trước: Làm web (js05) - JS: Objects
----------

6 DOM


The Document Object Model (DOM) allows you to access elements of a web page and enable interaction with the page by adding and removing elements, changing the order, content and attributes of elements, and even altering how they are styled.
In this chapter, we’ll cover the following topics:

– Introduction to the DOM

– Getting elements: getElementById, getElementsByClassName, getElementsByTagName, querySelector and querySelectorAll

– Navigating the DOM

– Getting and settings an element’s attributes

– Updating the DOM by creating dynamic markup

– Changing the CSS of an element

– Our project: we’ll dynamically insert each question into the HTML

6.1 The Document Object Model


What is DOM?

The Document Object Model, or DOM for short, represents an HTML document as a network of connected nodes that form a tree-like structure.

The DOM treats everything on a web page as a node. HTML tags, the text inside these tags, even the attributes of a tag are all nodes. The HTML tag is the root node, and every other part of the document is a child node of this.

History of the DOM (p218)

6.2 Getting elements (p221)


6.3 Setting an element’s attributes (p233)


6.4 Creating dynamic markup (p237)


-----
Cập nhật: 15/12/2019
-----
Xem thêm: Làm web (js07) - JS: Event
Xem thêm: Danh sách bài học

Học làm web (58_1) - Mini project HTML CSS

Tiếp theo của: Học làm web (58) - CSS căn bản (34)
----
Mini project (hosting, domain, git, HTML, CSS)

1) Tạo tài khoản trên hệ thống remote git bất kì (github, gitlab)

2) Tạo mỗi kho chứa cho mỗi dự án nhỏ, làm được dự án nào thì push code lên remote git

3) Tạo một hosting trên internet, tạo một trang index.html, trên đó có chứa link tới từng dự án của cá nhân

4) Mini project 1. Làm theo clip để tạo ra một số website hoàn chỉnh, học thêm về bố cục (layout) của một trang web.


5) Mini project 2. Làm theo clip để tạo một website hoàn chỉnh, đơn giản


6) Xem một số nguyên tắc khi viết mã HTML, CSS


7) Sử dụng Sublime Text hiệu quả


8) Sử dụng VS Code hiệu quả


9) Mini project 3. CSS3, Layout, Flex, Responsive, Mobile First

Xem và làm theo.

https://www.youtube.com/watch?v=8gNrZ4lAnAw

Hình ảnh và mã nguồn tham khảo: https://drive.google.com/open?id=17h5l4sLiKciOQr3afqr-Fn5rBfTULBuk

Một số ý lượm được từ clip trên:

– Để làm Front-end cần học HTML, CSS, JavaScript.

– Hai code editor được nhiều người đang sử dụng là VC code và Sublime Text.

– Khai báo class và id trong HTML để CSS và JavaScript sử dụng sau này

– HTML validation

– w3schools.com là một trong những website tin cậy để tham chiếu

– Đơn vị đo tương đối (relative) và tuyệt đối (absolute) trong CSS

– CSS functions, ví dụ: background-color: rgba(0,0,0,0.4)

– CSS media queries giúp thực hiện responsive giao diện

– Học một số lệnh cd, mkdir

– Sử dụng Live server trong VS code để tự động cập nhật kết quả trên trang web khi lập trình HTML, CSS

– Cách tổ chức bố cục (layout) của một trang web

– Để ý tính ngữ nghĩa khi dùng các phần tử HTML

– Mobile first trong HTML và CSS

– Sử dụng flex

– Tạo đường xiên của một hình bằng transform: skewY()

– Cách tạo góc nhọn của một hình bằng phần tử pseudo, ví dụ: container:before

– Responsive

10) Mini project 4. Tự làm theo mẫu có sẵn:



Hướng dẫn, gợi ý:

– Xem bố cục trang web gồm mấy vùng, tên mỗi vùng, cấu trúc cha-con

Đăt outline cho phần tử body để thấy được bố cục trên trang mẫu, thấy được quan hệ phân cấp của các phần tử

– Viết HTML, và CSS cho từng vùng

Do tính chất kế thừa của CSS, nên sẽ thực hiện CSS cho các phần tử cha trước sau đó đến các phần tử con.

Một bố cục tham khảo:

<body>
    <section id="page">
        <div id="main">
            <header id="header">
                <div class="header_top"></div>
                <div class="header_mid"></div>
                <div class="header_bot"></div>
            </header>
            <section id="middle"></section>
        </div>
        <footer id="footer"></footer>
    </section>
</body>

– fontello:


-----------
Cập nhật [09/12/2019]
-----------
Xem thêm: Tổng hợp các bài viết về Học làm web
Xem thêm: Học làm web (59) - JS căn bản (1)

DevOps (1) - Tổng quan


1         DevOps là gì


1.1       Vòng đời phát triển hệ thống


Theo wiki, Vòng đời phát triển hệ thống (tiếng Anh: Systems Development Life Cycle, viết tắt: SDLC), hay còn được gọi là Vòng đời phát triển ứng dụng (tiếng Anh: Application Development Life Cycle), là một thuật ngữ được dùng trong Công nghệ hệ thống, Hệ thống thông tin và Công nghệ phần mềm nhằm mô tả quá trình lập kế hoạch, tạo ra, kiểm thử và triển khai một hệ thống thông tin.
Tùy thuộc vào mô hình phát triển hệ thống/phần mềm khác nhau, SDLC sẽ được chia thành các giai đoạn khác nhau. Ví dụ một số mô hình phát triển hệ thống phổ biến: mô hình thác nước (water fall), mô hình chữ V (V model), mô hình xoắn ốc (spiral model), mô hình Agile/Scrum (agile/scrum model).


1.2       Mô hình thác nước


Thông thường, SDLC theo mô hình thác nước sẽ gồm các pha (stage) sau:

– Phân tích/đặc tả yêu cầu

– Thiết kế

– Lập trình

– Kiểm thử

– Triển khai và bảo trì

Xem hình minh họa,



Ưu điểm của mô hình thác nước:

– Đơn giản, dễ sử dụng

– Dễ quản lý nhờ vào tính cố định của mô hình

– Nhờ việc kiểm duyệt tại mỗi pha nên khả năng xảy ra lỗi ít

– Mỗi thời điểm chỉ thực hiện một pha, nên không có hiện tượng chồng chéo trong công việc

– Thích hợp cho các dự án nhỏ

Nhược điểm của mô hình thác nước:

– Không chấp nhận việc thay đổi các yêu cầu của dự án

– Khó quay lại bước trước, nếu các bước sau phát hiện có vấn đề cần điều chỉnh

– Quy trình làm việc nhiều rủi ro vì ít có thông tin phản hồi giữa các pha

– Không có sản phẩm phần mềm được chuyển giao cho tới thời điểm cuối của dự án

– Không thích hợp cho các dự án lớn và phức tạp, vì tính rủi ro cao của mô hình


1.3       Mô hình Agile


Mô hình Agile được đưa ra để khắc phục một số nhược điểm của mô hình thác nước. Trong mô hình Agile/Scrum, mỗi chu kì làm việc (sprint) cũng tiếp cận theo các bước gần giống với mô hình thác nước. Tuy nhiên, Agile tiếp cận theo phương pháp lặp, thường xuyên chuyển giao kết quả và nhận phản hồi của các bên liên quan để điều chỉnh một cách linh hoạt.

Xem hình minh họa,


 
Ưu điểm:

– Nhanh chóng và liên tục chuyển giao từng phần của phần mềm cho khách hàng

– Tính tương tác trong đội dự án, giữa đội dự án và khách hàng được thực hiện thường xuyên, điều này giúp thông tin được minh bạch, hạn chế tình trạng hiểu sai yêu cầu công việc

– Tính thích nghi cao với các thay đổi

– Chấp nhận thay đổi yêu cầu trong suốt quá trình thực hiện dự án

– Phù hợp với các dự án có tính sáng tạo, tính khả mở cao

Nhược điểm:

– Ít tính dự báo, dự đoán

– Dự án gặp rủi ro nếu khách hàng không hiểu rõ về sản phầm mong muốn, hoặc khách hàng không hợp tác tốt trong quá trình thực hiện dự án

– Tài liệu, thiết kế của dự án ít được chú trọng

– Khó xác định được như thế nào gọi là hoàn thành chức năng/dự án

– Tốn nhiều thời gian cho quá trình trao đổi giữa các thành viên trong đội dự án, giữa đội dự án và khách hàng


1.4       Khái niệm DevOps


Mô hình Agile đã khắc phục được một số hạn chế của mô hình thác nước, giúp gắn kết khách hàng và nhóm phát triển dự án.

Tuy nhiên trong mô hình Agile, vẫn có những khó khăn trong việc kết hợp giữa nhóm phát triển dự án và nhóm triển khai/vận hành. DevOps ra đời sẽ khắc phục được vấn đề này.

Theo wiki, DevOps (kết hợp của cụm từ tiếng Anh "software DEVelopment" và "information technology OPerationS") là một thuật ngữ để chỉ một tập hợp các hành động trong đó nhấn mạnh sự hợp tác và trao đổi thông tin của các lập trình viên và chuyên viên tin học (nhóm triển khai/vận hành) khi cùng làm việc để tự động hóa quá trình chuyển giao sản phẩm phần mềm. Nhằm giúp quá trình biên dịch phần mềm (build), kiểm tra, và phát hành phần mềm diễn ra nhanh chóng, thường xuyên, và đáng tin cậy hơn.

DevOps là một phương thức vận hành mới, giúp quá trình trao đổi và làm việc giữa các phòng: Phát triển phần mềm, Quản lý chất lượng phần mềm (QA), và phòng IT diễn ra thuận lợi; bằng cách “nhúng” một chuyên viên phòng IT vào nhóm phát triển phần mềm tạo thành một đội đa chức năng.

Xem hình minh họa,



Ở hình trên, DevOps sẽ kết nối ba phòng: Phát triển phần mềm (Development/Software engineering), Quản lý chất lượng phần mềm (QA/Quality assurance) và IT (Information technology/Operations). Phòng IT ở đây có nhiệm vụ: phát hành, triển khai, vận hành và giám sát hệ thống/phần mềm.

So sách sự khác nhau giữa phương pháp Agile và DevOps

Phương pháp Agile
DevOps
Tập trung chủ yếu vào tính cộng tác, phản hồi của khách hàng và các thay đổi nhanh gọn
Gắn nhóm phát triển và nhóm vận hành lại với nhau
Không chú trọng vào quá trình “tự động hóa” (automation)
Mục đích chủ yếu là tự động hóa để tăng hiệu quả trong quá trình tạo ra phần mềm
Tập trung nhiều vào giai đoạn phát triển phần mềm (development process), ít tập trung vào quá trình kiểm thử và triển khai
Tập trung vào cả quá trình phát triển, kiểm thử và triển khai.
Gắn kết khách hàng và nhà phát triển
Gắn kết nhóm phát triển và nhóm triển khai


1.5       Vòng đời DevOps


Xem hình minh họa về Vòng đời Devops,



Vòng đời DevOps gồm có các bước sau[1]:

– Code: bước đầu tiên của vòng đời là lập trình, các lập trình viên viết mã cho chương trình

– Build: biên dịch và tạo ra một phiên bản của chương trình

– Test: kiểm thử phần mềm một cách tự động bằng các công cụ hỗ trợ (ví dụ Selenium).

– Release: phát hành

– Deploy: triển khai

– Operate: vận hành

– Monitor: giám sát hiệu xuất ứng dụng, phản hồi, trải nghiệm người dùng

– Plan: dựa trên các thông tin thu thập được của quá trình monitor, thực hiện các thay đổi để nâng cao hiệu năng của hệ thống

1.6       Các giai đoạn chính của DevOps


Các bước trong vòng đời của DevOps có thể chia thành các giai đoạn sau:

– Continuous development

– Continuous testing

– Continuous integration

– Continuous deployment

– Continuous monitoring


Xem hình minh họa[1],



-----
Cập nhật: [19/02/2020]
-----
Xem thêm: DevOps (2) -
Xem thêm: Danh sách bài học