Nếu bạn mới bắt đầu học lập trình web, bạn sẽ cảm thấy khá lúng túng trước khá nhiều thuật ngữ mới trong lĩnh vực này. Tài liệu này sẽ giúp bạn làm quen với một số khái niệm lập trình web cơ bản, khởi đầu cho quá trình tự học lập trình web của bạn sau này được dễ dàng hơn.

WWW – World Wide Web

World Wide Web (WWW, thường được gọi tắt là Web) là một trong những dịch vụ được dùng rất phổ biến trên Internet. Được xây dựng chủ yếu trên nền văn bản, đồ họa và các hiệu ứng tương tác, Web càng được sử dụng phổ biến và giờ đây đã là một phần quen thuộc của cuộc sống. Tuy nhiên, để tạo được các trang web “động”, có tương tác với người dùng, thông tin được cập nhật thường xuyên, có kiểm tra dữ liệu nhập, có hiệu ứng chuyển động, … bạn phải lập trình cho các trang web. Lập trình web sẽ giúp cho các trang Web của bạn cuốn hút người dùng hơn, tạo ấn tượng với người xem hơn nhờ bạn có thể chủ động lập trình “điều khiển” các nội dung của trang Web theo ý mình.

HTTP – HyperText Transfer Protocol

HTTP, giao thức chuyển giao siêu văn bản trên Web, được xem như là một ngôn ngữ “nói chuyện” giữa Web clients và Web servers. Giao thức này là tập hợp các qui định dùng để trao đổi các tài liệu (văn bản, hình ảnh, âm thanh, video, các tập tin đa truyền thông,…) giữa Web server và trình duyệt Web. Người ta gọi giao thức HTTP là giao thức phi trạng thái (stateless) bởi mỗi lệnh đều được thực thi một cách độc lập, lệnh sau không biết gì về lệnh trước đó.

URL – Uniform Resource Locator

Khái niệm này ra đời cùng lúc với Internet, vấn đề đặt ra lúc đó là cách thức qui định đặt tên địa chỉ như thế nào nhằm mục đích để giúp cho người dùng dễ dàng truy cập đến nguồn tài nguyên trên Web. Vậy URL là gì?, đó chính là một địa chỉ trên Internet, cú pháp đầy đủ của URL có dạng : scheme://<host> [:port] [<path> [?<querystring>]] Trong đó:

• scheme: lọai dịch vụ Internet, với dịch vụ thông dụng nhất là http dùng để truy cập tài nguyên tại các Web server;
• host: địa chỉ máy chủ chứa tài nguyên (ví dụ www.w3schools.com, www.vnexpress.net,…);
• port: cổng dịch vụ trên máy chủ, giá trị này có thể bỏ trống và có giá trị là 80 nếu lọai dịch vụ là http;
• path: đường dẫn và tên của tập tin tài nguyên trên máy chủ;
• querystring: các tham số được gửi kèm theo http để cung cấp thêm thông tin, phục vụ cho xử lý nào đó tại Web server.                                                                                                                                                         Đối với các trang web tĩnh, là các trang web nội dung thường ít được cập nhật sửa đổi, tham số querystring  thường không thấy.

Ví dụ: http://www.legend.net.uk/resources/gloss.html http://www.tuoitre.com.vn/Tianyon/Index.aspx?ArticleID=238657&ChannelID=3

HTML – HyperText Markup Language

