iT邦幫忙

modern web相關文章
共有 509 則文章
鐵人賽 Modern Web DAY 4

技術 [Day 04] Message Queue - (1)

上個觀念 IOC 強調程式碼的品質,第二個觀念 message queue 強調的則是 “訊息的溝通”。 接下來會利用三篇文章的篇幅講解 message que...

鐵人賽 Modern Web DAY 3

技術 三日目:JavaScript 變數 変数ノ章

安安 我SONYKO ,怎麼才第三天今天介紹JavaScript 變數,及瀏覽器的編譯機制。レッツゴー! 每個程式語言一開始都要先變數,那變數是幹嘛用的?不覺得...

鐵人賽 Modern Web DAY 3

技術 [Day 03] IOC 控制反轉 & DI 依賴注入 - (2)

上回說明了 IOC 與 DI 的概念與基本實作方式,並在文末提及每次都自行實作依賴注入當 codebase 一大成本也會相當高,因此能不能有一個統一的介面來實做...

鐵人賽 Modern Web DAY 2

技術 [Day 02] IOC 控制反轉 & DI 依賴注入 - (1)

第一個主題先來暖暖身子,要講的不是一個 backend 專屬的技術或概念,更像是屬於寫出優質程式碼的一種方法或者說模式,畢竟不管是前端後端,或是任何領域的工程師...

鐵人賽 Modern Web DAY 1

技術 [Day 01] 系列文動機與大綱

Hi!各位鐵人賽讀者好,我是 Kyle,也可以叫我老莫,這是我第二次參加鐵人賽,去年的參賽主題為 React 從 0 到 1 推坑計畫,最後幸運完賽,希望今年也...

鐵人賽 Modern Web DAY 3
後端的鉗形攻勢 系列 第 3 篇

技術 [Day. 02] 工欲善其事,必先苦其心志,勞其筋骨。

今天要分享的是當打碼悍將必備的工具之一,程式碼編輯器。 Code Editor簡介 不論是資深碼農,還是剛步入Coding的懵懂小新肝,都必須要有幫助我們撰寫c...

鐵人賽 Modern Web DAY 2
後端的鉗形攻勢 系列 第 2 篇

技術 [Day. 01] 網頁,往前還是往後?

旺旺先備知識:網頁篇 今天將要來介紹基礎網頁概念~歡迎各路高手給予指教(・ω´・ )!! What is Web Development 所有的網站,都是由一...

鐵人賽 Modern Web DAY 1
後端的鉗形攻勢 系列 第 1 篇

技術 [Day. 00] 前言 & 作者序

參賽動機 猶豫了許久,終於還是決定參加今年的鐵人賽!雖然剛開學真的好多事QQ但還是希望我能趕上進度礙於自己才疏學淺,很多主題想做卻琢磨不夠XDD最後決定把在暑假...

鐵人賽 Modern Web DAY 5
Go into Web! 系列 第 5 篇

技術 Day5 | Gin - 好用的 web framework

昨天簡單介紹了如何利用 net/http 加上 html/template 這兩個 package 建立一個簡單的網站,但是在開發一個網站不是只有這麼簡單的事情...

鐵人賽 Modern Web DAY 4
Go into Web! 系列 第 4 篇

技術 Day4 | 無痛使用 Golang 打造屬於自己的網頁

前兩天已經介紹過基本的 Web 知識與安裝好相關環境了,接下來我們就使用 golang 原生提供的 net/http package 來建立一個簡單的網頁吧!...

鐵人賽 Modern Web DAY 3
Go into Web! 系列 第 3 篇

技術 Day3 | Web 基礎原理介紹

在真正開始進入 web 開發之前,我們必須要好好的理解 web 會用到的名詞與其運作原理,這樣在開發時才不會不清楚自己在做什麼,至於今天要說什麼呢,就讓我們繼續...

鐵人賽 Modern Web DAY 1
Go into Web! 系列 第 1 篇

技術 Day1 | 萬事起頭難

參賽動機 Hi 大家好!我是阿翔,本次是我第一次參賽,主要的目的是要逼自己整理好以往學習開發的一些好用的工具、開發方法與經驗,剛好最近工作有使用到 Golang...

達標好文 技術 領進前端門,修行在個人:一變應萬變的響應式網頁設計(2) - 常見版型佈局設定

禁止顯示x軸法則 在開發響應式網頁時最切記的就是不能出現x軸,為什麼呢?當使用者瀏覽時,若畫面有x軸也有y軸時,使用者必須上下左右滑動去瀏覽,這樣對於使用者體驗...

技術 領進前端門,修行在個人:一變應萬變的響應式網頁設計(1) - 基本環境、觀念

