Boison

Boison

AI 研究日誌 2
AI 工具

AI 研究日誌 2

在這篇文章中,我介紹了三個不同的AI應用:首先是「Speak」,一款使用OpenAI最新模型的英文學習app,它模擬真人對話,提供逐步遊戲化學習。接著是「ChatGPT for YouTube」,這是一款可以在YouTube旁生成總結的插件,非常適合追蹤最新技術演講的重點。最後,我探索了「Tome」,一個能夠自動擴充產生簡報內容的線上工具,儘管初期使用上有些挑戰,但它顯著提高了我的工作效率。
7 min read
AI 研究日誌 1
AI 工具

AI 研究日誌 1

在這篇文章中,我探索了三個有趣的工具,旨在提高網絡效率和創造力。首先是「ReaderGPT」,一款基於GPT-3的瀏覽器插件,儘管速度稍慢,但能有效整理各種語言的網頁重點。接著是「Bing Image Creator」,這是一款基於DALL-E模型的圖片生成工具,它免費且操作簡單,適合快速創建圖片。最後,我試用了「Clipdrop」,這個工具提供了多種圖像處理功能,包括去背景和調整光源,非常適合專業圖像處理需求。
2 min read
ReactDOMServer 搭配 Express 和 Esbuild 實作 Server Side Rendering (SSR)
寫程式

ReactDOMServer 搭配 Express 和 Esbuild 實作 Server Side Rendering (SSR)

在這篇文章中,我介紹了服務器端渲染(SSR)的基本概念及其與客戶端渲染(CSR)的比較。我詳細說明了SSR在提高頁面載入速度、改善SEO和用戶體驗方面的優勢。此外,我還探討了如何在Express環境中設置SSR,包括如何使用ReactDOMServer將React組件渲染成字符串,並將其嵌入HTML中返回給瀏覽器。
4 min read
部署 Express 專案到 AWS EC2,並設定 Nginx 跟取得 SSL 憑證
寫程式

部署 Express 專案到 AWS EC2,並設定 Nginx 跟取得 SSL 憑證

在這篇文章中,我詳細介紹了AWS的基礎知識,包括金鑰對、私鑰檔案格式、安全組的功能及其入站和出站規則的區別。我探討了RSA和ED25519金鑰類型的差異,解釋了.pem和.ppk私鑰檔案格式的不同,並說明了AWS安全組如何作為虛擬防火牆保護AWS資源。此外,我還講述了Amazon Machine Image和不同AWS實例類型的重要性,這些知識對於在AWS環境中有效管理和部署資源至關重要。
14 min read
Next.js 13 升級功能:Turbopack、 file-based routing,React Server Components
寫程式

Next.js 13 升級功能:Turbopack、 file-based routing,React Server Components

在這篇文章中,我詳細探討了 Next.js 13 的三個重大升級:使用 Turbopack 的打包工具、基於文件的路由系統以及無痛的 React Server Components。我解釋了 Turbopack 如何提供比先前工具更快的打包速度,以及新的路由系統如何允許更靈活的文件組織。此外,我還介紹了如何更輕鬆地在 Next.js 中使用 React Server Components,這大大簡化了開發過程並提高了效率。
5 min read
六個 React 常見可優化的用法的解題技巧
寫程式

六個 React 常見可優化的用法的解題技巧

在這篇文章中,我探討了六個常見的 React 優化技巧,幫助開發者避免常犯錯誤並提升應用性能。例如,當不需要即時取得輸入值時,使用 useRef 代替 useState 可以避免不必要的渲染;理解 setState 的異步特性和使用上一狀態的重要性;以及正確使用 useMemo 來避免因引用類型更新導致的額外渲染。這些技巧不僅提高了代碼的效率,也加深了對 React 內部工作機制的理解。
4 min read
快速在 mac 安裝 mongoDB
寫程式

快速在 mac 安裝 mongoDB

在這篇文章中,我分享了如何在 Mac OS 上安裝 MongoDB 的詳細步驟。首先,從 MongoDB 官方網站下載適合的版本並將其解壓至 /usr/local 目錄。接著,創建數據存放和日誌記錄的資料夾。此外,我還介紹了如何設定快速啟動的配置文件和環境變數,以便在任何地方使用終端機輕鬆啟動 MongoDB。最後,提供了必要的安全設置,確保從外部下載的檔案能夠在 Mac 上順利運行。這些步驟旨在幫助用戶快速且正確地在自己的 Mac 上配置 MongoDB 環境。
2 min read
[LeetCode 核心演算法] Sliding Window 是什麼?最精簡解題技巧與常見題目
寫程式

[LeetCode 核心演算法] Sliding Window 是什麼?最精簡解題技巧與常見題目

在這篇文章中,我介紹了滑動視窗(Sliding Window)這一常用於解決字串和陣列問題的演算法技巧。滑動視窗(Sliding Window)通過靈活調整子序列的起始和結束位置,以達到在線性時間內找到符合特定條件的最長或最短子序列的目的。此方法特別適合處理需要連續資料存取的情景,如數組、鏈表或字符串等。
2 min read
[LeetCode 核心演算法]Two Pointer: 低空間複雜度,最精簡解題技巧與常見題目
寫程式

[LeetCode 核心演算法]Two Pointer: 低空間複雜度,最精簡解題技巧與常見題目

在這篇文章中,我探討了 Two Pointer 技巧,這是一種用於處理陣列、字符串或連結列表等線性數據結構的算法。通過兩種類型的指針——左右指標和快慢指標,我們可以有效解決諸如合併排序、尋找和判斷回文等問題。這種方法不僅提高了效率,還減少了額外的空間使用,使空間複雜度降低至接近 O(1)。
2 min read
網頁在 Client-Server 架構下的設計的解題技巧
寫程式

網頁在 Client-Server 架構下的設計的解題技巧

在這篇文章中,我探討了網頁在 Client-Server 架構下的設計,著重於三種主要的服務器:Web Server、Application Server 和 Database Server。這些服務器如何交互運作,不僅支援靜態和動態內容的輸出,還處理來自前端的請求並進行數據存取。通过這些基本概念的介紹,希望能幫助大家更好地理解現代網頁應用的後端架構。
2 min read
ES6: 用 Promise 處理非同步問題的解題技巧
寫程式

ES6: 用 Promise 處理非同步問題的解題技巧

透過 Promise 處理非同步操作,可確保事件完成後再執行。我們會在 Promise 建構函式中使用 resolve 或 reject 來控制執行流程。當執行非同步事件時,Promise 會維持 pending 狀態,直到事件完成並呼叫 resolve 成為 fulfilled 或因錯誤而呼叫 reject 成為 rejected。使用 then、catch、finally 來處理 Promise 的結果,以確保非同步操作的正確性和時序。
5 min read
ES7: 用 Async/Await 處理非同步問題的解題技巧
寫程式

ES7: 用 Async/Await 處理非同步問題的解題技巧

在這篇文章中,我們探討了如何使用 ES7 的 async/await 來處理非同步問題。透過 async 聲明異步函式和 await 暫停異步函式的執行,可以使非同步操作以近似同步的方式進行,這不僅提升了程式的可讀性,也使錯誤處理變得更加直觀。此外,示例中展示了如何利用 try...catch 處理異步操作中可能出現的錯誤,保證異步邏輯的完整性和穩健性。通过学习 async/await,開發者可以更有效地管理和維護異步程序。
2 min read