104學習

RWD

RWD
關注
邀請朋友
邀請朋友

Line

Facebook

複製連結

取消
RWD指的是網站或應用程式能夠自動調整版面配置,適應不同裝置螢幕大小,如手機、平板和電腦。這項技能讓使用者在任何設備上都有良好瀏覽體驗,提高使用便利性與滿意度。對企業來說,具備此能力能提升品牌形象與競爭力,並增加網站流量及轉換率。在職場上,懂得設計響應式介面的人才非常搶手,尤其是前端工程師、網頁設計師等相關職位。掌握這項技能,有助於提升工作效率與專業價值。
關於教室
關注人數 0 人
104人力銀行從職缺中挑選出常見技能所成立的官方教室,提供大家進行共學互動。
學習主持人
持續分享知識,
有機會成為官方教室主持人
教室標籤
關於教室
關注人數 0 人
104人力銀行從職缺中挑選出常見技能所成立的官方教室,提供大家進行共學互動。
學習主持人
持續分享知識,
有機會成為官方教室主持人
教室標籤
Hi~ 歡迎分享學習資源,有學習問題可匿名向Giver發問!
我要分享
我要提問

RWD 學習推薦

104學習

產品

2024/11/14

前端工程師2025年必學技能清單:10大工具與技術指南,職場增能懶人包整理
前端工程師需要掌握的技能和專業涵蓋了多個方面(HTML、CSS 、 JavaScrip...等),包括基礎的網頁開發知識、前端框架、以及與團隊合作的工具等。本篇文章將深入探討前端工程師必備的 10 大核心技能與工具,幫助您在職涯中站穩腳步,開發出高效且吸引人的網站與應用。
1. HTML、CSS 和 JavaScript
HTML: 用於結構化網頁內容,是前端開發的基礎語言。
CSS: 負責設計和佈局,使網站具有視覺吸引力。
Java Script: 增加互動性,處理用戶事件和動態內容。
⚡推薦課程⚡
成為前端工程師|透過 HTML 與 CSS 認識網頁設計,從 0 到 1 打造實用介面 (上集)
成為前端工程師|Java Script 入門:帶你逐步培養網頁開發技能
【更多課程學習】https://user266414.pse.is/6ps94k
2. 前端框架和庫
React.js: 一個用於構建用戶界面的 JavaScript 庫,能夠快速開發單頁應用(SPA)。
Vue.js: 一個漸進式框架,適合於小型到大型應用的開發。
Angular: 一個全面的前端框架,適合大型企業級應用。
Svelte: 新興的前端框架,以其高效的性能和簡化的開發體驗而受歡迎。
⚡推薦課程⚡
Let’s Vue! 前端開發入門到實戰
3. 版本控制工具
Git: 版本控制系統,用於跟蹤代碼變更,方便團隊協作。
GitHub 或 GitLab: 托管代碼庫,協作開發和版本管理的主要平台
⚡推薦課程⚡
Git 速成攻略:2.5 小時變身版本控制達人
AI助理GitHub Copilot | 提升前端開發效率
GitHub Copilot AI賦能開發實戰訓練班
4. 預處理與構建工具
Sass 或 Less: CSS 預處理器,能夠提高樣式表的可維護性和可重用性。
Webpack、Parcel 或 Vite: 模塊打包工具,用於優化資源加載、處理 JavaScript 模塊化等。
【更多課程學習】https://user266414.pse.is/6psa64
5. 響應式設計與跨平台兼容
響應式網頁設計: 掌握使用 CSS 媒體查詢(Media Queries)以適應不同屏幕尺寸的布局技巧。
跨瀏覽器兼容性: 確保網站在不同的瀏覽器(如 Chrome、Firefox、Safari、Edge)上的一致性。
⚡推薦課程⚡
RWD響應式網頁設計入門
工程師救星-用Bootstrap速成響應式網頁開發
6. 調試與測試
Chrome DevTools: 瀏覽器內建的開發者工具,用於調試 JavaScript、分析網頁性能。
前端測試框架: 如 Jest、Mocha、Cypress,用於自動化測試和單元測試。
7. API 與 AJAX 技術
Fetch API 或 Axios: 用於與後端服務進行 HTTP 通信,拉取數據或發送數據。
RESTful API 與 GraphQL: 理解如何與 API 交互並消費 API 提供的數據。
8. 設計工具和基礎設計原則
Figma 或 Adobe XD: 瞭解設計工具以便與設計師協作。
UX/UI 基礎: 基本的用戶體驗和用戶界面設計原則,確保設計既美觀又實用。
⚡推薦課程⚡
UI/UX 新時代指南:產品設計 x 商業思維 x AI 工具
UI/UX新手實務班|UI介面設計,洞悉使用者體驗
9. 性能優化
代碼分割與懶加載: 減少初次加載時間,提升網站性能。
圖片優化與資源壓縮: 優化圖片格式與大小,減少網頁加載時間。
10. SEO(搜索引擎優化)
理解基本的 SEO 概念,確保網站在搜索引擎中具有良好的可見度,包括結構化數據的應用和適當的標題標籤。
⚡推薦課程⚡
SEO搜尋引擎優化七大密技|攻上頂端排名寶座
具備以上這些技能,能幫助前端工程師在現代網頁開發中具備更強的競爭力與靈活性。
看更多
0 0 4594 0
緯育TibaMe

