本課程是使用 HTML 和 CSS 構建網站的基本介紹。您將學習基本的 HTML 標記、CSS 選擇器和样式,以及如何在瀏覽器中使用開發人員工具來分析網頁。
課程持續三週,包括交互式測驗、學生支持社區和教育由行業專業人士創建的內容。
- 提供者:Treehouse
- 費用:Treehouse 訂閱($20/月)
- 公開:初學者
Treehouse 已將其所有前端教程捆綁到一個學習軌道中。本課程首先向學生介紹 HTML 和 CSS 的基礎知識。然後,您將學習 JavaScript 的基礎知識。
在課程中,您將涵蓋可訪問性、CSS flexbox 和 HTML 表單等主題。最終,您將深入了解如何使用 HTML、CSS 和 JavaScript 創建一個功能強大、美觀且易於訪問的網站。
前端開發書籍
HTML and CSS 這是對使用 HTML 和 CSS 創建網站的全面介紹。您將學習如何使用 HTML 和 CSS 創建可訪問和可用的網站。
本書以一系列照片和圖形為特色,以強化您正在學習的技術概念。您還可以找到大量代碼片段,以便您可以輕鬆地試驗已閱讀的代碼。
Eloquent JavaScript,現在是第三版,向讀者介紹了 JavaScript 和編程的基礎知識.首先,您將學習基本的 JavaScript 語法和常用函數。
您將學習將函數式和麵向對象的技術應用到您的代碼中。您還將學習如何使用文檔對像模型與網站交互。
通過閱讀本書,您將深入了解如何使用 HTML、CSS 和 JavaScript 創建功能性網頁。您將從創建帶有文本、表格等的 HTML 頁面開始。
本書繼續討論新的 HTML5 元素並使用 CSS 設置網頁樣式。在本書即將結束時,您將開始使用 JavaScript 使您的網頁更具交互性。
面向前端開發人員的資源
您將很難找到比Mozilla 開發者網絡 (MDN)。這個在線文檔存檔幾乎涵蓋了您需要了解的有關 HTML、CSS 和 JavaScript 語法的所有內容。
您會在 MDN 上找到許多交互式教程。這些教程教您如何使用 HTML、CSS 和 JavaScript,如何使 Web 應用程序易於訪問等等。
Python.Engineering Web 教程
Carreer Karma 有很多初學者的網絡教程。以下是我們針對這些主題的教程列表:
前端大師是一系列面向 Web 開發初學者的在線教程程序。在此訓練營中,您將學習開始構建自己的網站所需了解的一切。
此訓練營附帶互動課程,可幫助您發展在課堂上獲得的技能。課程由在創建網頁方面擁有豐富經驗的領先行業專家授課。
前端、後端和全棧開發人員
開發和網絡開發人員涉及許多領域每個人都有獨特的職責。
後端Web開發人員對用戶看不到的網站部分更感興趣。他們是背後的大腦操作。他們編寫的代碼可用於處理網站上的付款或決定用戶在打開頁面時看到的內容。為此,他們使用編程語言,如 Python、Ruby 和 PHP 來構建應用程序。
全棧開發人員是那些你稱之為“雜工”或通才的開發人員。顧名思義,他們有經驗和專業知識與網站的兩端。
全棧Web開發人員對於任何Web項目都是必不可少的。他們有助於彌合客戶端和服務器端之間的差距。這是為了確保網站的功能性和美觀性. 熟練客戶前端工具(如 JavaScript)和服務器端技術(如 PHP 和 Ruby)。
前端開發人員的技能
您必須在前端完成一系列技能- 結束網絡開發。確定這些技能將取決於您在哪里工作以及您正在從事哪些項目。
下面我們將分析前端 Web 開發人員職位描述中出現的一些關鍵技能。
< h4> HTML、CSS 和 JavaScript 如果不了解三種關鍵的 Web 技術:HTML、CSS 和 JavaScript,就不可能找到一份前端開發工作。
超文本標記語言(HTML)。這用於描述網頁結構。 HTML 允許您指定文本、圖像和其他形式的內容應放置在網站上的什麼位置。
層疊樣式或 CSS 。這描述了元素在網頁上的顯示方式。CSS 允許您定義樣式,例如頁面上元素的顏色、它們的位置以及文本在網站上的顯示方式。
JavaScript 。這種 腳本語言 確保網站更加動態。你看到的任何交互式網頁都可能在某種程度上是由 JavaScript 驅動的。例如,自動更新內容和具有地圖功能的網站都使用 JavaScript 在前端顯示內容。
JavaScript 庫,例如 jQuery
JavaScript 庫是JavaScript 語言的擴展。這些庫都具有一組特定的功能,旨在幫助開發人員更有效地構建網站。
我們以 jQuery 為例。 jQuery 旨在使在網站上實現 JavaScript 變得更容易。它抽像出您在 JavaScript 中可能遇到的大多數函數,以支持更簡單的語法。
使用 jQuery 可以高效地執行各種任務。在網頁上操作 CSS 和編輯 HTML 元素很容易。也可以使用 AJAX 向網站添加效果和動畫,並將數據傳送到網頁。
版本控制
版本控制系統 (VCS) 用於管理所做的更改到項目軟件。這些系統的示例包括 Git 和 Mercurial。
VCS 很重要,因為它們允許開發人員了解項目的發展情況。他們跟踪對項目中每個文件所做的每一次更改。文件更改的每條記錄旁邊都有關於誰更改以及何時更改的信息。
擁有此記錄意味著可以輕鬆查看項目在特定歷史時間點的結果。另外,如果你犯了錯誤,很容易恢復到以前的項目版本。
前端框架
前端框架是一個腳手架,提供了-code built.-編寫的,您可以通過它創建應用程序。常見的 JavaScript 框架 包括 React 和 Next.js。
例如,React 可以輕鬆構建交互式 Web 應用程序。它具有允許您在網站上的數據更改時呈現網頁的正確部分的功能。 React 還允許您將設計分解為組件,以減少代碼庫中的重複。
使用 React 可以減少項目的時間,因為它是開箱即用的。它還提供了一系列您可以在開發應用程序時使用的功能。
網頁設計:用戶界面 (UI) 和用戶體驗 (UX)
前端開發人員不會` t需要是網頁設計專家。 網頁設計本身就是一個領域。話雖如此,對網頁設計有紮實的了解是必不可少的。網頁設計的兩個主要部分是用戶界面 (UI) 設計和用戶體驗 (UX) 設計。
用戶界面設計是指創建網頁的外觀。 UI 設計師將決定按鈕、文本和圖像等內容在網站上的顯示位置。
另一方面,用戶體驗設計關乎用戶在網站上的整體體驗。用戶體驗設計師分析和研究產品以確定可能使用戶感到困惑的點。因此,他們了解如何解決這些問題,以便用戶在使用網站時獲得無縫體驗。
響應式設計
人們使用手機、平板電腦和顯示器。屏幕尺寸。這就是響應式設計的用武之地。響應式設計就是要創建一個可以在各種不同設備上有效顯示的網站。
這涉及到了解用戶可以在哪些不同類型的設備上查看網站。前端開發人員應該能夠為這些設備的用戶設計和開發獨特的體驗。畢竟,在移動設備上查看網站的桌面版本可能可行,但並不十分時尚。
API
應用程序編程接口 (APIs ) 用於許多 Web 開發環境。通常,後端開發人員創建的 API 會輸入到網站的邏輯中,例如用戶身份驗證和支付。因此,前端開發人員必須按順序查詢這些 API能夠與它們交互。
API 還允許您與外部服務交互。例如,Google Sheets API 允許您從 Google Sheets 中檢索可在您的網站上使用的數據。這意味著您可以在現有網站上創建集成。
作為前端開發人員,您可能會每天使用 API 從前端視圖訪問數據。
調試
不管你是什麼類型的程序員是,你需要有一些調試技能。畢竟,沒有開發人員不編寫代碼。