Khi bạn sử dụng trình duyệt (Web browser) để duyệt trang Web nào đó bạn sẽ thấy trong trang Web luôn có các liên kết siêu văn bản – HyperText (một từ, một câu, một hình ảnh,… trong trang Web) mà khi click vào sẽ đưa bạn đến trang Web khác). Những liên kết kết siêu văn bản chính là đặc trưng của WWW nên các trang Web thường được gọi là các tài liệu siêu văn bản. Để xây dựng các tài liệu này, bạn sẽ sử dụng ngôn ngữ HTML (HyperText Markup Language – Ngôn ngữ đánh dấu siêu văn bản) là ngôn ngữ quy định cách định dạng văn bản để đưa lên Web cùng với sự xác định các mối liên kết siêu văn bản. Như vậy, trang web (trang HTML) là tập hợp gồm những dòng văn bản và các thẻ đánh dấu (Tag) theo cấu trúc và trình tự xác định. Các thẻ HTML này sẽ quy định cách hiển thị văn bản, hình ảnh…. trên trình duyệt để các trình duyệt Web có thể hiểu và hiển thị thông tin theo ý bạn. CSS – Cascading Style Sheets

Style Sheet là gì?

Là một tập hợp các qui định về cú pháp khai báo dùng để định dạng trang web, chính xác hơn là nơi dùng để định nghĩa các style. Giả sử, trong một trang web, bạn muốn tất cả các tag <h1> có chữ màu đỏ, thông thường bạn sẽ sử dụng thuộc tính style và khai báo cho từng tag <h1>. Nhưng đối với Style Sheet thì bạn sẽ khai báo một lần và áp dụng cho toàn bộ trang web hoặc cho cả website. Nói đơn giản hơn, Style Sheet giống như là một quy tắc dùng để “trang trí” trang web.

Cascading Style Sheets

CSS là một chuẩn của Internet do W3C định nghĩa và chính thức giới thiệu vào tháng 12/1996. Sở dĩ gọi nó là Cascading (xếp tầng) là vì hiệu ứng của style có thể được kế thừa từ các tag khác, nếu style được định nghĩa trong một tag cha thì các tag con (nằm trong tag cha) sẽ kế thừa style đó. Ví dụ: 3 dòng văn bản sau đều có màu đỏ, vì kế thừa style của tag <p>

<p style=”color:red”>

<b>Trung Tâm Tin Học</b> <br>

Đại Học Khoa Học Tự Nhiên TP.HCM<br>

<font size=”+4″><i>Thông báo chiêu sinh khóa 155</i></font>

Ngôn ngữ lập trình JavaScript 

JavaScript là ngôn ngữ kịch bản (scripting language) dùng để tương tác với các trang HTML dựa trên đối tượng (object-based scripting language ). Các chương trình JavaScript thường được nhúng (embedded) trực tiếp vào tập tin HTML bằng tag <script> hoặc tích hợp (integrated) vào trang web thông qua một tập tin được khai báo trong tag <link>.

JavaScript có một số đặc điểm sau:

• Là một ngôn ngữ thông dịch(interpreted language), nghĩa là các script thi hành không cần biên dịch trước (precompile). Trình duyệt dịch script, phân tích và thi hành ngay tức thời.
• Lập trình theo cấu trúc (Structured progarming)
• Giống như C và Java, có phân biệt chữ HOA và thường Hiện nay đa số các trình duyệt đều hỗ trợ JavaScript nên các trang web có Javascript có thể chạy trên bất kỳ trình duyệt nào. Để học JavaScript một cách hiệu quả, bạn nên áp dụng phương pháp “học qua ví dụ” (Learning By Example), đương nhiên là bạn phải có nền tảng căn bản trước đó. Hiện nay trên internet bạn có thể tìm thấy vô số các đoạn JavaScript từ đơn giản đến phức tạp, bạn có thể lấy về dùng mà không cần phải tìm hiểu chi tiết tường tận, chỉ cần biết cách khai báo sử dụng trong trang HTML của mình là có thể quan sát để hiểu ý nghĩa của đoạn code đó.

Lập trình front-end

Lập trình viên Front – End là người xây dựng các chức năng giao tiếp, tương tác trực tiếp với người dùng. Khi bạn duyệt các trang web, từ font chữ, màu sắc cho tới các menu chọn và các thanh trượt, các hình ảnh chuyển động quảng cáo, các hiệu ứng chuyển màu hay di chuyển văn bản, hình ành… đều là tác phẩm của Lập trình viên Front – End. Các Lập trình viên Front-end sẽ chịu trách nhiệm thể hiện giao diện của trang web theo đúng yêu cầu thiết kế , những tương tác, chuyển động theo đúng ý tưởng sáng tạo sao cho mang lại cho người dùng những trải nghiệm giao diện ấn tượng, bắt mắt và phong cách nhất.