基本環境建立 因為各個不同的手機有不同的寬度,如下圖如果要符合每個不同的解析度去做開發,會導致開發上非常困難,所以需要加入以下這段語法 <meta nam...

技術 當一個人很想當網頁工程師

這標題是建立在轉職的基礎,很都東西都要從零開始學習,問題是業界是無盡的黑洞,用即戰力拉高門檻、工時壓縮經驗分享的效果,造成幾乎是不斷任用從其他公司離職的工程師。...

技術 領進前端門,修行在個人:掌握 Git 與 Github 程式時光機(1) - Git前置篇

安裝 首先,我們要先安裝Git!點擊圖片中紅色框框的的Download按鈕來下載Git安裝包,如下圖:下載完成後,開啟Git安裝包安裝Git於電腦中如果沒有要修...

技術 [筆記] React 如何使用 Redux-Observable 及 Google Map Api:副線打怪一下(3) - Finish

口罩即時查 先附上作品網址及成果展示:口罩即時查 功能(電腦、平板、手機皆可觀看) 電腦版 ᴘᴄ平板 ᴛ手機版 ᴍ 定位 - 在地圖上顯示目前位置 ᴘᴄ 藥局...

技術 [筆記] React 如何使用 Redux-Observable:副線打怪一下(2)

為何要使用Redux-Observable? 首先,一開始我們都知道redux跟react搭配的很好,redux扮演著資料倉儲的角色,但是許多的side eff...

技術 [筆記] React 如何使用 Redux-Observable:副線打怪一下(1)

題外話一下XD最近的武漢肺炎實在是太猖狂了在今天早上得知中國竟然連北京都淪陷了,進而封城了,這武漢肺炎真的是很母湯!!(中國北京封城)因為武漢肺炎的關係,全台掀...

技術 領進前端門,修行在個人:關於本系列文章

前言 這是我第一次參加寫文大賽,以往都只有在iT邦看各位大神的教學文,這次在過年間意外發現六角學院 - 鼠年全馬鐵人挑戰賽這項活動,其實也猶豫了很久才決定參加這...

技術 JavaScript 的 if 條件

運算子 要來正式介紹 if 條件式之前,必須要先來介紹運算子,因為 if 條件式內的條件會由運算子來進行比較與運算。 比較運算子 == 與 != 僅單純比...

技術 JavaScript 的陣列 (Array) 與物件 (Object)

之前曾經介紹過宣告變數,開頭用 var 後接數字 (Number) 或是字串 (String),而今天我們要介紹另一種變數型態,就是陣列 (Array) 與物...

技術 JavaScript 的 function 功能 (函式介紹)

★首先這篇文章適合以下背景的人閱讀 熟悉 HTML、CSS 正要開始一腳踏進 JavaScript 的初學者 號稱全世界最懶的一群人(軟體工程師),能坐就...

技術 初探前端三劍客之一 - JavaScript 大神(變數、console.log() 與 textContent)

★首先這篇文章適合以下背景的人閱讀: 熟悉 HTML、CSS 正要開始一腳踏進 JavaScript 的初學者 今天我們要開始進入 JavaScript...

技術 關於購物車頁面的 RWD 移動概念

鐵人賽結束了,但說過了寫文章是 to be continued 的,今天就要先來記錄一下這個購物車頁面的 RWD 移動概念。 回歸正常學習進度,檢視了一下作業與...

鐵人賽 Modern Web DAY 23

技術 [Day29] 自動化管理Service Worker(Part2)

繼續昨天「針對不同的URL來路由(Routing)到對應的cache策略」,這裡我要將兩種不同的URL分別存入獨立的sub-cache中。第一個為materia...

鐵人賽 Modern Web DAY 23

技術 [Day28] 自動化管理Service Worker(Part1)

之前在service worker中寫了這麼多cache strategies、background sync等等的程式碼,但是隨著我們開發的專案越來越大、檔案...

鐵人賽 Modern Web DAY 23

技術 [Day27] 了解Media API和Geolocation API(Part3)

終於要開始實作「獲取用戶地理位置」的功能了 要獲取地理位置必須使用「Geolocation API」這個Web API。先來看一下這個API的瀏覽器支援程度:整...

鐵人賽 Modern Web DAY 23

技術 [Day26] 了解Media API和Geolocation API(Part2)

昨天已經將video stream添加到video元素中,今天要來繼續實作當用戶按下「拍照鈕」後,會將最新的「video stream snapshot」傳送到...

鐵人賽 Modern Web DAY 23

技術 [Day25] 了解Media API和Geolocation API(Part1)

終於要來開始實作存取「裝置的媒體」和「地理位置」的功能。 當用戶要發佈貼文時,應該要開啟裝置的攝像鏡頭並將畫面顯示在PWA的表單中,當用戶按下拍照鍵時即完成影像...