|

Service Workers教程

Service Workers教程Service Workers是行動網頁上預先引進Web應用中的一項核心技術。它們允許資源的快取和推播通知,這兩個主要的特點早期只在本機應用程序中出現。 Service Workers介紹 背景處理 離線支援 安裝期間進行預快取資源 快取網路請求 Service Worker生命週期 註冊 範圍 安裝 啟動 更新Service Worker 提取事件 背景同步 推播事件 關於控制台日誌的注釋 Service Workers介紹 ...

tech wiki
tech wiki
9 min read
|

CSS 變形效果

CSS 變形效果如何使用 CSS transform 屬性 變形效果可讓你在 2D 或 3D 空間中,移動、旋轉、縮放和扭曲元素。它們是一個非常酷的 CSS 功能,尤其是與動畫結合時。 2D 變形效果transform 屬性接受以下函數: translate() 移動元素 rotate() 旋轉元素 scale() 按比例縮放元素的大小 skew() 扭曲元素 matrix() 使用 6 個元素的矩陣執行上述任一操作,這種寫法不太直觀,但節省空間 我們還有具體軸的函數: ...

tech wiki
tech wiki
2 min read
|

JavaScript資料結構:佇列

JavaScript資料結構:佇列佇列(Queue)和堆疊(Stack)相似,但插入點和移除點不同。 我們在佇列的一端新增項目,而在另一端移除項目。 這種結構被稱為「先進先出」(First In, First Out,FIFO)。 就像你可以想像的任何佇列,例如在餐廳、舞廳或者等待進入音樂會大廳時。 以下是使用JavaScript實現佇列的可能實作,使用私有類別欄位(Private Class Fields),內部儲存使用陣列: 12345678class Queue  ...

tech wiki
tech wiki
2 min read
|

Redis的入門步驟

Redis的入門步驟在您已經安裝並運行Redis之後,您可以開始使用它了! 最簡單的方法是使用redis-cli,這是在安裝Redis時一同安裝的應用程式。 這是一種內建的方法,可以在不需要設置應用程式的情況下對Redis進行命令操作。 您可以使用redis-cli -h <主機名> -p <埠號> -a <密碼>的方式連接到遠程Redis服務器 一旦進入Redis CLI應用程序,就可以開始將數據存儲到其中。 使用結構SET < ...

tech wiki
tech wiki
2 min read
|

向 Set 添加項目

# JavaScript 的 Set 數據結構 Set 數據結構允許將數據添加到容器中,這個容器可以是對象或基本類型(字符串、數字或布爾值)的集合,你可以將它看作是一個 Map,其中值被用作 Map 的鍵,而 Map 的值始終是一個布爾值 true。 什麼是 Set 初始化 Set 向 Set 添加項目 檢查 Set 中是否存在項目 按鍵刪除 Set 中的項目 確定 Set 中的項目數量 刪除 Set 中的所有項目 遍歷 Set 中的項目 使用值初始化 Set 轉換為數 ...

tech wiki
tech wiki
3 min read
|

Linux 命令:wc

Linux 命令:wc快速指南介紹 wc 命令,用於計算行數、單詞數或字節數。 wc 命令提供有關文件或通過管道接收的輸入的有用信息。 123echo test >> test.txtwc test.txt1 1 5 test.txt 通過管道的示例,我們可以計算運行 ls -al 命令的輸出: 12ls -al | wc6 47 284 返回的第一列是行數,第二列是單詞數,第三列是字節數。 我們可以告訴它只計算行數: 1wc -l test.txt 或者只 ...

tech wiki
tech wiki
1 min read
|

什麼是JavaScript前端框架?

什麼是JavaScript前端框架?對前端框架的簡要介紹 網際網路在過去的幾十年中迅速發展,我們在網絡上可以建立的體驗的需求和複雜性也隨之增長,因此我們必須建立起以與移動應用和桌面應用競爭為目標的應用程式。 隨著時間的推移,組織和個人創建了大量的工具和庫,我們可以利用這些工具來簡化開發工作。 有些工具從未受到大眾的喜愛。 有些工具則被廣泛採用並廣泛使用。 這就是React,Vue.js,Angular,Ember,Svelte,Preact等工具的例子。 JavaScript ...

tech wiki
tech wiki
2 min read
|

程式設計入門

程式設計入門這篇文章是一個完整的程式設計入門課程。 一般的程式設計。 在開始學習特定的程式語言之前,有一些基本概念你需要熟悉。這些概念並不依賴於特定的程式語言,但對每個開發者來說都是必要的。 如果你是程式設計的新手,這篇文章的目標是幫助你準備並提供基本的概念。 具體來說,你將學習以下內容: 什麼是電腦 什麼是程式 什麼是程式語言 作為一個程式設計師的工作 作為一個程式設計師不需要做的事情 不同的程式設計範式 可以使用的不同程式設計語言,以及應該選擇哪一個 什麼是錯誤 以及 ...

