# W1_現代網頁簡介及開發工具安裝.md ## 開發工具安裝 **Visual Studio Code** https://code.visualstudio.com/Download **2. Visual Studio** https://visualstudio.microsoft.com/zh-hant/vs/community/ 點選 `Workloads` -> `ASP.NET and web development` -> `Install` ![image](https://hackmd.io/_uploads/HkVsXEjHC.png) **3. NodeJS** https://nodejs.org/en/ **4. ngrok** https://ngrok.com/download 需要註冊 ## AI 對軟體產業的影響? - https://www.brucehr.com.tw/post/bhrc-2023h1-chatgpt - https://www.inside.com.tw/article/30051-nature-ChatGPT-AlphaCode-programmer - https://www.gvm.com.tw/article/103969 從求職網站檢視職缺需求 - 104 - CakeResume - Yurator - Linkedin ## 網站開發裡面有哪些角色? - Roadmap Overview: https://roadmap.sh/roadmaps - Roles - Frontend Developer(FE) - Backend Developer(BE) - App Developer(iOS, Android) - Database Administrator(DBA) - DevOps Enginner - QA Engineer - Project Manager ## HTML ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Hello world</title> <link rel="icon" type="image/x-icon" href="https://th.bing.com/th/id/OIP.bu2Qea4bfAcVPRyUefowAwAAAA?rs=1&pid=ImgDetMain"> </head> <body> Hello world! </body> </html> ``` ## Static Content Hosting tool - serve https://www.npmjs.com/package/serve ``` npm install --global serve ``` ## Learning Resources - HTML: https://www.w3schools.com/html/default.asp - CSS: - https://developer.mozilla.org/en-US/docs/Web/CSS/