【網站開發學習筆記】什麼是網站前端工程師

閱讀時間約 2 分鐘
  此部份資料以各大求職網及他人分享的職業甘苦談整理而成,若有任何缺誤再請告知。
  一般而言,前端泛指處理與用戶端相關的開發,舉凡使用介面、從用戶端收集到資料傳至後端進行資料處理等。舉例來說,前端的工作就像是使用者與電腦之間的翻譯人員,電腦需使用代碼下指令來操作,但一般用戶並不是都會程式語言或是語法,也看不懂電腦呈現的代碼含義,因此前端會將指令圖像化,讓使用者可以直觀的進行操作並對電腦下指令,並把圖像化的使用者介面以代碼轉成電腦也能理解的內容,讓電腦運作起來。

前端的工作內容

  而在網站開發時前端主要的工作便是在使用者介面的開發以及與後端資料的串接上。具體而言有以下幾項工作
  • 將設計轉化為真實網頁
    用HTML/CSS將網站設計稿從圖像轉譯為能呈現在瀏覽器上的網站,也就是俗稱的切版
  • 讓網站能在各種裝置、瀏覽器上運行
  • 優化前端體驗與效能
  • 串接後端伺服器進行資料溝通
  • 與其它前端合作開發

前端所需的軟實力

  從上所述,可以看出前端的工作內容多數需要與其它專業項目的人員進行合作。除了與設計師溝通網站的呈現以及使用體驗外,也需要與後端協調進行資料的串接。因此在基本技術力之外,做為網站前端,你還會需要:
  • 不害怕與他人合作溝通
  • 具有一定的美感素養
  • 同時具備抽象與邏輯思考的能力
  • 發現問題、解決問題的能力
  • 不斷的自我更新、持續學習
  個人認為,最後兩項不單只是做為前端,而是不論從事何種行業都需要具備的,不過在技術日新月異的程式開發領域,這些特質的重要程度又更高了。

前端所需的硬實力

  了解前端在做些什麼、又需要什麼樣的軟實力後,覺得自己對於這個職業是有興趣且想要嘗試發展的話,那麼接下來就來看看前端應該要具備什麼樣的專業技能吧!
  大部份的自學介紹多會按學習順序來進行介紹,不過筆者屬於喜歡從「為什麼」來進行思考,且這系列有個大方向的目標:轉職,因此比起依照程式的學習順序來介紹,筆者認為從工作內容來進行介紹會更明確且有感。
  從下一篇開始,就要來更仔細的了解前端的工作內容及所需的能力!

  我是正在努力學習網頁開發知識,立志朝網頁前端工程師邁進的佧佧,這個系列是我的學習筆記及記錄,希望我的學習歷程也能給予同樣走在學習路上的夥伴一些協助,若是內容有任何錯誤或不足,也希望各位前輩、先進不吝提出,謝謝!
4會員
14內容數
我是佧佧,歡迎來到我的術式領域。 讓我們一起磨練技術、學習程式, 在前端的領域中不斷成長吧!
留言0
查看全部
發表第一個留言支持創作者!
佧佧的術式領域 的其他內容
了解網站的開發流程後再來看看網站開發有哪些角色參與其中吧!
網站的開發流程是如何呢? 透過了解網站開發的流程,能更知道自己的定位以及如何與其它人合作開發網站。
在了解網站是什麼之後,讓我們來了解什麼是網站開發?網站開發究竟在做些什麼呢?
到底什麼是網站?網站有什麼功用?又是怎麼運作的呢?
  利用excel建立了個人的學習地圖,持績修正優化中……   目前的作法是,先從概論性的東西開始了解學習,對於可能有哪些東西需要學習再來做滾動式的安排,並記錄學習歷程及耗時。
了解網站的開發流程後再來看看網站開發有哪些角色參與其中吧!
網站的開發流程是如何呢? 透過了解網站開發的流程,能更知道自己的定位以及如何與其它人合作開發網站。
在了解網站是什麼之後,讓我們來了解什麼是網站開發?網站開發究竟在做些什麼呢?
到底什麼是網站?網站有什麼功用?又是怎麼運作的呢?
  利用excel建立了個人的學習地圖,持績修正優化中……   目前的作法是,先從概論性的東西開始了解學習,對於可能有哪些東西需要學習再來做滾動式的安排,並記錄學習歷程及耗時。