tech wiki
tech wiki
12 min read
|

blog-seo

我每天寫了兩年的部落格文章,這是我對於SEO學到的5件事情 從2018年1月25日開始,在我35歲生日前一天,我開始了我的部落格之旅。 在這篇部落格文章中,我打算告訴你五件有關SEO的事情,這些事情你可能還不熟悉。 SEO技巧一:不要擔心SEO如果你在網路上閱讀如何吸引更多讀者到你的部落格的方法,你會發現SEO是其中一個經常被提到的事情。 大多數時候,你會看到人們談論關鍵字和關鍵字工具。 我們喜歡工具,所以我們開始使用它們,花了很多時間從免費工具中獲得最大價值。 對吧?錯了。 ...

tech wiki
tech wiki
5 min read
|

Pug指南

Pug指南如何使用Pug模板引擎 Pug介紹 Pug長什麼樣子? 安裝Pug 設置Pug作為Express的模板引擎 你的第一個Pug模板 在Pug中插入變量 插入函數返回值 為元素添加id和class屬性 設置doctype Meta標籤 添加腳本和樣式 內聯腳本 循環 條件語句 設置變量 增加變量的值 將變量賦值給元素值 迭代變量 包含其他Pug文件 定義塊 擴展基礎模板 注釋 可見 不可見 Pug介紹什麼是Pug?它是一個用於服務端Node.js應用程序的模板引 ...

tech wiki
tech wiki
9 min read
|

初學者程式設計師的24個提示

初學者程式設計師的24個提示 耐心一點。你不會學得很快,這需要時間。 聽取所有的建議,但不必全部都照著做。 嘗試忽略過多的熱情(炒作)和過多的消極情緒(例如「PHP是垃圾」- 不是真的)。 在做教程時,自己打碼,不要複製/粘貼。細微但重要的不同,在於這段程式碼是你自己的。 通過實踐學習,而不是僅僅觀察別人的實踐。找到一個問題,即使是一個簡單的問題,利用程式碼來解決。創建數不清的小型網站/應用。 開始時要先理解問題。一旦你理解了問題,編程就成為了容易的部分。 ...

tech wiki
tech wiki
2 min read
|

JavaScript if/else 條件語句

JavaScript if/else 條件語句學習 JavaScript if 條件語句的基礎知識 if 語句用於根據表達式的評價結果選擇不同的程序路徑。 以下是最簡單的例子,始終執行: 123if (true) { // 做某事} 相反地,以下語句永遠不會執行: 123if (false) { // 做某事(?永遠不會執行?)} 如果在條件語句後只有一個語句要執行,可以省略大括號只寫該語句: 1if (true) d ...

tech wiki
tech wiki
1 min read
|

how-to-detect-adblocker

如何使用JavaScript檢測是否正在使用廣告攔截程序 我使用的一種方法是,在我知道正在使用廣告攔截程序的情況下為網站添加自己的廣告。 對於像程序員這樣的專業使用者和技術人員來說,使用廣告攔截程序非常常見。 在我的網站上,我估計大約有20%到25%的訪問者使用某種形式的廣告攔截程序。 我對此沒有任何問題,儘管我支持通過廣告來維持博客運營,但我想做的一件事是,只有在啟用了廣告攔截程序時,才能推廣我自己的產品,這樣您才不會看到我使用的廣告網絡Carbon的廣告,而是一個我想要推 ...

tech wiki
tech wiki
5 min read
|

使用Axios进行HTTP请求

使用Axios进行HTTP请求Axios是一个非常受欢迎的JavaScript库,可用于执行HTTP请求,并可在浏览器和Node.js平台上运行。 介绍Axios 安装 Axios API GET请求 给GET请求添加参数 POST请求 介绍AxiosAxios是一个非常受欢迎的JavaScript库,可用于执行HTTP请求,并可在浏览器和Node.js平台上运行。 它支持所有现代浏览器,包括对IE8及更高版本的支持。 它基于Promise,这使得我们可以使用async& ...

tech wiki
tech wiki
6 min read
|

Safari,在退出前發出警告

Safari,在退出前發出警告如何避免意外關閉Safari,使用一個簡單的技巧 我是一個經常換瀏覽器的人。 我每天使用瀏覽器的時間太多了,有時候只是想換一個新的瀏覽器來試試新功能。 今天輪到了Safari。 我很喜歡Safari。它輕巧,功能簡單,非常快速。 然而,在打開新的標籤時,我不小心按下了cmd-Q,導致瀏覽器退出了。 Chrome和Firefox在試圖關閉它們時提供了一個很好的可選確認對話框: 但是Safari沒有這個功能。 因此,我重新將cmd-Q映射為cmd- ...

tech wiki
tech wiki
1 min read
|

简介:npm包管理器

简介:npm包管理器快速指南到npm,这是Node.js成功的重要组成部分。截至2017年1月,npm注册表中已有超过35万个软件包,使它成为地球上最大的单一语言代码仓库,你可以确信几乎任何东西都可以找到一个软件包。 介绍npm 安装 如何使用npm 安装所有依赖项 安装单个软件包 更新软件包 版本控制 运行任务 介绍npmnpm是Node.js的标准包管理器。 截至2017年1月,npm注册表中已有超过35万个软件包,使它成为地球上最大的单一语言代码仓库,你可以确信 ...

tech wiki
tech wiki
4 min read
|

如何使用Mac連接Raspberry Pi

如何使用Mac連接Raspberry Pi使用Rapbian透過VNC進行連接Raspberry Pi的步驟指南 最近我入手了一個Raspberry Pi來進行測試並實現一些項目點子。 我安裝了Raspbian,這是專為Raspberry Pi打造的Linux版本。 然後,我使用HDMI線將Raspberry Pi連接到電視上,並使用USB鼠標和USB鍵盤進行操作,以安裝作業系統並進行基本設置。 接著,我在Pi上設置了VNC服務器,以便能夠從Mac上進行連接。我並不想一直將它 ...

tech wiki
tech wiki
1 min read
|

如何在Node.js中使用MongoDB

如何在Node.js中使用MongoDB在本教程中,我將向您展示如何從Node.js與MongoDB數據庫進行互動。 如果您對MongoDB不熟悉,請查閱我們的基礎指南,以及如何安裝和使用它的指南:) 我們將使用官方的mongodb npm套件。如果您已經有一個正在進行中的Node.js項目,可以使用以下命令來安裝它: 1npm install mongodb 如果您從頭開始,請在終端中創建一個新的文件夾,然後運行npm init -y來啟動新的Node.js項目,然後 ...