Front-end cơ bản

Lập trình front-end ở mức cơ bản chỉ cần thông thạo HTML, CSS, và JavaScript để làm chủ giao diện người dùng với font chữ, màu sắc, thanh trượt, thực đơn, hình ảnh, hiệu ứng tương tác,…

Front-end nâng cao 

Ngoài các kiến thức cơ bản, các lập trình viên front-end cần phải làm quen với các framework như Bootstrap để đảm bảo nội dung có thể hiển thị tốt trên mọi thiết bị khác nhau, các trình duyệt khác nhau và AngularJS để cải thiện tốc độ tương tác cũng như bổ sung các hiệu ứng chuyển động đẹp mắt, ấn tượng vào ứng dụng web một cách nhanh chóng hơn.

Lập trình back-end

Lập trình web không chỉ có những cần giao diện ở front-end mà cần những dữ liệu, xử lý ở mức server. Hay nói cách khác, để có được những gì thể hiện trên website ở front-end phải có các dữ liệu, thông tin từ các chức năng do lập trình web back-end cung cấp. Từ “hậu trường”, lập trình viên back-end sẽ xây dựng và thực hiện các giải thuật để tính toán, truy cập và xử lý dữ liệu để cung cấp chính xác, nhanh chóng theo các yêu cầu nhận được.

Có rất nhiều ngôn ngữ để lập trình back end như: PHP, ASP.NET, Java, Python,… cho phép bạn viết các đọan mã lệnh (source code) mà sẽ được biên dịch và thi hành tại Web server, sau đó trả kết quả về client dưới dạng HTML, CSS và JavaScript. Với lập trình back-end, bạn có thể lập trình, xây dựng các trang web động, có tương tác với cơ sở dữ liệu và kết nối với các dịch vụ Web Service phục phục vụ đa dạng yêu cầu của người dùng trong thực tế.

Hiện nay, các thông tin tuyển dụng Lập trình viên back-end khá cao và thường yêu cầu ứng viên có thêm kiến thức, kinh nghiệm liên quan đến các framework MVC, có kiến thức về web server và các phần mềm quản lý phiên bản như Git/SVN.

Lập trình Full-stack

Nhưng để có được ứng dụng hoàn chỉnh, nếu chỉ có lập trình viết mã lệnh không thì chưa đủ. Bạn sẽ cần có cơ sở dữ liệu để lưu thông tin của ứng dụng, bạn cần có web server, hệ điều hành để có thể deploy ứng dụng mà từ đó người dùng có thể khai thác được. Tập hợp tất cả các phần mềm, công nghệ này tạo thành solution stack, hệ thống nền tảng để ứng dụng có thể hoạt động được.

Một số solution stack thông dụng

LAMP-Stack, được dùng khá phổ biến, hầu hết các website đều sử dụng stack này và các hosting cho PHP cũng đang dùng stack này.

WAMP-Stack tương tự như LAMP Stack nhưng khác ở hệ điều hành Windows. WAMP Stack được dùng trong học tập, nghiên cứu nhiều hơn do đã quá quen thuộc với hệ điều hành Windows.