2023/10/19

還在猶豫自學還是報課?5大關鍵將你塑造成企業要的前端工程師!
🚩 幫你把時間集中在對的學習點上
逐步帶你完成個人專案讓求職成功機率大提升
🏋19週把你打造成百大企業最愛人才🏋
週六先來聽免費說明會了解👉 https://bit.ly/3S5OuF0
#你可以獲得
➊ 先備知識:報名立即解鎖預習課讓你正式上場不慌亂
➋ 核心技能:業界師資結合實務案例帶預先破解未來關卡
➌ 多角發展:UI/UX&後端技術雙重滿足,掌握協作眉眉角角
➍ 專題實戰:同學共同討論+業師指引作品完整度大幅超越自學
➎ 就業保障:履歷健檢+企業媒合,陪你走過求職路上的任何問題
不怕你零基礎,就怕你不敢下定決心認真準備轉職
那些來的學長姐就業率都有93%以上
想轉職,還不來嗎?😎
📣 最後優惠63折倒數中
📣 最後優惠63折倒數中
📣 最後優惠63折倒數中
現在報名,明年當前端工程師
看更多
0 0 1263 0

熱門精選

104學習

產品

04/28 09:00

新手如何用 AI 整理會議紀錄?線上會議、實體會議一次看懂
開會時一邊聽、一邊記、一邊思考,常常會遇到幾個問題:重點來不及抄、決議沒寫清楚、待辦事項散落在聊天訊息或腦袋裡。現在,只要善用手機錄音、會議逐字稿與常見 AI 工具,新手也能更快整理出一份清楚、可追蹤的會議紀錄。
不過,AI 不是幫你「完全取代紀錄」,而是協助你加快整理流程。正式發送前,仍然需要人工確認人名、日期、金額、負責人、截止日與會議決議。
本文將分成「線上會議」與「實體會議」兩種情境,教你用手邊常見工具,搭配 ChatGPT、Claude、Gemini、NotebookLM 等 AI 工具,整理出適合交給主管、團隊或客戶追蹤的會議紀錄。
使用 AI 前,先確認 3 件事
在開始錄音、轉錄或把內容交給 AI 前,請先確認:
第一,會議是否允許錄音、錄影或轉錄。建議事前告知與會者錄音目的、使用範圍與保存方式。
第二,會議內容是否包含敏感資料。如果涉及客戶資料、個人資料、薪資、人事、財務、商業機密或未公開策略,不建議自行上傳到外部 AI 工具,應優先使用公司核准的平台。
第三,AI 產出只能作為初稿。AI 可能聽錯、漏掉脈絡,或把「討論中的想法」誤寫成「已決定事項」,正式使用前一定要人工檢查。
台灣《個人資料保護法》對個人資料的蒐集、處理與利用,強調應尊重當事人權益,不得逾越特定目的的必要範圍,並應與蒐集目的有正當合理關聯;本文為一般工作效率教學,不構成法律意見,實際使用仍應依公司規範與相關法規辦理。
AI 可以幫會議紀錄做什麼?
AI 在會議紀錄中,最常見的用途有 5 種:
1. 錄音轉文字:把會議錄音或逐字稿變成可整理的文字資料。
2. 摘要重點:從冗長對話中整理出主要討論內容。
3. 萃取決議:找出會議最後確認的結論。
4. 整理待辦事項:列出任務、負責人、截止日期。
5. 改寫成正式紀錄:把口語內容整理成適合寄出的版本。
好的會議紀錄,不是把每句話都記下來,而是清楚回答三個問題:
討論了什麼?決定了什麼?接下來誰要做什麼?
情境一:線上會議怎麼做?
線上會議最適合新手練習,因為 Google Meet、Teams、Zoom 等平台通常已有錄影、字幕、逐字稿或 AI 摘要功能。不過,這些功能是否可用,會依公司帳號、方案、裝置、地區與管理員設定而不同。
Google Meet 的「Take notes for me」可透過 Gemini 協助記錄會議內容,但實際可用性會受到帳號與設定影響。Zoom AI Companion 也提供會議摘要功能,且管理員可啟用或停用相關設定。
線上會議建議流程
第一步:會前確認可否錄影、錄音或開啟逐字稿
如果是客戶會議、敏感會議或跨部門會議,建議先確認公司規範,並告知與會者。
可使用這句話:
「為了方便會後整理會議紀錄,這場會議會開啟錄影或逐字稿功能,紀錄僅供本專案追蹤使用。」
第二步:會中保留原始資料
使用平台內建的錄影、逐字稿、字幕、AI 筆記或會議摘要。
第三步:會後交給 AI 整理
把逐字稿或會議重點貼到 ChatGPT、Claude 或 Gemini,請 AI 整理成正式會議紀錄。
第四步:人工檢查後再寄出
檢查決議是否正確、待辦是否有負責人、截止日是否清楚,以及 AI 是否誤判會議結論。
情境二:實體會議怎麼做?
實體會議的難點是聲音來源比較複雜,可能有多人同時說話、環境雜音、白板討論、投影片補充等。因此,實體會議更需要做好錄音與現場補充紀錄。
最簡單的流程是:
手機錄音 → 轉成文字或整理重點 → 交給 AI 整理 → 人工確認
iPhone:使用內建「語音備忘錄」
iPhone 內建的「語音備忘錄」可用來錄製會議、課程或語音筆記,Apple 官方說明可開始錄音、暫停、繼續錄音,也可調整手機與聲音來源的距離以改善錄音音量。
操作方式:
1. 打開 iPhone 的「語音備忘錄」App。
2. 點選紅色錄音按鈕開始錄音。
3. 會議中若暫停,可按暫停;繼續時再恢復錄音。
4. 會議結束後按停止,錄音會自動儲存。
5. 將檔名改成「日期+會議名稱」,例如「2026-04-27_行銷週會」。
6. 會後可分享錄音檔,或先轉成文字再交給 AI 整理。
Android:使用內建「錄音機」或「Voice Recorder」
Android 手機品牌眾多,內建錄音 App 的名稱與功能會依品牌、機型與系統版本不同。常見名稱包含「錄音機」、「語音錄音」、「Recorder」或「Voice Recorder」。
如果使用 Google Pixel,可留意 Google Recorder;Google 官方說明 Recorder 主要適用於 Pixel,可用來錄製會議、課程等聲音,並提供搜尋與 AI 功能。如果使用 Samsung Galaxy,Samsung 官方說明 Voice Recorder 可錄製課程、會議與對話,支援裝置也可使用 Galaxy AI 進行轉錄、加入 Samsung Notes 或分享文字檔。
Android 通用操作方式:
1. 在手機搜尋「錄音」、「Recorder」或「Voice Recorder」。
2. 開會前先測試 5 到 10 秒,確認收音正常。
3. 把手機放在桌面中央,不要放在口袋或包包裡。
4. 會議結束後停止錄音。
5. 重新命名錄音檔,建議使用「日期+會議名稱」。
6. 若手機支援轉文字,可先產出逐字稿;若不支援,可先手動整理重點,再交給 AI 工具處理。
實體會議小技巧
實體會議中,AI 不一定能準確聽出每個人的聲音。建議主持人在重要決議後,主動重複一次:
「確認一下,這件事由 Amy 負責,下週五前完成第一版,對嗎?」
這句話看似簡單,卻能大幅提高會議紀錄的準確度。
常見、容易取得的 AI 工具怎麼選?
以下工具不代表所有功能都免費,也不保證每個帳號都能使用。部分功能會依方案、裝置、地區與公司管理員設定而不同,使用前建議先確認。
1. ChatGPT:適合整理正式會議紀錄
ChatGPT 適合把逐字稿、會議重點或錄音摘要整理成正式文件,例如會議紀錄、主管摘要、待辦清單或會後 Email。若帳號與裝置支援 ChatGPT Record,也可用於轉錄與摘要會議、腦力激盪或語音筆記;OpenAI 官方同時提醒,轉錄與摘要可能出錯,重要資訊需要人工檢查。
適合用在:正式會議紀錄、主管摘要、待辦清單、會後 Email。
2. Claude:適合處理較長逐字稿與文件
如果會議逐字稿很長,或需要同時參考簡報、企劃書、專案文件,Claude 是常見選項。Claude 官方說明支援上傳 PDF、DOCX、CSV、TXT、HTML、ODT、RTF、EPUB、JSON 等文件格式;部分檔案功能仍會依帳號設定與限制而不同。
適合用在:長會議逐字稿、訪談紀錄、研討會內容、多份文件摘要。
3. Gemini:適合 Google 工作環境
如果團隊平常使用 Gmail、Google Docs、Google Drive、Google Meet,Gemini 會比較容易放進日常流程。Google 文件中的 Gemini 可協助摘要文件,Drive 中的 Gemini 也可協助摘要檔案與資料夾,但需要符合可用方案。
適合用在:Google Docs 會議紀錄、Google Drive 文件整理、Google Meet 會後資料。
4. NotebookLM:適合專案型會議與長期追蹤
NotebookLM 比較像是「專案知識庫」。你可以把會議紀錄、簡報、企劃書、訪談資料放進同一個 Notebook,之後再針對這些資料提問。Google 說明 NotebookLM 會根據你上傳或指定的來源回答問題,並提供來源引用。
適合用在:專案會議追蹤、多次會議整理、課程筆記、客戶訪談資料庫。
新手建議工作流
線上會議
平台逐字稿或摘要 → ChatGPT/Claude/Gemini 整理 → 人工檢查 → 寄出追蹤
若是長期專案,可把每次整理好的會議紀錄放進 NotebookLM,開下次會議前請它整理「前次決議、未完成事項、待確認問題」。
實體會議
手機錄音 → 轉成文字或整理重點 → ChatGPT/Claude/Gemini 整理 → 人工確認
如果沒有逐字稿,也可以會後用 Google Docs 語音輸入,自己口述會議重點。Google Docs 語音輸入需要在支援的瀏覽器中開啟文件,並確保電腦麥克風可正常使用。這比較適合「會後自己補充重點」,不建議直接當成多人會議的正式轉錄工具。
會議紀錄建議格式
新手可以先使用這個格式:
會議主題:
會議時間:
會議地點/會議連結:
主持人:
紀錄者:
與會者:
一、會議目的
簡短說明這場會議要解決什麼問題。
二、討論重點
用條列式整理主要討論內容。
三、會議決議
只放已經確認的結論,不放還在討論中的想法。
四、待辦事項
任務|負責人|截止日期|備註
整理第一版提案|Amy|5/10|提供給行銷部確認
五、待確認事項
列出尚未有答案、需要補資料或下次再討論的內容。
可直接複製的 AI Prompt
Prompt 1:整理正式會議紀錄
請根據以下會議逐字稿,整理成正式會議紀錄。
請包含:
1. 會議主題
2. 會議目的
3. 討論重點
4. 會議決議
5. 待辦事項
6. 待確認事項
7. 下次會議建議追蹤事項
待辦事項請用「任務/負責人/截止日期/備註」格式整理。
如果內容中沒有提到負責人或截止日期,請標示「待確認」。
請不要加入原文沒有提到的資訊。
請使用繁體中文,語氣正式、清楚,適合寄給團隊成員。
Prompt 2:整理主管版摘要
請將以下會議內容整理成主管可快速閱讀的摘要。
請用 300 字以內說明:
1. 本次會議重點
2. 已確認決議
3. 需要主管知道的風險或卡點
4. 接下來最重要的 3 個行動項目
請避免冗長細節,保留關鍵資訊即可。
Prompt 3:檢查會議紀錄
請幫我檢查以下會議紀錄是否完整。
請指出:
1. 是否有決議不清楚的地方
2. 是否有待辦事項缺少負責人
3. 是否有待辦事項缺少截止日期
4. 是否有需要再次確認的數字、日期、人名
5. 是否有語氣太口語、不適合寄給主管或客戶的句子
請提供修改建議。
新手最容易犯的 5 個錯誤
錯誤 1:把逐字稿當成會議紀錄
逐字稿只是原始材料,會議紀錄要整理出重點、決議與待辦。
錯誤 2:沒有區分「提議」和「決議」
有人提出建議,不代表會議已經同意。
錯誤 3:待辦事項沒有負責人
「下週整理報告」不夠清楚;「由 Kevin 於 5/10 前整理第一版報告」才方便追蹤。
錯誤 4:完全相信 AI 摘要
AI 可能漏掉反對意見,或誤解語氣與脈絡。
錯誤 5:忽略資料安全
不要把客戶資料、人事薪資、財務數字、公司策略或未公開資訊,直接上傳到未經公司核准的外部工具。
104學習小提醒
AI 可以幫你省下整理時間,但不能取代你的判斷。會議紀錄真正的價值,不是把所有人說過的話完整留下來,而是讓團隊會後能繼續推進。
對新手來說,最簡單的開始是建立一套固定流程:
錄下來 → 轉成文字 → 請 AI 整理 → 人工檢查 → 寄出追蹤
只要掌握這套流程,無論是線上會議還是實體會議,都能更快產出清楚、完整、可追蹤的會議紀錄。
看更多
1 0 4535 0
緯育TibaMe