tech wiki
tech wiki
6 min read
|

如何在家工作而不发疯

如何在家工作而不发疯在十多年的远程工作经验中得出的一些建议 我已经在家工作了11年。 在此之前,我也一直在家工作,但不是为雇主工作,是为了学校。 当我在2008年转为自由职业者时,这并不是一个艰难的转变。我习惯了独自学习。 在继续之前,我建议你做一件事情。进行这个 人格类型测试 并看看那个网站告诉你什么。 我是一个内向的人,独立并且喜欢独自做事。 这篇文章在很大程度上受到这一事实的影响,如果你是一个需要周围有人才能提高效率的外向型人格,你可能会认为我说的是疯狂的。 我给你的第 ...

tech wiki
tech wiki
3 min read
|

Node.js中的錯誤處理

Node.js中的錯誤處理如何在Node.js應用程式執行期間處理錯誤 Node.js中的錯誤通過異常處理。 建立異常使用throw關鍵字來建立異常: 1throw value JavaScript執行此行時,正常程式流程將中斷,控制權會返回到最近的異常處理器。 通常在用戶端程式碼中,value可以是任何JavaScript值,包括字串、數字或對象。 在Node.js中,我們不會拋出字串,而是拋出錯誤對象。 錯誤對象錯誤對象是Error對象的實例,或是擴展了Error類別的 ...

tech wiki
tech wiki
4 min read
|

Linux指令:rmdir

Linux指令:rmdir快速指南:rmdir命令用於刪除文件夾 就像您可以使用mkdir命令創建文件夾一樣,您可以使用rmdir命令刪除文件夾: 12mkdir fruitsrmdir fruits 您也可以同時刪除多個文件夾: 12mkdir fruits carsrmdir fruits cars 需要注意的是,您要刪除的文件夾必須是空的。 若要刪除包含文件的文件夾,我們將使用更通用的rm命令,該命令可刪除文件和文件夾,使用-rf選項: 1rm -rf fruits ...

tech wiki
tech wiki
1 min read
|

如果Docker容器立即退出該怎麼辦

如果Docker容器立即退出該怎麼辦如果你使用docker run命令運行一個容器後,容器立即退出,並且每次在Docker Desktop中點擊啟動按鈕後容器都立即退出,這表示存在問題。 解決問題的方法是運行docker logs命令,並在命令的末尾添加容器的名稱: 1docker logs <container_name> 你也可以在Docker Desktop中點擊容器的名稱,它會顯示一個日誌列表。 在這種情況下,通過快速的谷歌搜索,我意識到我在CMD命令中 ...

