感謝您提交詢問!我們的一位團隊成員將在短時間內與您聯繫。
感謝您提交預訂!我們的一位團隊成員將在短時間內與您聯繫。
課程簡介
結構與樣式(HTML & CSS)
介紹與Web技術
- Web工作原理:簡要解釋客戶端-服務器模型
- 瀏覽器作爲計算機:代碼解釋
- HTML:Web的骨架。結構、層次和語義標籤
- CSS:Web的樣式。顏色、字體和盒模型
- 實驗1:設置容器環境並構建一個靜態的“關於我”個人頁面
深入學習HTML與CSS
- HTML:列表、鏈接、圖片和表單(用戶交互必備)
- CSS:文本和背景樣式。Flexbox和Grid佈局的入門
- 響應式設計:使網站在移動設備和桌面上都能正常顯示
- 實驗2:通過專業樣式和移動響應性優化靜態頁面
與DOM(文檔對象模型)合作
- 概念:理解代碼如何與視覺頁面關聯
- 選擇元素:如何定位網頁的特定部分
- 操作:通過代碼更改內容和屬性
- 實驗3:通過代碼修改靜態頁面元素(例如,動態更改標題或圖片)
大腦(JavaScript)
JavaScript編程基礎
- 變量與數據類型:存儲信息(文本、數字、真/假)
- 邏輯:If/else語句(決策)
- 循環:高效重複動作
- 函數:創建可重用的代碼塊(“食譜”概念)
- 實驗4:使用JavaScript創建一個基本計算器或邏輯遊戲
交互性與事件
- 事件監聽器:響應點擊、按鍵和頁面加載
- 表單處理:驗證用戶輸入(例如,檢查電子郵件是否有效)
- DOM操作:動態添加和刪除元素(例如,待辦事項列表)
- 實驗5:將計算器轉換爲具有UI反饋的交互式Web應用
獲取數據(API)
- 概念:Web應用如何與其他服務器通信(例如,獲取天氣數據或股票價格)
- JSON:數據交換的語言
- 異步編程:理解“等待,然後執行”邏輯而不凍結瀏覽器
- 實驗6:構建一個功能,從公共API獲取即時數據並顯示在頁面上
專業工具包(框架與畢業項目)
使用編程框架
- 爲什麼使用框架?(React、Vue或Svelte概念)
- 組件:構建模塊化、可重用的UI部分
- 狀態管理:跟蹤變化的數據
- 生態系統:理解包、依賴和版本控制(Git)
- 實驗7:使用基於組件的方法重構一個簡單功能
畢業項目:構建Web應用
- 要求:參與者必須構建一個功能性的Web應用(例如,預算跟蹤器、產品儀表板或作品集網站)
- 規劃:定義“用戶故事”和技術範圍
- 實現:結合HTML/CSS結構與JavaScript邏輯
- 調試:如何閱讀錯誤信息並修復邏輯錯誤
- 演示:向小組展示最終應用
結束語與下一步
- 技術詞彙:與工程師溝通的備忘單(API、後端、前端、Git、部署)
- 資源指南:學習更多內容的地方(文檔、StackOverflow、MDN)
- 職業整合:這些技能如何在產品管理和設計角色中發揮作用
- 問答與課程評估
最低要求
- 基本的計算機使用技能
- 無需編程經驗
21 小時
客戶評論 (3)
我非常喜歡學習關於AI攻擊的內容,以及那些可以開始實踐並積極用於安全測試的工具。我學到了很多之前不瞭解的知識,課程也達到了我的期望。培訓中我最喜歡的部分是Comet Browser,它的功能讓我感到驚歎。這絕對是我會進一步研究的內容。總體來說,這是一門很棒的課程,我很享受學習所有OWASP GenAI Top 10的內容。
Patrick Collins - Optum
課程 - OWASP GenAI Security
機器翻譯
實踐操作、練習、面對面幫助與答疑。
Jose Paulos - INESC TEC
課程 - Tailwind CSS
機器翻譯
每個技術課程都配有多個實踐練習,以鞏固概念。
Andrei-Calin Bajea
課程 - OWASP Top 10 2025
機器翻譯