2023/08/31

【青年補助開放報名】想轉職前端工程師?19週帶你從0到就業
你也曾經憧憬過前端工程師的工作嗎?
現代人離不開網路,各行各業也早已紛紛數位化,每日使用到的裝置都與前端工程師息息相關,這意味著──市場上的「前端工程師」人才需求量只增不減!🔥🔥🔥
📣 現在有個大好機會報你知>> https://bit.ly/3sEetbM
💪 只要你是15~29歲的待業青年
💪 有顆堅定學習的心 (不遲到曠課是必須的~)
💪 準備朝向前端工程師這個職務邁進
緯育TibaMe前端工程師專業技術養成【中壢班】開放補助名額啦!
超高額補助🤫
【只要先繳1萬元】全心投入課程 ,完訓後還有機會退回這1萬元?!
(詳細補助辦法請洽各班培訓專員)
#19週零經驗也能成為前端工程師
課程涵蓋三大領域
UI/UX設計 ➡ 前端技術 ➡ 網站開發 全方位培訓
帶走的絕不會只有前端技術,還提前了解未來協作夥伴的工作範疇與規劃邏輯
❌拒當職場小雷包
⭕懂協作、懂專業,專案效率UP,職場人際也一把罩
🖐️ 如果還不熟悉什麼是前端工程師
🖐️ 還不清楚未來職涯發展
別擔心,我們週週都有 #免費課程說明會 由專業培訓專員一一解說
這邊報名👉 https://bit.ly/3sEeAEe
⚠提醒,政府補助不可與104優惠折價同時使用⚠
看更多
0 1 2019 0
你可能感興趣的教室