Học lập trình - Front-end developer
Giao diện người dùng của một trang web là phần mà người dùng tương tác. Mọi thứ bạn thấy khi điều hướng trên Internet, từ phông chữ, màu sắc cho đến menu thả xuống và thanh trượt, v.v... đều là sự kết hợp của HTML, CSS và JavaScript trên trình duyệt
HTML là ngôn ngữ đánh dấu được sử dụng để cấu trúc và cung cấp ý nghĩa cho nội dung web, ví dụ: xác định các đoạn văn, tiêu đề và bảng dữ liệu hoặc nhúng hình ảnh và video vào trang.
Nơi học HTML trực tuyến:
W3 SchoolsSoloLearnMozillacodecademyLinkedIn LearningHTML cheat sheetHTML Best PracticesCSS là một ngôn ngữ của các quy tắc kiểu mẫu được sử dụng để áp dụng kiểu mẫu cho nội dung HTML, chẳng hạn như đặt màu nền và phông chữ, đồng thời bố trí nội dung trong nhiều cột, v.v...
Nơi học CSS trực tuyến:
W3 SchoolsSoloLearnWeb.dev by GoogleMozillacodecademyLinkedIn LearningCSS cheat sheetJavaScript là một ngôn ngữ kịch bản cho phép bạn tạo nội dung cập nhật động, điều khiển đa phương tiện, tạo hình ảnh động và khá nhiều thứ khác.
Nơi học Javascript trực tuyến:
W3 SchoolsSoloLearnThe Modern JavaScript TutorialLinkedIn LearningYoutubeLearn JavaScriptJavascript cheat sheetJavaScript best practicesCác trang web này giúp bạn học HTML, CSS và Javascript:General Assembly DashfreeCodeCampUdemyBootcampKhan AcademyDon't Fear the InternetInterneting Is HardeducativeTutorial Republicvà còn nữa...
Package Managers (trình quản lý gói)là một hệ thống sẽ quản lý các phần phụ thuộc vào dự án của bạn. Trình quản lý gói phổ biến:Node package managerYarn
Là một front-end developer, bạn sẽ nghe thấy khái niệmResponsive web design (Thiết kế web đáp ứng).Bạn có thể tự viết mã hoặc sử dụng các thư viện tích hợp sẵn nhưBootstrapTailwind CSSBulmaChakra UIMaterial DesignFoundationUIkitMilligramPureTachyonsMaterializePicoSemantic UI
Để viết mã CSS ngắn gọn, dễ đọc và hiệu quả, bạn có thể sử dụngLeaner Style Sheets (Less)Syntactically Awesome Style Sheets (SASS)PostCSSCSS Modulesstyled-componentsstyled-jsx
Để sử dụng các phông chữ đẹp và tuyệt vời trên trang web, bạn có thể sử dụngGoogle fontsFont SquirrelMyFontsdafontEverything FontsFontGetFontShare
Biểu tượng, hình minh họa, biểu tượng yêu thích:Font AwesomeBootstrap IconsIconFinderIconDuckIcons8Tabler IconsIcon HorseApp Icon ResizerSVG repoFree SVGflaticonCreative FabricaFree SVG DesignsFree SVG DownloadfreepikFree SVG Cut Files
Bạn cần chèn các thẻ / thuộc tính / lược đồ cần thiết, tối ưu tốc độ tải trang khi làmSearch engine optimization (SEO)Structured dataLighthouseWeb performance optimization (WPO)Markup Validation ServiceSchema Markup validatorRich Results TestImage compression 1Image compression 2WebPImport mapsTurbo
Bên cạnh Javascript truyền thống, chúng ta cũng cần họcTypeScriptCoffeeScript(Chuyển đổi Javascript sang Coffee:js2.coffee)ES6JSX
Javascript build toolsWebpackesbuildGruntNPM scripts
Kiểm tra ứng dụng của bạn vớiJestReact Testing LibraryCypressEnzyme
Render phía máy chủ (SSR) vớiVueJSAngularReactRedux
Tạo các trang web tĩnh vớiNext.jsGatsby
Bạn muốn xây dựng các ứng dụng di động? Hãy thửReact NativeFlutterNativeScriptIonic
Nếu bạn thấy trang web của chúng tôi hữu ích và muốn hỗ trợ chúng tôi, bây giờ bạn có thể chuyển khoản ủng hộ. Các khoản đóng góp được chuyển trực tiếp vào tài khoản ngân hàng của chúng tôi và giúp chúng tôi tiếp tục cung cấp nội dung chất lượng.