Liên HệBạn muốn đặt quảng cáo của mình trên BlogIT? Vui lòng liên hệ Quản trị viên.

Lập Trình Web Frontend/UI/UX một bước tiến hóa mang tính cách mạng

Hãy chia sẻ bài viết để nhận thưởng Coins.

Thế nào là Frontend Development

Để nói về Web Frontend Development, chúng ta nên lùi lại cách đây khoảng hơn 10 năm (khoảng những năm 2005 – 2007, tính từ 2019 khi viết bài này), Frontend ở đây nói về việc xây dựng giao diện người dùng cho trang web, từ việc thiết kế bố cục trang, tạo dựng hình ảnh, banner cho đến nội dung trang web. Nói ngắn gọn và chúng ta sẽ tạo nên giao diện người dùng cho một trang web để người dùng có thể tương tác tốt với website, việc tưởng chừng như khá đơn giản, nếu là một Website tĩnh không có cơ sở dữ liệu (CSDL) thì việc dựng lên bố cục, tạo ra các trang liên kết, thêm hình ảnh, nội dung cần có trên trang web là coi như xong việc xây dựng Frontend.

Khá đơn giản đúng không nào, nói đến Frontend lúc đó thường người ta không đặt nặng các vấn đề phát triển lên nó, việc xây dựng frontend cũng không tốn quá nhiều công sức và định nghĩa thế nào là Frontend Dev thực ra cũng chỉ là vậy.

Những bước tiến hóa ban đầu

Từ những năm sơ khai của thiết kế Website (ngày xưa người ta thường gọi là thiết kế web, chứ ít ai nói đến là Lập trình Web như bây giờ), mục đích của website đa phần là phục vụ cho máy tính PC, hiển thị trên màn hình rộng. Các website phổ biến hiện thời điểm đó là các website tin tức, báo chí, phim ảnh, blog cá nhân.

Bước tiến đầu tiên cho Lập trình Frontend là các thiết bị di động cầm tay ra đời, có khả năng truy cập mạng Internet, màn hình đủ rộng để lướt web. Từ đây một vấn đề xảy ra là các website không hiển thị tốt trên các thiết bị di động này, thường chúng sẽ giữ nguyên mẫu cách hiển thị trên PC và chữ thì khá là nhỏ khi được hiển thị trên các thiết bị di động này. Từ đó CSS3 ra đời bắt đầu cho công cuộc tấn công của Web vào các thiết bị cầm tay (thuật ngữ còn gọi là Responsive Devices), việc thiết kế trang web sao cho hiển thị tốt trên cả PC và Mobile là điều thiết yếu. Đây có thể coi là bước chuyển hóa ban đầu của Lập trình Web Frontend.

Một bước chuyển hóa mà đa số các Lập trình viên đều biết đó là AJAX, tiền đề cho việc phân tách Backend ra khỏi Frontend. Việc dữ liệu trên trang web đa phần là tĩnh (tức là dữ liệu sẽ được đổ vào UI khi chúng ta load web, và sẽ được tải lại nộng dung mới khi chúng ta làm mới lại trình duyệt), việc người dùng không nhận được các thông tin mới nhất từ các trang web (đa phần là các trang tin tức, thông tin được cập nhật hàng giờ) làm cho người dùng có cảm giác như mình không đọc các tin mới nhất, từ đó công nghệ AJAX được các lập trình viên thêm vào trang web để tự động tải mới các bài viết, thông tin vừa mới được cập nhật. Từ đây chúng ta thấy được giữa Frontend và Backend đã có sự đồng bộ cơ bản về truyền tải dữ liệu.

Tách biệt giữa Backend và Frontend

Với sự tiến bộ vượt bật của công nghệ, Frontend giờ không còn có sự gắng kết tuyệt đối khi phát triển web, việc xây dựng Frontend không cần thiết phải nằm trên cùng một hệ thống hay quản lý chung với một Repo nữa (Repository một hệ thống quản lý mã nguồn cho lập trình viên như GitHub, BitBucket,..). Nói đến làm Frontend không đơn giản chỉ là cắt Layout Photoshop rồi dựng CSS, HTML nữa, mà nó giờ đã có vị thế riêng, có một ngôn ngữ riêng để lập trình (dù rằng dựa trên nền tảng Javascript), phải kể đến ReactJS, Angular, VueJS và thêm một số nền tảng nữa mà chúng đang phát triển từng ngày. Mỗi ngày mới qua đi chúng ta lại nghe đến một công nghệ mới cho Frontend mà có thể sau bài viết này đây nó đã khác nữa rồi 🙂

Như đã nói ở trên Backend giờ đây chỉ có nhiệm vụ đổ dữ liệu qua Frontend thông qua giao thức RestAPI, WebSocket,… với sự thay đổi này làm cho việc bảo trì hay nâng cấp hệ thống Backend sẽ không còn ảnh hưởng nhiều đến Frontend nữa, kể cả việc phát triển các thành phần khác cho Frontend cũng vậy, chúng hoàn toàn độc lập với nhau. Các bạn có thể tham khảo link Reference bên dưới để có cái nhìn rõ hơn về các ngôn ngữ cho Frontend cũng như học tập chúng, chúc các bạn thành công trên con đường Frontend Dev của mình.

AngularJs https://angular.io

VueJShttps://vuejs.org

ReactJS https://reactjs.org

Bình luận Facebook
Chia sẻ Zalo

Nhận thưởng Coins khi Share bài viết.

Với mỗi lượt chia sẻ bạn sẽ nhận được 2 Coins
Mỗi bài viết bạn chỉ được nhận Coins trên một mạng xã hội một lần. (Mỗi mạng xã hội bạn sẽ nhận được 2 Coins)

 

Hãy đăng nhập để được nhận thưởng khi chia sẻ.

Đăng nhập

Thêm bình luận