tech wiki
tech wiki
1 min read
|

文本的HTML標籤

文本的HTML標籤發現您可以在網頁上使用的各種HTML標籤來顯示文本 p 標籤此標籤定義了一個文本段落。 1<p>一些文本</p> 這是一個塊元素。 在其中,我們可以添加任何內聯元素,例如 span 或 a。 我們不能添加塊元素。 我們不能將 p 元素嵌套到另一個其中。 默認情況下,瀏覽器會對段落進行上下邊距設置。在Chrome中為 16px,但實際值可能各瀏覽器不同。 這使得兩個連續的段落之間產生間距,模擬我們印刷文本中的“段落”。 span 標籤 ...

tech wiki
tech wiki
5 min read
|

電子基礎:短路

電子基礎:短路在電子系統中,我們可以有不同的元件執行不同的工作,結合在一起形成一個電路。 在一個典型的電路中,我們有一個電壓源,以及具有某種功用的裝置。 電壓源可以是電池,或者例如提供電力的Arduino板。 假設電壓是5V。我們有一個正極和一個負極。 如果我們使用一根電線將這兩個極直接連接在一起,我們將會產生一個短路。 短路是非常糟糕的情況,也是電路中問題最常見的原因之一,在實踐中,我們采取各種預防措施,因為它可能導致我們的設備和元件受到嚴重損壞,使它們無法使用。 即使在1 ...

tech wiki
tech wiki
1 min read
|

如何使用CSS使元素變小或變大

如何使用CSS使元素變小或變大有時候,在設計頁面時,您可能需要調整某個元素的大小,讓它看起來更小或更大。 您可以使用CSS的zoom屬性來縮放任何HTML元素。 使用小於1的值可以使元素變小。例如,將元素的大小縮小一半,可以使用0.5: 123div { zoom: 0.5;} 使用大於1的值可以使元素變大,例如這個例子中將元素放大2倍: 123div { zoom: 2;} 注意,這個方法在Firefox瀏覽器中不起作用,您 ...

tech wiki
tech wiki
1 min read
|

Linux 命令:gunzip

Linux 命令:gunzip一個關於 gunzip 命令的快速指南,用於解壓縮 gz 格式的文件 gunzip 命令與 gzip 命令基本上是等效的,只是 -d 選項預設總是啟用的。 可以這樣調用該命令: 1gunzip 文件名.gz 這將對文件進行解壓縮,並刪除 .gz 擴展名,將結果放到 文件名 文件中。如果該文件已存在,將覆寫它。 使用 -c 選項和輸出重定向,可以提取到不同的文件名中: 1gunzip -c 文件名.gz > 另一個文件名 gunzip 命 ...

tech wiki
tech wiki
1 min read
|

如何使用Google字型

如何使用Google字型我非常推崇使用系統字體,它們快速、輕量且效果出色,但有時候你也需要一些特別的字體。 你需要一款能讓你的設計看起來很好的字體,也許像Slabo、Lato或Raleway這樣的字體。 Google提供了一個名為Google Fonts的工具,作為其眾多服務的一部分,該工具(截至撰寫本文時)支援992個字型家族: 這個界面有點令人眼花繚亂,作為一個對字體不熟悉的人,我肯定對我應該選擇哪一款字體感到困惑。 通常我會在Google上搜索「最佳Google字體」 ...

tech wiki
tech wiki
3 min read
|

語音合成 API

語音合成 API語音合成 API 是一個非常棒的工具,現代瀏覽器提供了這個 API,讓我們能夠嘗試建立新型的介面並讓瀏覽器與使用者互相對話。 該 API 於 2014 年被引入,現在已經被廣泛採用,Chrome、Firefox、Safari 和 Edge 都已提供支持。不過,IE 不支援。 它是 Web 語音 API 的一部分,還包括「語音辨識 API」,不過目前只有 Chrome 在實驗模式下支援該功能。 最簡單的使用語音合成 API 的示例是一行程式碼: 1speech ...

tech wiki
tech wiki
8 min read
|

使用Link在Next.js中链接两个页面

使用Link在Next.js中链接两个页面如何在Next.js中链接两个或更多页面的教程 本教程从第一个Next.js教程开始。我们建立了一个包含一个页面的网站: 我想在这个网站上添加第二个页面,一个博客文章列表。它将呈现在/blog目录下,并且暂时只包含一个简单的静态页面,就像我们的第一个index.js组件一样: 保存新文件后,正在运行的npm run dev进程已经能够渲染出页面,而无需重启。 当我们访问URL http://localhost:3000/blog ...

tech wiki
tech wiki
4 min read