WINS – Stack này bao gồm các công nghệ của Microsoft. Trong đó Windows là hệ điều hành, web server là Internet Information Services c, .NET là môi trường phát triển ứng dụng khá phổ biến với ngôn ngữ lập trình hướng đối tượng C# và SQL Server là hệ quản trị cơ sở dữ liệu quan hệ. Đây là lựa chọn cho các giải pháp mang tính thống nhất vì việc phối hợp giữa các thành phần sẽ dễ dàng hơn và mang tính bảo mật khá ổn định hơn. Nếu bạn chọn mình trở thành Lập trình viên Full-stack, ngoài kiến thức lập trình back-end, bạn cần có kiến thức IT tổng quát và khả năng tìm hiểu sâu khi cần thiết bất kỳ vấn đề gì về hệ điều hành, Web Server, cơ sở dữ liệu, web framework. Bạn có thể tham khảo các giải pháp hiện nay đang áp dụng tại các doanh nghiệp tại Việt Nam để chọn cho mình hướng đi phù hợp.

Facebook Hacker Cup là một kỳ thi Thuật Toán rất nổi tiếng của Facebook, và mỗi năm số người người tham dự ngày một đông. Một số người cho rằng, tham dự những kỳ “thi thố” để làm gì? Thật ra những người trong giới thuật toán tham dự các kỳ thi, nó không đơn thuần mang ý nghĩa “thi thố” hay “thể hiện” mà nó còn là dịp để các họ rèn giũa lại kiến thức của mình. Luyện “não” cũng giống như tập “gym” vậy, bạn luyện đều đặn và đúng cách “não” sẽ khỏe mạnh và làm việc được lâu dài. Ngược lại nếu bạn bỏ bê chúng, một ngày nào đó não sẽ có “bụng bia” 😀

Petr Mitrichev

Tiancheng Lou

Khúc Anh Tuấn

Tomek Czajka

Jakub Pachocki

Gennady Korotkevich

Dmytro Soboliev

Gleb Evstropov

Computer science: Khoa học máy tính

Graphs (Đồ thị)

Directed Graphs

Undirected Graphs

Shortest Paths

Spanning Trees: Cây khung

1 – Sử dụng Latex

Website có hỗ trợ công cụ viết công thức toán học Latex. Mình xin được giới hiệu cách sử dụng ở dưới đây

• Bài viết nào dùng đến Latex thì bắt buộc phải thêm một dòng ở trên cùng
  • Viết cùng trên một dòng thì dùng: $...$
  • Viết công thức trên cả một dòng thì dùng: $$...$$

Thí dụ:

[mathjax]

Bài viết này sử dụng Latex. Test...

$a^2 + b_i^3 \ge c_{i+1}^5 + d_{x+1}^{y+1}$

2 – Tránh lỗi khi chèn code

Hầu hết các bài viết các bạn đều chèn code vào, nhưng nhiều bạn chèn code vẫn chưa đúng cách, gây lỗi. Nên mình xin được hướng dẫn cách chèn code và chú ý khi chèn code để không bị lỗi.

Tab “Trực quan” và Tab “Văn bản”

Khi soạn thảo, bạn có 2 tab là “Trực quan”” và “Văn bản”.

• Tab “Trực quan” là soạn thảo văn bản tương tự như Word
• Tab “Văn bản” là chỉnh sửa văn bản dạng HTML. Đây là tab mà bạn chèn code

Lỗi khi soạn thảo các bạn cần chú ý ở đây là:

• Không viết chèn code ở tab “Trực quan”, phải chèn ở trong Tab “Văn bản”
  • Bươc 1: Mở tab “Văn bản”
  • Bước 2: Chèn đoạn HTML với mẫu: <pre lang=”ten_ngon_ngu_lap_trinh”>Viết code ở đây</pre>
    • ten_ngon_ngu_lap_trinh là c, cpp, python, php, java, … Xem thêm ở GeSHi

Vd:

<pre lang="cpp">
int a, b;
int c,d;

• Chú ý 2: Sau khi chèn code, việc chuyển đổi giữa 2 tab “Trực quan” và “Văn bản” sẽ gây lỗi. Ví dụ:
  • < thành &lt;
  • > thành &gt;
  • …
• Vì vậy nên soạn thảo trên tab “Trực quan” xong xuôi thì mới chuyển sang tab “Văn bản” để chèn code. Tránh hành động chuyển đổi giữa 2 tab sẽ gây lỗi cho code.