Ngày nay có khá nhiều ngôn ngữ lập trình có thể gây hứng thú cho các nhà phát triển mới làm quen. Để bắt đầu, tôi sẽ khuyên bạn nên quyết định xem bạn muốn chuyên về lĩnh vực gì, đó là front-end (giao diện của trang web), backend (phần kỹ thuật của trang web) hay một chút cả hai ( nhà phát triển toàn diện )?
Trong hướng dẫn đầy thông tin này, chúng ta sẽ tìm hiểu một số kỹ thuật, khuôn khổ thường được sử dụng và các khả năng thú vị. Các tùy chọn được mô tả ngắn gọn trong hướng dẫn này và rộng hơn nhiều, nhưng nó cho bạn ý tưởng hay về những gì có thể thú vị đối với bạn và nơi bạn có thể bắt đầu.
Nếu bạn thấy điều gì đó thú vị, hãy mở mã Visual Studio (còn được gọi là VS Code) tạo một dự án mới và dùng thử! Nếu bạn không thể tìm thấy câu trả lời, hãy đặt câu hỏi của bạn trên diễn đàn.
MẸO: Mọi người đều học theo tốc độ của riêng mình, hãy đảm bảo bạn học theo tốc độ của riêng mình và từ từ đón nhận những thử thách khó khăn hơn. Đừng bắt đầu ngay với những thử thách khó khăn nhất, vì khi đó bạn sẽ không học được những điều cơ bản.
MẸO: Hãy mắc lỗi khi lập trình, điều này sẽ giúp bạn làm quen với các tình huống mới và biết cách giải quyết lỗi đó trong tương lai.
Bắt đầu phát triển front-end
HTML & CSS
HTML là tên viết tắt của từ viết tắt HyperText Markup Languagevà được sử dụng làm ngôn ngữ đánh dấu cho các trang web. CSS viết tắt là viết tắt của Cascading Style Sheetsvà cung cấp tùy chọn điều chỉnh thiết kế và bố cục của trang web. Bạn sử dụng CSS để tạo kiểu cho HTML.
Nếu bạn quan tâm đến việc phát triển giao diện người dùng, tôi khuyên bạn nên đảm bảo rằng bạn bắt đầu học HTML và CSS. Điều này cho phép bạn chuyển đổi nhanh chóng trong khi xây dựng trang web và dự án của mình.
CSS-Tricks và W3schools có rất nhiều thủ thuật và thông tin hay về thuộc tính CSS , flex-box và các công cụ có sẵn. Bạn cũng có thể xem vô số ví dụ thú vị trên codepen.io .
JavaScript
JavaScript là ngôn ngữ kịch bản để làm cho các trang web và trang web của bạn có tính tương tác. Nó được phát triển bởi Mozilla và là ngôn ngữ dùng để viết nhiều framework giao diện người dùng. JavaScript được bật theo mặc định trong mọi trình duyệt và ngày càng trở nên phổ biến và tiên tiến trong những năm gần đây.
Trong những năm gần đây, JavaScript đã phát triển thành một ngôn ngữ kịch bản ngày càng hoàn thiện thông qua việc triển khai ES5, một phiên bản pijlfunctiescó sẵn các kỹ thuật, chức năng mới và nhiều tính năng khác. Nếu bạn đang có ý định học JavaScript, tôi khuyên bạn nên tìm hiểu xem điều gì đã thay đổi.
Tài liệu về JavaScript có thể tìm thấy trên trang web (docs) của Mozilla và có rất nhiều bài hướng dẫn tại W3schools .
Nếu bạn có nhiều kinh nghiệm hơn về HTML, CSS và JavaScript, tôi khuyên bạn nên thử nghiệm với các khung JavaScript, những khung này giúp bạn phát triển các ứng dụng mở rộng và sử dụng lại nhiều mã. Các khung JavaScript phổ biến bao gồm React.js hoặc Vue.js.
Dưới đây là một số framework hay mà bạn có thể thử nghiệm:
- React.js
- Vue.js
- Góc cạnh
- Bí ngân
Bạn có gặp vấn đề với mã JavaScript của mình hoặc bạn có câu hỏi nào khác không? Đăng mã của bạn trong danh mục [Câu hỏi & Trả lời]
Người quản lý gói
Các trình quản lý gói hữu ích đã được tạo để phát triển giao diện người dùng mà tôi khuyên bạn nên thử. Bạn chắc chắn sẽ gặp phải chúng khi tìm hiểu sâu hơn về giao diện người dùng. Trình quản lý gói là nơi có thể xuất bản các thành phần, phần chức năng hoặc lõi khung. Thông qua trình quản lý gói, bạn có thể dễ dàng tải chúng xuống dự án của mình và cập nhật chúng. Trong số các trình quản lý gói phổ biến nhất là npm và Fiber , cả hai đều sử dụng NodeJS ở chế độ nền.
Cá nhân tôi sử dụng npm, nhưng điều đó thay đổi tùy theo nhà phát triển.
Webpack là gì và gói tài sản là gì?
Nhiều framework giao diện người dùng được tối ưu hóa để sử dụng với Webpack hoặc Gulp , vì vậy bạn sẽ thường thấy những tên này trong các hướng dẫn hoặc tài liệu. Nói một cách đơn giản, đây là những bộ đóng gói mô-đun.
Các gói dành cho các gói này có thể được xuất bản trên đó npmvà yarncó thể được sử dụng để tạo một số nội dung nhất định cho trang web của bạn. Bằng cách xây dựng trang web của bạn trong các gói nội dung này, bạn có thể sử dụng các tính năng nâng cao, chẳng hạn như gói JS vào một tệp và bạn có thể sử dụng SASS , một gói tiện dụng giúp bạn viết CSS có cấu trúc.
Các mô-đun cũng có thể được sử dụng để thêm các chức năng nhất định vào việc xây dựng và triển khai trang web của bạn (xuất bản trang web). Ví dụ: bạn có thể thêm Babel.js để làm cho các hàm JavaScript mới hoạt động trên các trình duyệt cũ hơn, gần như đảm bảo rằng trang web của bạn sẽ hoạt động trong các trình duyệt cũ hơn.
Có rất nhiều khả năng ở đây và tôi khuyên bạn nên thử nghiệm chúng.
Ứng dụng web lũy tiến là gì
Ứng dụng web lũy tiến (viết tắt bằng thuật ngữ PWA) là các ứng dụng web JavaScriptcó HTMLthể chạy dưới dạng chương trình gốc. Nó có ưu điểm là có thể truy cập trang web một cách bình thường, nhưng trong hầu hết các trường hợp, nó được lưu vào bộ nhớ đệm ở chế độ nền.
Trình duyệt tải xuống nội dung từ trang web PWA và khi người dùng truy cập trang web sau đó, những nội dung này sẽ được sử dụng để mở trang web ngay lập tức. Điều này làm cho nội dung của bạn cũng có sẵn ngoại tuyến.
Một ưu điểm khác của PWA là người dùng được lựa chọn ‘cài đặt’ ứng dụng trên thiết bị di động và máy tính để bàn. Nếu bạn cài đặt ứng dụng trên thiết bị di động, trình duyệt web UI(Giao diện người dùng) sẽ biến mất và nó được xem như một ỨNG DỤNG di động thực sự. Do đó, rất có thể một lúc nào đó các Ứng dụng di động sẽ được thay thế bằng Ứng dụng web lũy tiến vì mỗi ứng dụng có nguồn riêng cho mỗi nền tảng (đối với iOS thì đây là Swift, đối với Android thì đây là Java). Google hiện đang xem xét việc cho phép PWAs trong Google Play Store, trong khi Apple vẫn đang cố gắng cấm PWAs (mặc dù các tùy chọn trên nền tảng này vẫn đang được mở rộng).
Cũng giống như trên thiết bị di động, PWA trên máy tính để bàn cũng sẽ mở mà không cần giao diện người dùng trình duyệt. Điều thú vị ở đây là trang web hoặc ứng dụng của bạn có thể được mở từ một biểu tượng trên màn hình nền hoặc menu bắt đầu.
Hầu hết các khung JavaScript ngày nay đều đã được trang bị mã cơ bản cho PWA.
MẸO: Để xem những gì hiện có thể làm được với JavaScript về các chức năng di động (chẳng hạn như rung, thông báo đẩy, Bluetooth, truy cập tệp, v.v.), hãy xem trang web này: https://whatwebcando.today/
Nếu bạn xem trang web này trên thiết bị di động, bạn có thể thử nghiệm một số tính năng (chẳng hạn như rung, thông báo đẩy, v.v.)!
Thư viện jQuery
Khi tìm kiếm các giải pháp JavaScript, bạn có thể nhận thấy rằng trên Internet có đầy đủ các giải pháp đề cập đến jQuery. Tôi không khuyên bạn nên sử dụng thư viện này nếu bạn đang sử dụng khung giao diện người dùng. jQuery là một thư viện đã từng (và về nguyên tắc vẫn) phổ biến. Nhưng nó không được xây dựng để sử dụng trong các framework như React hay Vue.js.
Ngày nay, thư viện không còn mang lại lợi thế nữa vì JavaScript đã trở nên mạnh mẽ hơn và có nhiều chức năng hơn theo năm tháng.
Phát triển phụ trợ
PHP hoặc NodeJS (phía máy chủ JavaScript) có thể rất thú vị cho việc phát triển phụ trợ .
Nếu bạn muốn tìm hiểu cả frontend và backend cũng như muốn tìm hiểu khung giao diện người dùng, bạn có thể sử dụng Next.js , đây là một giải pháp đi kèm React.js và NodeJS, trong đó bạn cũng có thể viết phần phụ trợ của trang web bằng JavaScript. Vue.js cũng có một biến thể của điều này, được gọi là Nuxt.js.
Có rất nhiều framework thú vị dành cho PHP mà bạn có thể sử dụng:
Các khung PHP này thường có các công cụ để sử dụng cùng với các khung giao diện người dùng của bạn. Trong nhiều trường hợp, nhà phát triển viết Rest API để quản lý dữ liệu hoặc có một frontendthư mục trong GIT đại diện cho phần phụ trợ.
API và API RESTful
Nếu bạn đang làm việc ở phần phụ trợ và triển khai các dịch vụ khác, bạn sẽ phải xử lý Giao diện lập trình ứng dụng (API). Thông qua các API này, bạn kết nối với dịch vụ và trang web của họ để có thể sử dụng các chức năng mà họ cung cấp. Bạn cũng có thể sử dụng API nếu muốn đọc dữ liệu từ một trang web. API không nhất thiết phải có thể truy cập công khai, bạn thường phải xác thực bản thân bằng một bí mật tokentrước khi có quyền truy cập. Bạn có thể yêu cầu các mã thông báo này trên dịch vụ liên quan hoặc chúng hiển thị với bạn trong tài khoản của bạn.
Điều quan trọng là ít nhất bạn phải biết những điều cơ bản về điều này và hiểu nó là gì/làm được gì cũng như những khả năng có thể xảy ra.
Trình quản lý gói PHP/Trình quản lý phụ thuộc
Cũng giống như giao diện người dùng, cũng có các trình quản lý gói cho phần phụ trợ PHP. Trình quản lý gói phổ biến nhất là Composer . Mặc dù trang web trông cực kỳ đơn giản nhưng nó là một trình quản lý rộng rãi và có sẵn một số lượng lớn các gói.
Bạn có thể xem tổng quan về các gói trên Packagist . Ví dụ: khi bạn tìm kiếm các chức năng PHP, bạn thường sẽ được cung cấp tùy chọn cài đặt gói thông qua trình soạn thảo, sau đó bạn có thể sử dụng gói đó trực tiếp trong dự án của mình.
Sử dụng GIT/GitHub/GitLab
Mẹo cuối cùng tôi muốn đưa ra là sử dụng GIT. Git là trình quản lý phiên bản cho mã bạn viết và rất quan trọng đối với cả phát triển giao diện người dùng và phụ trợ . Nó cũng phổ biến nếu bạn làm việc trong một dự án với nhiều người. Bạn tạo một cái cho mỗi dự án repositoryvà bạn có thể theo dõi tiến độ của từng dự án. Bằng cách này, bạn sẽ không bị mất mã và dự án nếu máy tính gặp sự cố.
Trong Git, bạn có thể branchestạo các tính năng khác nhau để xây dựng một số tính năng nhất định và sau đó mergedgửi chúng cho bạn masterngay khi bạn triển khai. Với GIT bạn cũng có thể lấy lại mã cũ vì bạn luôn committruy cập máy chủ để mỗi dòng mã/phiên bản được lưu lại.
Mỗi thành viên trong nhóm clonedlưu kho lưu trữ cục bộ trên máy tính của họ và committhay đổi kho lưu trữ chính xác branch(hoặc tệp branch. Sau đó, bạn có thể thực hiện những thay đổi này pullenvà thực hiện các thay đổi cục bộ.
GIT cũng có thể giúp triển khai trang web/ứng dụng của bạn sau khi hợp nhất/đẩy mã đến một nhánh cụ thể (ví dụ: nhánh master). Bằng cách này, bạn có thể tự động để lại mã buildenvà testenkết quả uploadencho trang web của mình. Sử dụng các hành động AWS hoặc GitHub (nếu bạn sử dụng GitHub).
Nền tảng Git cũng cung cấp issuestính năng theo dõi, do đó bạn có thể nhanh chóng xử lý các yêu cầu tính năng và sự cố với ứng dụng cũng như liên kết cam kết với chúng.
Lưu ý: Bạn có tùy chọn tạo kho lưu trữ công khai và riêng tư. Nó phụ thuộc vào việc dự án của bạn open-sourcelà dành cho khách hàng hay không. Khách hàng không thích khi hóa ra nguồn trang web của họ là trực tuyến mà họ đã trả tiền. Vì vậy, đừng quên privatetạo một kho lưu trữ ở đây nếu bạn đang làm việc này.
Các nền tảng GIT phổ biến là:
- GitHub (được biết đến với nhiều dự án nguồn mở được lưu trữ tại đây)
- GitLab
- Bitbucket (thường được các công ty sử dụng)
GitHub là một khởi đầu tốt cho nhiều người mới bắt đầu, có rất nhiều open-sourcedự án có sẵn và rất dễ sử dụng. Điều này rất thú vị đối với các nhà phát triển portfoliovì kho lưu trữ của bạn được hiển thị công khai và mọi người có thể thấy những gì bạn đang làm (ví dụ: xem hồ sơ GitHub của jaspervriends ) và bạn có thể thấy rõ quá trình học tập của ai đó. Rõ ràng là bạn sẽ không thấy các kho riêng trong danh sách.
Theo Jatpe
