Web development là gì?
Web development là một thuật ngữ gì đó mơ hồ được sử dụng để miêu tả việc xây dựng hay duy trì các trang web được lưu trữ trên Internet. Tôi sử dụng từ “mơ hồ” bởi vì có rất nhiều ngôn ngữ lập trình, nhiều framework các công cụ được sử dụng cho phát triển Web. Web development có thể chỉ là một trang web duy nhất được xây dựng bởi HTML và CSS với vài trăm đoạn mã. Có thể tham khảo trang web của Facebook, trang web được cho là chứa khoảng 60 triệu đoạn mã, tham khảo tại How Many Lines of Code?.
Nội Dung:
- 1. Giới thiệu
- 2. Web development là gì?
- 3. Lịch sử của web development.
- 4. Cách hoạt động của web.
- 5. Các công nghệ phát triển Web.
- 6. HTML
- 7. CSS
- 8. JavaScript
- 9. Rendering: sever-side
- 10.Rendering: client-side
Giới thiệu
Tôi sẽ trung thực với bạn rằng: tôi không phải là fan hâm mộ lớn của web development.
Đừng bảo tôi sai, tôi đã thực hiện nhiều dự án phát triển web. Nhưng so với phát triển ứng dụng deskop, ứng dụng di động, phát triển web tốt và phức tạp hơn.
Giống như phát triển web hoặc là không, với một nhà phát triển phần mềm bạn phải biết về nó ít nhất là những thứ cơ bản.
Hiện tại, hầu hết các nhà phát triển phần mềm đa số là web developer.
Đó là điều chính xác, web development đã có trên toàn thế giới. Nó như là một chú “King Kong” trong nền phát triển phần mềm.
Phát triển ứng dụng desktop thường là tiêu chuẩn, nhưng hiện tại nó đã dần chuyển sang hoặc đã thay thế bằng các ứng dụng chạy trên nền Web và tương lai vẫn sẽ tiếp tục như vậy.
Với sự phát triển nhanh chóng của ứng dụng di động, phát triển web vẫn còn rất quan trọng, bởi vì khi điện thoại di động và các máy tính bảng tăng cường, việc tạo ra các ứng dụng đa nền tảng sẽ trở nên dễ dàng hơn bằng cách tạo cho chúng các ứng dụng web và chạy trên các trình duyệt.
Điều này có nghĩa là nếu bạn có muốn trở thành một nhà phát triển web hay không, chí ít bạn cũng nên biết một chút về phát triển web, web hoạt động thế nào kèm theo các công nghệ liên quan đến nó.
Trong bài này, chúng ta sẽ đề cập một số vấn đề cơ bản:
Web development là gì?
Bản thân phát triển web và cách thức nó đã làm đã thay đổi rất nhiều trong nhiều năm qua. Nhưng có một điều vẫn giữ nguyên là: web development là tạo các ứng dụng web để chạy trên các trình duyệt web.
Một số ứng dụng sử dụng các logic của chúng ở trên server để tạo ra HTML, CSS và JavaScript để tạo ra các ứng dụng.
Các ứng dụng khác chỉ sử dụng server để tạo ra các trạng thái ban đầu, tải các đoạn mã nguồn, logic để chạy ứng dụng sau đó sử dụng server chỉ để lấy hoặc lưu trữ dữ liệu.
Có thể có nhiều cách để phát triển web, các công nghệ cơ bản là như nhau: HTML, CSS và JavaScript.
Các nhà phát triển web ngày nay sử dụng rất nhiều ngôn ngữ lập trình quan trọng để tạo các ứng dụng web. Một số ngôn ngữ phát triển web phổ biến nhất không theo thứ tự cụ thể:
Tài liệu tham khảo: Wikipedia: Programming languages used in most popular websites
Điều này là khả thi, vì giao diện phía người dùng của một ứng dụng web về cơ bản có thể dùng HTML, CSS và JavaScript để tạo ra.
JavaScript được sử dụng để thao tác trên DOM (viêt tắt của Document Object Model), nó thường được dùng để thay đổi giao diện của một trang web mà không cần phải thay đổi cấu trúc của HTML, CSS.
Tóm tắt lịch sử của web
Hãy nói về lịch sử phát triển web. Ngày hôm nay là một thời điểm tốt để nói về “phát triển web là gì?”.
Phát triển web bắt đầu ở một nơi rất khác với một mức độ khác hơn bây giờ.
Thời kỳ đầu của phát triển web chủ yếu là tạo ra các trang web tĩnh, điều hướng được thực hiện duy nhất bởi các liên kết.
Thời kỳ đầu các nhà phát triển web đã không thực sự tạo ra “ứng dụng”. Họ tạo ra tập hợp các trang web tĩnh được sử dụng để truyền tải thông tin và có lẽ thêm vào đó là một vài hình ảnh minh họa tất cả được kết nối lại bằng các siêu liên kết.
Để phát triển web trở nên hữu ích hơn cần có cách để làm cho các trang web có tính tương tác hơn và tạo ra một số nội dung (hoặc nhiều nội dung khác) có điều kiện cũng như theo giõi các trạng thái khác trong đó.
Thời kỳ đầu của phát triển web sử dụng một công nghệ gọi là CGI để tạo ra các ứng dụng web sớm nhất mà có thể tạo ra HTML tùy thuộc dữ liệu giống như các chuỗi truy vấn được gửi từ trình duyệt đến máy chủ.
Sau đó, đến sự phát triển web cùng với các framework đã được thiết kế cho CGI và tạo ra HTML một cách linh động và dễ dàng hơn.
Bạn đã từng nghe các công nghệ như ColdFusion hoặc ASP. Đây là những framework ở thời kỳ đầu để phát triển web trở nên dễ dàng.
Giờ đây, một nhà phát triển web cần phải tạo HTML cùng hỗn hợp các thẻ đặc biệt và đánh dấu để làm cho HTML có điều kiện và có thể thực hiện các logic nhất định để xác định những HTML phù hợp, thích ứng để sản xuất các trang web nhất định.
Loại công nghệ này hoạt động như một ngôn ngữ khuôn mẫu, và cho phép phần lớn các nhà phát triển tạo ra các ứng dụng web khi lần đầu tiên sử dụng.
Cuối cùng với sự phát triển của công nghệ trình duyệt và máy tính càng ngày càng nhanh hơn và cũng như nhu cầu về các ứng dụng phức tạp ngày càng tăng- JavaScript đã bắt đầu được sử dụng để mở rộng các chức năng của nhiều ứng dụng web.
CSS cũng đã xuất hiện trong khoảng thời gian này để để dễ dàng tạo kiểu dáng và thay đổi các kiểu dáng của nhiều ứng dụng web bằng cách sử dụng HTML làm vai trò xác định nội dung và css làm vai trò xác định các cách sắp đặt cũng như kiểu dáng của nội dung đó.
Các nhà phát triển đang cố gắng tìm cách để làm cho web càng ngày càng linh động hơn nữa.
Việc hiển thị mọi thứ từ máy chủ thì rất chậm và khó có thể đáp ứng hết những yêu cầu đó. Vì vậy các công nghệ như AJAX (Asynchronous JavaScript and XML) đã được tạo ra để các trang web cập nhật tự động mà không cần phải làm mới lại trang.
Cuối cùng toàn bộ ứng dụng web được xây dựng tự động mà không cần bất kỳ trang nào phải làm mới. Những loại ứng dụng web này là SPAs hoặc Single Page Applications. Đã bao giờ trên một website bạn nhập đầy đủ thông tin vào form nhấn nút “refresh’ và trang không được tải lại? Đó là khả năng của AJAX, nó có thể làm cho trang web tự thay đổi nội dung mà không cần phải tải lại trang web, một công cụ khá thú vị.
Web sẽ tiếp tục phát triển ngày càng giống các ứng dụng chạy trên desktop, cùng với trình duyệt, nó sẽ hoạt động như một hệ điều hành.
Trong thực tế, điều này đã trở nên đúng đắn mà google đẵ tạo ra được một hệ điều hành dựa trên nền web gọi là Chrome OS, trong đó hệ điều hành cơ bản là trình duyệt web chrome. Một ngày nào đó, mọi thứ sẽ được lưu trữ trên web vì các trình duyệt sẽ đủ mạnh để chạy mọi thứ. Nó dần trở thành hiện thực vì ngày càng nhiều ứng dụng, công nghệ dựa trên điện toán đám mây xuất hiện.
Cách hoạt động của web
Thật khó để hiểu web development là gì nếu như bạn không có một số ý tưởng về cách hoạt động của nó.
Đã có một số điều đã thay đổi theo từng năm, nhưng chức năng của nó cũng như những công nghệ cơ bản hầu như không thay đổi.
Hãy xem xét một lời giải thích ngắn gọn này và cơ bản này về sự hoạt động của web:
trước hết, chúng ta phải có một trình duyệt web.
Trình duyệt web có thể phân tích cú pháp và render HTML và CSS thành một định dạng, một nội dung chúng có thể nhìn thấy gọi là một “web page”.
Một trình duyệt web có khả năng thực thi các đoạn mã JavaSccript để làm các chức năng khác nhau bao gồm sửa đổi cấu trúc của một trang web.
Trình duyệt web sẽ phải gửi một yêu cầu đến máy chủ để lấy được một trang web đã được render.
Điều này được thực hiện thông qua một giao thức được gọi là HTTP hoặc Hypertext Transfer Protocol.
Khi một yêu cầu cho một nguồn tài nguyên cụ thể hoặc URI được gửi đến một máy chủ web, máy chủ web đó sẽ tìm thấy nội dung yêu cầu đó - nếu nó tồn tại - và gửi trả lời cho trình duyệt.
Trình duyệt sẽ phân tích và thực hiện phản hồi đó, đó là những gì người dùng cuối sẽ được nhìn thấy trong trình duyệt web.
Bây giờ, rõ ràng là có rất nhiều điều sẽ xảy ra dưới dạng những bản “covers”, nhưng ý tưởng cơ bản là trình duyệt web sẽ đưa ra các yêu cầu và máy chủ sẽ phản hồi bằng cách trả về các yêu cầu đó với HTML, CSS và JavaScript.
Tại sao bạn phải cần hiểu những điều quan trọng này nếu bạn muốn làm một nhà phát triển web?
Bởi vì, bạn có thể tưởng tượng rằng một ứng dụng web phải có những chức năng, ý tưởng phải có một chút khác biệt với những ứng dụng cho máy tính để bàn thông thường. Các ứng dụng web phải liên tục gửi yêu cầu lên máy chủ cho mọi hành động xảy ra trong ứng dụng ( tôi đang tổng quát hóa, nhưng điều này chủ yếu là đúng).
Khi bạn sử dụng một ứng dụng máy tính, bạn có thể lưu giữ các trạng thái bộ nhớ khác nhau trong bộ nhớ và khi bạn chuyển sang một trang hay các section của ứng dụng bạn vẫn có thể truy cập dữ liệu của trạng thái đó.
Với các ứng dụng web, bạn phải làm việc với thực tế và xoay quanh giao thức HTTP.
Bạn phải có một số cách để quản lý trạng thái giữa các yêu cầu và theo dõi các hoạt động cá nhân của người dùng đang sử dụng ứng dụng web.
Hiện tại, chắc chắn sẽ có các framework các pattern sẽ làm điều đó dễ dàng hơn, nhưng điều quan trọng bạn phải hiểu rằng web development rất khác so với phát triển các loại ứng dụng khác.
Các công nghệ chính để phát triển web
Được rồi, bây giờ bạn đã có những điều cơ bản về cách hoạt động của web và hiểu một chút về cách mà một trang web phát triển theo thời gian, chúng ta hãy nói một chút về một số công nghệ phát triển web phổ biến nhất mà bạn có thể gặp phải:
HTML
Đây à chìa khóa để phát triển web, tất cả web development phải chứa HTML bởi vì HTML là một khối cơ bản để xây dựng trang web.
Bạn có thể xây dựng một ứng dụng hoàn toàn chỉ sử dụng HTML - mặc dù nhiều người sẽ không thực sự làm điều đó ( tôi sẽ gọi nó là một trang web).
HTML, hoặc (Hypertext Markup Language), được sử dụng để chỉ định định dạng và cách bố trí nội dung của một trang web.
HTML bao gồm một loạt các thẻ xác định các phần và thành phần của một trang web.
Một ví dụ cơ bản bạn phải sử dụng thẻ <img /> để nhúng ảnh vào các trang web.
Một trình duyệt web sẽ phân tích cú pháp HTML và kết hợp với CSS và JavaScript để hiện thị ra nội dung của trang web.
CSS
Trước khi CSS xuất hiện, HTML được sử dụng để chỉ định format của một trang web, làm thế nào để những format của HTML có thêm kiểu dáng và hiển thị đẹp hơn?
Vấn đề ở đây là làm thế nào để thay đổi kiểu dáng của một trang web - ví dụ: làm thế nào để thay đổi màu sắc của các “button” khác nhau? HTML sẽ phải thay đổi rất nhiều nơi trong ứng dụng web.
CSS được phát minh để giải quyết những vấn đề này bằng cách tách biệt ràng nội dung của trang web khỏi kiểu dáng của nó (đôi khi vẫn có sự trùng lặp)
CSS (Cascading Style Sheets) có thể được liên kết đến trong một trang web để xác định kiểu dáng cho trang web đó.
Một ứng dụng web có thể liên kết với tập hợp các trang CSS để thiết lập kiểu dáng cho toàn bộ ứng dụng web.
Sau đó, nếu bạn muốn thay đổi màu của một nút, bạn chỉ có thể sửa đổi một tệp CSS và tất cả các nút cho toàn bộ ứng dụng web sẽ thay đổi theo.
Đây là một công nghệ rất hữu ích.
Nếu bạn sử dụng tốt CSS, có khá nhiều điều bạn có thể làm như thay đổi kiểu dáng trình bày của một trang web, làm cho các phần tử của một trang web có thể từ từ biến mất, từ từ hiện ra, thay đổi font-size của chữ, tạo hiệu ứng… và bất cứ thứ gì bạn có thể tưởng tượng ra.
JavaScript
Khi JavaScript xuất hiện lần đầu tiên, nó là một ngôn ngữ mới được sử dụng để làm một số việc rất cơ bản trên các trang web, nhưng JavaScript đã phát triển để nhanh chóng để đóng một vai trò trung tâm hơn trong phát triển web.
Đây là trái tim của một ứng dụng web, JavaScript là một ngôn ngữ động đầy đủ chức năng có thể được thực hiện trực tiếp trong trình duyệt web.
JavaScript làm cho các trang web có tính tương tác hơn và cho phép vận hành các chức năng của trang web và nội dung của chúng.
JavaScript có thể trực tiếp tương tác với DOM của một trang web, đó là cấu trúc cơ bản của nó.
Bằng cách sử dụng JavaScript để thao tác DOM, toàn bộ cấu trúc và phong cách của một trang web có thể được thay đổi theo sự lập trình.
Trong các ứng dụng web, điều này xảy ra bên trong trình duyệt (trừ khi bạn đang sử dụng một công nghệ như Node.js, chạy JavaScript trên máy chủ để nhận và xử lý các yêu cầu và gửi phản hồi về client).
Rendering: Server-Side
Trước khi tôi có thể tổng kết những điều cơ bản về phát triển web, chúng ta cần phải nói về sự khác biệt giữa render phía máy chủ(server-side rendering) và rendering phía máy khách(client-side rendering), bởi vì chúng có thể khá khó hiểu.
Hãy bắt đầu với server-side rendering
Trong mô hình phát triển web đơn giản nhất, tất cả các trang web được hiển thị trên máy chủ và HTML, CSS và JavaScript của trang đó được gửi đến trình duyệt web, ở đó nó được phân tích cú pháp và hiển thị cho người dùng.
server-side rendering chỉ đơn giản có nghĩa là các trang được xây dựng đầy đủ bởi những logic trên máy chủ.
Vì vậy, với server-side rendering, các logic của ứng dụng đa số “sống” trực tiếp trên hoàn toàn trên máy chủ.
Như chúng ta đã nói ở trong phần lịch sử của web, đây là cách ban đầu hầu hết các ứng dụng web hoạt động.
Ngày nay, các công nghệ như ASP.NET hay PHP vẫn chủ yếu sử dụng mô hình này, mặc dù với việc sử dụng các framework JavaScript khác nhau, ngay cả một công nghệ render phía máy chủ cũng có thể được sử dụng để render phía máy khách.
Client-Side Rendering
Với khả năng ngày càng tăng của các trình duyệt và các JavaScript Engine trong các trình duyệt, đã có một chuyển động mạnh mẽ đối với việc được gọi là rendering phía máy khách.
Về mặt rendering phía máy khách đơn giản có nghĩa là nội dung của trang web được xây dựng trong trình duyệt-thông qua JavaScript-thay vì trên máy chủ.
Với rendering phía máy khách, bạn hầu như có thể nghĩ đến máy chủ web cung cấp một "ứng dụng" cho trình duyệt và trình duyệt sẽ thực hiện nội bộ đó để hiển thị các trang, tạo các điều hướng và yêu cầu thêm dữ liệu từ máy chủ.
Đằng sau đó, JavaScript đang được sử dụng để tạo và thao tác với các phần tử DOM và thậm chí sản xuất HTML hay CSS là một phần của trang web hoặc trong trường hợp này đó là ứng dụng web.
Như bạn có thể tưởng tượng, render phía máy khách sẽ hiển thị nội dung liền mạch hơn với người dùng cuối bởi vì không cần phải gửi yêu cầu trở lại máy chủ để có các trang mới được hiển thị, chỉ cần có yêu cầu thêm dữ liệu, sau đó dữ liệu đó sẽ "cắm vào" trang web động.
Đây là lý do tại sao một số ứng dụng được rendered phía máy khách được gọi là SPAs.
Thông thường chỉ có một trang và nội dung của trang đó được cập nhật động.
Cả hai kỹ thuật thậm chí có thể được kết hợp trong một ứng dụng web duy nhất, nơi một số phần của giao diện người dùng được hiển thị phía máy khách và các phần khác và các trang được hiển thị phía máy chủ.
Bài viết được dịch từ: https://simpleprogrammer.com/what-is-web-development
Đăng ký thực tập Web basic with HTML5, CSS3 and JavaScript tại Techmaster: https://goo.gl/cYzx53
Bình luận