|

在 Next.js 應用程式中增加包裝組件

在 Next.js 應用程式中增加包裝組件如何使用包裝組件並向其中添加常用的側邊欄或頂部欄 您網站上的所有頁面幾乎都是相同的,都有外觀元件和共同基礎層,您只需要更改其中的內容。 有導覽列、側邊欄和實際內容。 在 Next.js 中要如何建立這樣的系統? 有兩種方法。一種是使用高階元件,通過創建components/Layout.js組件: 123456789101112export default Page => { return () => ( < ...

tech wiki
tech wiki
3 min read
|

如何使用Axios發送url編碼數據

如何使用Axios發送url編碼數據學習如何使用Axios發送url編碼的數據 我遇到了這個問題:我需要從一個Node.js應用程序中調用的API只接受url編碼格式的數據。 我必須找出解決這個問題的方法:如何使用Axios發送url編碼的數據? 首先,我們需要安裝qs模塊。這是一個很棒的查詢字符串解析和字符串化庫,還帶有一些額外的安全功能: 1npm install qs 然後,我們需要導入qs模塊以及當然還有Axios的導入語句: 12const qs = requir ...

tech wiki
tech wiki
2 min read
|

如何在 macOS 中解決「iphoneos 不能找到」錯誤

如何在 macOS 中解決「iphoneos 不能找到」錯誤一個解決 React Native 混亂錯誤的快速指南 在安裝 React Native 以在 iOS 上運行專案時,我遇到了一個問題。 我進入專案的 ios 文件夾並執行了指令 pod install,這是我被告知要執行的。 但是在執行這個指令時,我收到了一個很長的錯誤訊息: 從這個錯誤訊息中,我看到了「error: SDK “iphoneos” 不能被找到」。 這看起來很可疑,是吧? 所以我做了一些研究,解決 ...

tech wiki
tech wiki
1 min read
|

Vite 教程

Vite 教程最近我開始使用 Vite,它被譽為 “新一代的 create-react-app“。 那什麼是 Vite? 有時候這可能令人困惑,因為有很多工具都在以不同的方式做同樣的事情,比如 Parcel、esbuild、Rollup、Rome、webpack、Turbopack(對,我正在努力將它的大小寫寫對)… 我傾向於認為它們基本上是在做同樣的事情,儘管它們實際上並不相同。 但是當人們開始在很多地方使用 Vite,並且我在 Twitter 上不斷看到它的介紹時,我也變 ...

tech wiki
tech wiki
3 min read
|

how-to-trim-leading-zero-number

#如何在JavaScript中刪除數字前面的零 如果你有一個以零開頭的數字,比如 010 或者 02,你該如何刪除那個零呢? 有多種方法。 最明確的方法是使用 parseInt(): 1parseInt(number, 10) 10 是進制,應該始終指定以避免在不同瀏覽器上出現不一致,儘管一些引擎可以正常工作而不需要指定進制。 另一種方法是使用 + 一元運算符: 1+number 這些都是最簡單的解決方案。 你還可以使用正則表達式,像這樣: 1number.replace ...

tech wiki
tech wiki
1 min read
|

GPL授權協議

GPL授權協議對於開發人員來說,您很可能會使用很多以GPL許可證發布的庫和軟件。 在本文中,我想對這個許可證進行一個高層次的概述,告訴您可以如何使用GPL軟件、不能使用GPL軟件,以及依賴於GPL軟件時您必須做些什麼。 GPL從歷史上來看,是開源軟件的核心。它最初由Richard Stallman於1989年創建,用於GNU計劃,這是一個基於UNIX操作系統的免費軟件版本,該操作系統當時是專有的。 自從GNU推出以來,對我們的行業產生了巨大的影響。我們稱之為“Linux”的伺 ...

tech wiki
tech wiki
3 min read
|

JavaScript 中的 Unicode

JavaScript 中的 Unicode學習如何在 JavaScript 中處理 Unicode,瞭解 Emoji 的組成,ES6 的改進以及在處理 Unicode 時可能遇到的一些問題。 源文件的 Unicode 編碼 JavaScript 在內部如何使用 Unicode 在字符串中使用 Unicode 歸一化 Emoji 獲取字符串的正確長度 ES6 Unicode 編碼點转義 編碼 ASCII 字節 Unicode 編碼的源文件如果沒有指定其他方式,瀏覽器會假設任 ...

tech wiki
tech wiki
8 min read
|

Johnny Five,如何與LCD屏幕配合工作

Johnny Five,如何與LCD屏幕配合工作 本文是Johnny Five系列文章的一部分。請參閱第一篇文章。 LCD屏幕是一個很酷的組件,因為我們可以用它在各種不同的創意項目中使用。 這個我拿到的是名叫1602A的。 它有16個引腳。我按照以下方式連接它: 引腳1連接到0V 引腳2連接到控制背光的電位器 引腳3連接到5V 引腳4連接到Arduino的引腳7 引腳5連接到0V 引腳6連接到Arduino的引腳8 引腳11連接到Arduino的引腳9 引腳12連接到Ar ...

tech wiki
tech wiki
2 min read
|

如何在JavaScript中將字符串的第一個字母轉換為大寫

如何在JavaScript中將字符串的第一個字母轉換為大寫在JavaScript中,有多種方法可以將字符串的第一個字符轉換為大寫。學習這些方法,並找出哪一種方法是最好的,純粹使用JavaScript。 將字符串的第一個字符轉換為大寫是一個常見的字符串操作之一:將其第一個字母轉為大寫,保持字符串的其餘部分不變。 最好的方法是通過兩個函數的組合來實現。 一個函數用於將第一個字符轉為大寫,第二個函數用於切割字符串並從第二個字符開始返回。 像這樣: 12const name = &# ...

tech wiki
tech wiki
2 min read
|

如何在 Svelte 模板中添加註釋

如何在 Svelte 模板中添加註釋如何避免 Svelte 將模板的部分內容渲染到客戶端 HTML 註釋非常適合在頁面中隱藏元素。 在 HTML 中,您可以這樣添加註釋: 1<!-- 這裡是一個註釋 --> 您也可以在區塊中使用註釋,以隱藏多行 HTML 代碼: 12345<!--這是一個註釋在這裡--> 請注意,這仍然可以在頁面源代碼中看到。瀏覽器只是將其隱藏起來,但可以隨時查看該註釋。 您可以在 Svelte 模板中使用相同的註釋。但是在 Sv ...

tech wiki
tech wiki
1 min read
|

如何使用Phaser.js創建平台遊戲

如何使用Phaser.js創建平台遊戲在這個教程中,我將使用Phaser.js創建一個平台遊戲。 玩家可以使用左/右箭頭鍵移動,使用上箭頭鍵跳躍。目標是收集遊戲中的所有星星: 當玩家收集到所有星星時,我們將在頂部顯示“遊戲結束”,然後沒有其他操作。 雖然這非常簡單,但這是開始一個非常有趣的遊戲的開始,並且這也是展示Phaser以及JavaScript作為遊戲創作編程語言的絕佳方式。 設置專案創建一個空文件夾,然後運行以下命令: 1npm init -y 這將初 ...

tech wiki
tech wiki
12 min read
|

nodejs-hosting

在哪裡託管Node.js應用程式 Node.js應用程式可以在許多不同的地方託管,取決於您的需求。以下是您可以選擇的各種選項的列表。 我將從最簡單且受限制的選項開始列出,然後逐漸介紹更複雜且功能強大的選項。 最簡單的選項:本地隧道 即使您的IP地址是動態的,或者您在NAT下,您也可以使用本地隧道在計算機上部署您的應用程式並提供請求。 這個選項適用於快速測試、演示產品或與一小群人分享應用程式。 這方面非常好的一個工具是ngrok,它可以在所有平台上使用。您只需輸入ngrok P ...

tech wiki
tech wiki
3 min read
|

什麼是CDN?

什麼是CDN?了解什麼是CDN以及它的用途 CDN代表內容交付網絡。 它是一組分佈在全球各地並相互連接的伺服器。 在幫助加快網站速度的背景下,它們的工作是分發資源(例如圖像、JavaScript文件、CSS和HTML),以便這些資源可以物理上靠近每個可能想要訪問您網站的用戶,從而改善連接速度並減少延遲。 CDN是最終的快取網絡,也是以最便宜的方式在全球範圍內提供內容。 訪問者將永遠不會訪問存放您文件的實際網絡伺服器,而是會訪問這些CDN伺服器,從而減少負載。 CDN提供: ...

tech wiki
tech wiki
1 min read
|

如何在 Markdown 字串中更改圖片的 URL

如何在 Markdown 字串中更改圖片的 URL最近,我試圖將我的基於 Hugo 的部落格移植到 Next.js(結果並不理想),而在這個過程中遇到了一個問題。 Hugo 允許我在圖片名稱中使用空格,這對於使用截圖並且預設檔名為 Screen Shot 2022-... 是很方便的。 但是 Next.js 的 Markdown 則不允許使用空格。因此,我撰寫了一個腳本來將所有的圖片檔名中的空格改為連字符(hyphen)。 12345"Screen Shot 202 ...

tech wiki
tech wiki
2 min read
|

社會證明原則

社會證明原則什麼是社會證明原則?它如何幫助你發展業務? 本文是一系列關於心理學原則的文章之一,特別針對獨立開發者和創業家。 在這充滿機會和選擇的世界裡,我們可以使用一個指導原則來推動自己做正確的事情,那就是社會證明。 我們是群體性動物,自古以來,看別人做什麼然後跟隨他們是一種明智的選擇,大多數時候是沒錯的。下意識認為做一個受歡迎的選擇不會出錯。 “至少你可以責怪別人,對吧?做別人做的事情,你不想被逐出部落,洞穴外面很危險” 這就是社會證明:觀察與某事有關的信號,與其他人有 ...

tech wiki
tech wiki
3 min read
|

使用Go進行CPU和內存監控:入門指南

使用Go進行CPU和內存監控:入門指南Go語言生態系統提供了一種非常簡便的方法來對應用程序進行監控。 本文將介紹一個由Dave Cheney提供的包,通過在main()函數中添加一行代碼,可以非常容易地對程序進行調試。 開始你的Go CPU監控步驟 1:下載github.com/pkg/profile運行以下命令: 1go get github.com/pkg/profile 步驟 2:將監控功能添加到main()函數中在你的代碼中加入以下的import語句: 123456 ...

tech wiki
tech wiki
3 min read
|

C陣列介紹

C陣列介紹一個C陣列的介紹 陣列是一個可以儲存多個值的變數。 在C語言中,陣列中的每個值必須有相同的類型。這意味著你可以有int值的陣列,也可以有double值的陣列,以此類推。 你可以像這樣定義一個int值的陣列: 1int prices[5]; 你必須總是指定陣列的大小。C本身並不提供動態陣列(你需要使用像是鏈表之類的資料結構來實現)。 你可以使用常數來定義陣列的大小: 12const int SIZE = 5;int prices[SIZE]; 你可以在定義時初始化 ...

tech wiki
tech wiki
2 min read
|

最好的技術堆疊可能是你最熟悉的那個。或者也可能不是。

最好的技術堆疊可能是你最熟悉的那個。或者也可能不是。當你想要建立一個新應用程式時,你有兩個選擇。 第一個選擇是使用你已經熟悉的技術來建立。如果你熟悉 React,那就繼續使用 React。 另一個選擇是選擇全新的技術堆疊。如果你熟悉 React,你可能會選擇使用 Svelte 或 Vue.js。如果你熟悉 Swift,你可能會選擇使用 React Native。 這是一個困難的問題,因為作為一個開發者,我認為我們應該平衡對某個技術的深入了解,成為該技術的專家,以及對各種技術都 ...

tech wiki
tech wiki
2 min read
|

C轉換格式符和修飾符

C轉換格式符和修飾符一個有用的 C 轉換格式符和修飾符的參考手冊。 在這篇文章中,我想為你列出所有可以在 printf()、scanf() 和類似的輸入輸出函數中使用的 轉換格式符。 格式符 含義 %d / %i 有符號十進制整數 %u 無符號十進制整數 %c 無符號 char %s 字符串 %p 指針的十六進制形式 %o 無符號八進制整數 %x / %X 無符號十六進制數 %e 科學記號表示的浮點數(使用小寫 e) ...

tech wiki
tech wiki
2 min read
|

如何自建Plausible分析工具

如何自建Plausible分析工具我决定自己托管我的网站分析数据。 为什么这样做呢? 作为一个人生原则,我倾向于不自托管自己的“东西”,除非其优点远远超过了缺点。 首先,自托管的缺点是显而易见的,那就是“从现在开始,这是我需要担心的事情”。将这个负担交给其他人是很棒的,尤其是当你只使用免费方案时。 我也乐意支付费用,别误解我的意思。 但有时成本是无法接受的。 就像我的电子邮件通讯。当寄出的数量很大时,托管解决方案的费用就太高了。 另外,就网站分析而言,当页面浏览量相当大时,托 ...

tech wiki
tech wiki
9 min read
|

Phaser: 場景

Phaser: 場景 此篇文章是 Pharser 系列的一部分。點選這裡 查看這個系列的第一篇文章。 場景是我們定義遊戲的地方,在配置中將它們作為屬性傳遞給 scene 物件。 特別是,我們可以定義 preload 是我們載入外部資源的函式 create 在遊戲剛剛建立時被呼叫,在這裡我們可以定義遊戲開始時所需的 GameObjects update 是遊戲事件迴圈,用於定義遊戲的運作方式 GameObjects 是 Phaser 物件的一種特殊類型 以下是上述提到 ...

tech wiki
tech wiki
1 min read
|

我用來運行這個博客的技術棧

我用來運行這個博客的技術棧在本文中,我描述了我運行博客的方式 網站平台 網站托管地點 文章 發佈文章的工作流程 圖片 電子報 書籍 就是這樣! 網站平台這個網站是使用Astro搭建的靜態網站。 以前我使用Hugo來構建,我喜歡它。不過現在我更喜歡使用JSX創建UI。 像Hugo一樣,Astro非常快速,可以生成快速響應的頁面,可以部署在Netlify或Cloudflare Pages等平台上。這就是我所需的一切。 網站托管地點我以前使用Netlify來托管,現在改用Clo ...

tech wiki
tech wiki
2 min read
|

JavaScript資料結構:鏈結串列

JavaScript資料結構:鏈結串列鏈結串列是你可以學習到的最重要的資料結構之一。 在鏈結串列中,每個項目都包含對其後繼項目的引用。 我們可以從串列的開始處,即「頭部」,開始迭代遍歷所有項目,直到達到末尾(即「尾部」)。 相較於陣列,在低階程式語言中,項目並不相鄰於實際的記憶體位置,且沒有索引可供我們隨機訪問陣列中的項目。 我們無法在不從開始的情況下引用列表中的中間項目,因為我們不知道如何引用它。 JavaScript本身並沒有鏈結串列的實作,因此我們現在將創建一個。 首先 ...

tech wiki
tech wiki
5 min read
|

你在五年后的发展方向是什么?

你在五年后的发展方向是什么?当我还在大学时,我需要做一份实习工作,基本上就是在几个月的时间里无偿(或者只给很少的薪水)工作。 所以我去了一家公司的办公室(我唯一一次面试的现场面试),四处看了看,进行了一次小小的面试,然后被问了这个问题:“你在五年后的发展方向是什么?”。 我想我的回答大致是“肯定不会在这里”(😂),我还记得当时得到了赞许诚实的评价。 但他们没有再打电话给我 😆 我从不在乎给人留下好印象或者说好听的话,尤其是在商业环境中,不过如果你真的需要那份工作,你可能会 ...

tech wiki
tech wiki
2 min read
|

使用 `exports` 從 Node 文件中公開功能

使用 exports 從 Node 文件中公開功能如何使用 module.exports API 將數據公開給應用程序中的其他文件,或者公開給其他應用程序。 Node 具有內置的模塊系統。 Node.js 文件可以導入其他 Node.js 文件公開的功能。 當你想要導入某些東西時,你可以使用 1const library = require('./library') 來導入位於當前文件夾中的 library.js 文件中公開的功能。 在這個文件中,必須先 ...

tech wiki
tech wiki
2 min read
|

從無代碼到部分代碼

從無代碼到部分代碼我試著做些我從未嘗試過的事情:依靠一個服務處理網站。 我一直想要對我所做的一切擁有絕對的控制權。 但後來我愛上了Notion,並且喜歡它為網站提供動力的想法,正如我在這篇文章中所解釋的那樣。 在那裡,我提到了將我的新課程的登陸頁面託管的可能性。 但我改變了主意,因為我需要以無法使用Notion或其周圍的任何工具實現的方式來自定義它。 特別是我需要嵌入一個連接到付款彈出窗口的按鈕,並且這不是一個簡單的事情。 所以這是我所做的:我在Notion中構建了登陸頁面, ...

tech wiki
tech wiki
2 min read
|

追踪網站上的檔案下載

追踪網站上的檔案下載我有需要追蹤網站上的檔案下載。 起初,我查看了提供統計資訊的網址縮短服務,因為我以為那是我在沒有後端的情況下的唯一選擇(這是一個靜態網站)。但是,我並沒有找到令我感到興奮的解決方案。 然後,我看到了 Plausible 可以追蹤檔案下載。 這非常簡單,你只需要交換默認的腳本並列出你想追蹤的檔案副檔名,例如 pdf 和 epub。PDF 檔案會被默認追蹤,但是 epub 檔案不會,所以我需要將它們都添加進去。 從: 1<script defer dat ...

tech wiki
tech wiki
1 min read
|

如何使用JavaScript將字符串轉換為數字

如何使用JavaScript將字符串轉換為數字學習如何使用JavaScript將字符串轉換為數字 JavaScript提供了多種將字符串值轉換為數字的方法。 最佳方法:使用Number對象我個人認為最好的方法是使用Number對象,在非構造函數上下文中使用(不使用new關鍵字): 1const count = Number('1234') //1234 這也會處理小數。 Number是一個可以執行多個操作的包裝對象。如果我們使用構造函數(new Numb ...

tech wiki
tech wiki
5 min read
|

如何修復 Next.js 中的錯誤“PrismaClient 無法在瀏覽器上運行”

如何修復 Next.js 中的錯誤“PrismaClient 無法在瀏覽器上運行”我在 Next.js 網站上遇到了這個錯誤: PrismaClient 無法在瀏覽器上運行 我擁有這個頁面,並且它一切正常,直到我在代碼中註釋了一行,特別是在我的 getStaticProps() 方法中。 在那一行中,我調用了我在頁面文件頂部導入的 Prisma 實例的方法。 基本上,Next.js 會查看我們在 getStaticProps() 中使用的代碼並將其用於後端。它不會將其發送到前 ...

tech wiki
tech wiki
1 min read
|

如何使用 Hugo 开始一个技术博客

如何使用 Hugo 开始一个技术博客一个从零开始到部署的使用 Hugo 开始技术博客的详细教程 Hugo 是一个非常好的工具,可以用来开始一个博客。 我自己在这个博客中使用了 Hugo 已经超过 2 年了。我喜欢使用 Hugo 的原因有几个。 它是简单,无聊,灵活,快速。 最重要的原因是它是简单的。你不需要学太多东西就可以开始使用。 你可以使用 Markdown 编写内容,这个格式允许我使用我最喜欢的编辑器(Bear)来写文章。 Hugo 是无聊的。不要误会,这是一件非常好的 ...

tech wiki
tech wiki
11 min read
|

blog-still-relevant

網誌仍然有價值嗎? 這是一個合理的問題。在社交媒體和大型平台主導的今天,網誌仍然有價值嗎? 小角色能在互聯網上找到一些空間嗎?我們已經有太多的網站了嗎? 首先,我們永遠不會擁有太多的網站。每100個人中只有不到1個人創建內容。這是媒體消費的一個規律:每個有1億人口的國家有大約100個電視或廣播電台,報紙也是如此。 互聯網也是如此。如果你開始創建內容,並且做得好,最終你的內容將浮出水面,你將會成功。成功對你來說意味着什麼就是什麼。 這對於在YouTube上創建視頻、撰寫播客和網 ...

tech wiki
tech wiki
1 min read