你可能也想看
Google News 追蹤
Thumbnail
這個秋,Chill 嗨嗨!穿搭美美去賞楓,裝備款款去露營⋯⋯你的秋天怎麼過?秋日 To Do List 等你分享! 秋季全站徵文,我們準備了五個創作主題,參賽還有機會獲得「火烤兩用鍋」,一起來看看如何參加吧~
Thumbnail
美國總統大選只剩下三天, 我們觀察一整週民調與金融市場的變化(包含賭局), 到本週五下午3:00前為止, 誰是美國總統幾乎大概可以猜到60-70%的機率, 本篇文章就是以大選結局為主軸來討論近期甚至到未來四年美股可能的改變
Thumbnail
這個月,忽然達成 2 個里程碑。 第一個里程碑,是我在 2022 年底,有訂下 2023 年的創業月收入(不含合夥),想要盡可能達到 2 萬元生活費。 我並沒有全心投入創業行銷,而是被動行銷,想嘗試會如何。所以我 2023 年每月的創業大概是 1 萬元上下,而今這個月計算下來,忽然發現達到...
Thumbnail
隨著科技不斷進步,智能家居技術正日益融入我們的日常生活。這種趨勢不僅影響了我們的家居生活,還對現代網站開發產生了深遠的影響。本文將深入探討智能家居與現代網站開發之間的聯繫,並預測未來的趨勢。
Thumbnail
《爛漫基隆國際藝術聖誕港12月2日熱情點燈、陸海空光雕耶誕與您緊抓時刻 》 2023年的《英雄聯盟》世界賽總決賽在首爾高尺天空巨蛋舉行,獲得《英雄聯盟》世界賽總決賽主題曲,受邀演唱、本次入選由LCK賽區T1對上LPL賽區WBG,除了虛擬偶像團體心鋼之聲(Heart Steel)以外,人
Thumbnail
想要自架網站,以下幾個網站架設的重點必須掌握! 網域 (Domain Name): 網域是網站的網址或URL的一部分,如 "example.com"。它使使用者能夠輕鬆訪問你的網站,而無需記住複雜的IP地址。網域的購買和續約通常透過域名註冊商進行管理。
Thumbnail
"讓我們一起探索世界的聲音!英文方塊的線上英文發音課程絕對是狗狗的智慧之選!" 本穀對於聲音很敏銳也很敏感,學習力應該算是滿快的(自己說), 馬麻之前教我指令的時候,都是講中文,某天她心血來潮, 想說試試看用英文講,想考驗本穀的智慧,好吧我就秀一波給妳看! 當她說SIT!我很快速就坐了下
Thumbnail
自2022年8月份開始,我盡量在每周透過電子報方式分享當周我所找到的有趣新玩意兒。這篇是擷取2022年8月份的部份精彩內容:面對恐懼勇往直前 – Fear Setting Exercise 🦁🚀全球遠端工作的好選擇:一個月台北房租,享受全世界旅行 🌍✈️ 檔案分享工具好神物 – WeTrans
Thumbnail
說是開發過程的筆記,應該是撞牆心血錄,因為各式各樣的原因,所以為前後端串接困擾了很久⋯⋯
Thumbnail
無論是個人或企業層面,學習使用 No Code 工具和技術都有助提升工作效率。對於個人職涯來說,能夠掌握 No Code 的開發技能,懂得利用相關工具改善流程和解決問題,必能助你在職場上脫穎而出。這篇文章會為大家介紹 7 個 No Code 網站開發工具,並逐一詳細說明它們的特式和架站方法。
Thumbnail
每個人可能都不只有一項專長與興趣,有些可能在後來才會發展出來,也可能是自己以前未曾想像過的結果,此篇為貓頭鷹開啟人生另一斜槓興趣「理財」研究的緣由與投資理財心路歷程,想知道如何一步步學習聰明投資理財,讓資產安穩增值,請伴隨貓頭鷹腳步一起成長。
Thumbnail
這個秋,Chill 嗨嗨!穿搭美美去賞楓,裝備款款去露營⋯⋯你的秋天怎麼過?秋日 To Do List 等你分享! 秋季全站徵文,我們準備了五個創作主題,參賽還有機會獲得「火烤兩用鍋」,一起來看看如何參加吧~
Thumbnail
美國總統大選只剩下三天, 我們觀察一整週民調與金融市場的變化(包含賭局), 到本週五下午3:00前為止, 誰是美國總統幾乎大概可以猜到60-70%的機率, 本篇文章就是以大選結局為主軸來討論近期甚至到未來四年美股可能的改變
Thumbnail
這個月,忽然達成 2 個里程碑。 第一個里程碑,是我在 2022 年底,有訂下 2023 年的創業月收入(不含合夥),想要盡可能達到 2 萬元生活費。 我並沒有全心投入創業行銷,而是被動行銷,想嘗試會如何。所以我 2023 年每月的創業大概是 1 萬元上下,而今這個月計算下來,忽然發現達到...
Thumbnail
隨著科技不斷進步,智能家居技術正日益融入我們的日常生活。這種趨勢不僅影響了我們的家居生活,還對現代網站開發產生了深遠的影響。本文將深入探討智能家居與現代網站開發之間的聯繫,並預測未來的趨勢。
Thumbnail
《爛漫基隆國際藝術聖誕港12月2日熱情點燈、陸海空光雕耶誕與您緊抓時刻 》 2023年的《英雄聯盟》世界賽總決賽在首爾高尺天空巨蛋舉行,獲得《英雄聯盟》世界賽總決賽主題曲,受邀演唱、本次入選由LCK賽區T1對上LPL賽區WBG,除了虛擬偶像團體心鋼之聲(Heart Steel)以外,人
Thumbnail
想要自架網站,以下幾個網站架設的重點必須掌握! 網域 (Domain Name): 網域是網站的網址或URL的一部分,如 "example.com"。它使使用者能夠輕鬆訪問你的網站,而無需記住複雜的IP地址。網域的購買和續約通常透過域名註冊商進行管理。
Thumbnail
"讓我們一起探索世界的聲音!英文方塊的線上英文發音課程絕對是狗狗的智慧之選!" 本穀對於聲音很敏銳也很敏感,學習力應該算是滿快的(自己說), 馬麻之前教我指令的時候,都是講中文,某天她心血來潮, 想說試試看用英文講,想考驗本穀的智慧,好吧我就秀一波給妳看! 當她說SIT!我很快速就坐了下
Thumbnail
自2022年8月份開始,我盡量在每周透過電子報方式分享當周我所找到的有趣新玩意兒。這篇是擷取2022年8月份的部份精彩內容:面對恐懼勇往直前 – Fear Setting Exercise 🦁🚀全球遠端工作的好選擇:一個月台北房租,享受全世界旅行 🌍✈️ 檔案分享工具好神物 – WeTrans
Thumbnail
說是開發過程的筆記,應該是撞牆心血錄,因為各式各樣的原因,所以為前後端串接困擾了很久⋯⋯
Thumbnail
無論是個人或企業層面,學習使用 No Code 工具和技術都有助提升工作效率。對於個人職涯來說,能夠掌握 No Code 的開發技能,懂得利用相關工具改善流程和解決問題,必能助你在職場上脫穎而出。這篇文章會為大家介紹 7 個 No Code 網站開發工具,並逐一詳細說明它們的特式和架站方法。
Thumbnail
每個人可能都不只有一項專長與興趣,有些可能在後來才會發展出來,也可能是自己以前未曾想像過的結果,此篇為貓頭鷹開啟人生另一斜槓興趣「理財」研究的緣由與投資理財心路歷程,想知道如何一步步學習聰明投資理財,讓資產安穩增值,請伴隨貓頭鷹腳步一起成長。