DOM 代表文檔物件模型，它是 HTML 文檔的節點和物件表示法。瀏覽器提供了一個 API，你可以使用它來與 DOM 進行交互。這就是現代 JavaScript 框架的工作方式 - 它們使用 DOM API 告訴瀏覽器在頁面上顯示什麼。 窗口物件 屬性 方法 文檔物件 節點類型 遍歷 DOM 獲取父節點 獲取子節點 獲取兄弟節點 編輯 DOM DOM 是瀏覽器對網頁的內部表示。當瀏覽器從服務器獲取 HTML 時，解析器會分析代碼的結構並創建其模型。基於這個模型，瀏覽器在屏幕上呈現頁面。 瀏覽器提供了一個 API，你可以使用它來與 DOM 進行交互。這就是現代 JavaScript 框架的工作方式 - 它們使用 DOM API 告訴瀏覽器在頁面上顯示什麼。 在單頁應用中，DOM 不斷變化以反映屏幕上的內容，作為開發人員，你可以使用瀏覽器開發者工具來檢查它。 DOM 是無語言限制的，並且訪問 DOM 的事實上的標準方式是使用JavaScript，因為它是瀏覽器唯一能運行的語言。 DOM 由 WHATWG 在 DOM 鏈接規範中進行了標準化。 使用 JavaScript，你可以與 DOM 進行交互的操作包括： 檢查頁面結構 訪問頁面的元數據和標題 編輯 CSS 样式 附加或刪除事件監聽器 編輯頁面中的任何節點 更改任何節點的屬性 .. 還有更多。 DOM API 提供的兩個主要物件是 document 和 window。...

什麼是方法？什麼是函數？它們之間有什麼區別？ 一個函數是獨立存在的： const bark = () => { console.log('wof!') } bark() 或者： function bark() { console.log('wof!') } bark() 而方法是指分配給對象屬性的函數： const dog = { bark: () => { console.log('wof!') }, } dog.bark() 方法可以訪問對象的屬性，但只有在它是一個常規函數而不是箭頭函數時才可以： const dog = { name: 'Roger', bark: function () { console.log(`我叫${this.name}。wof!`) }, } dog.bark()

動畫是一個迷人的主題。無論您想要添加互動動畫，如過渡效果，還是構建整個全屏體驗，您都擁有所有所需的工具。 動畫是一個迷人的主題。無論您想要添加互動動畫，如過渡效果，還是構建整個全屏體驗，您都擁有所有所需的工具。 而且，您有很多不同且具有不同目的的選擇。 CSS 通常被認為更加高效，儘管 JavaScript 也可以非常高效。一切取決於您需要做什麼，以及每幀渲染所需的時間。 CSS 過渡效果 CSS 動畫 SVG 動畫 Canvas API 動畫 Web Animations API WebGL 讓我們總結這些選項，找出哪一種是合適的選擇。 CSS 過渡效果 CSS 過渡效果 有一個起點和終點。它們將一點從 X 移動到 Y，或從可見變為不可見。 它是最簡單的動畫，主要用於與頁面其餘部分無縫集成的微妙動畫。 通過過渡效果，您可以從一個狀態轉換到另一個狀態，但您無法做更多。 CSS 動畫 與 CSS 過渡效果相比，CSS 動畫 允許您具有不止 2 個狀態，事實上，您可以擁有很多狀態，並且可以用於創建更複雜的動畫。 當您需要相對簡單且無法使用過渡效果實現的動畫時，建議使用 CSS 動畫。 SVG 動畫 SVG 是一種出色的基於矢量的格式，可以使用 SMIL（SVG 動畫的"本地"格式）創建動畫。 由於存在跨瀏覽器的不一致性（並且 IE/Edge 不支援），SMIL 快將在 Chrome 中廢棄，但是團隊已暫時撤銷了此決定。 他們希望推動 CSS 動畫和 Web Animations API 來代替 SMIL。 Canvas API 動畫 Canvas API 提供了一種在屏幕上繪製的方法，使用的是點陣而不是向量。 儘管動畫是可能的，但不如其他選項高效。...

每天我接觸到數百個偉大的主意。 Twitter. Hacker News. Reeder. Podcasts. YouTube. 我有一個精心選擇的收件箱，每天我都在與我所見過的最傑出的思想進行互動，大多數是被動的。 這就像一條河流。一個永無止境的流動。一個好思想和討論的潮汐。 這就是我成長的方式。這種持續接觸偉大思想的方式不可能污染我，反而幫助我前進。 每隔一段時間，我讀到的東西、聽到的東西或觀看的東西會找到一塊肥沃的領域，與我已經有的想法相遇並融合在一起。 這樣混合創造出一些新的東西。一個全新的主意。 當主意碰到時，一些了不起的事情發生了。我進入一種純粹的愉悅的心態。大腦形成新的聯繫，更多的主意出現，我無法繼續做我原來的工作。 我必須全力以赴。 當這種情況發生時，我百分之百地投入到其中，這個主意讓我進入新的地方，有了新的主意。 這種「高潮」可以持續幾秒鐘、幾分鐘、幾小時、幾天。 這個主意看起來像是你曾經想過的最好的東西。為什麼沒有人想到這個？這將是我餘生所做的事情。 當熱情消退後，你會看到廢墟。 這個主意再也不會以同樣的方式呈現。你會看到錯誤的假設、問題和缺陷。 善加利用這個高潮。那才是真正的創造力在行動。那是你的時刻。

本教程是Laravel手冊的一部分。從此處下載 。 現在，讓我們重新實現第一個項目，這次當未登錄時顯示狗的列表，但只允許已登錄的使用者修改數據。 首先，我們創建一個新的遷移： php artisan make:migration create_dogs_table 打開新創建的遷移文件，在我這裡是 database/migrations/2023_05_12_164831_create_dogs_table.php <?php use Illuminate\Database\Migrations\Migration; use Illuminate\Database\Schema\Blueprint; use Illuminate\Support\Facades\Schema; return new class extends Migration { /** * Run the migrations. */ public function up(): void { Schema::create('dogs', function (Blueprint $table) { $table->id(); $table->timestamps(); }); } /** * Reverse the migrations. */ public function down(): void { Schema::dropIfExists('dogs'); } }; 我們只需稍微修改遷移，添加了狗的名稱： Schema::create('dogs', function (Blueprint $table) { $table->id(); $table->string('name'); $table->timestamps(); }); 保存文件，返回終端，運行 php artisan migrate...

包含所有可打印ASCII字符的表格。 DEC HEX 字符 32 0x20 <空格> 33 0x21 ! 34 0x22 ” 35 0x23 # 36 0x24 $ 37 0x25 % 38 0x26 & 39 0x27 ’ 40 0x28 ( 41 0x29 ) 42 0x2A * 43 0x2B + 44 0x2C , 45 0x2D - 46 0x2E . 47 0x2F / 48 0x30 0 49 0x31 1 50 0x32 2 51 0x33 3 52 0x34 4 53 0x35 5 54 0x36 6 55 0x37 7 56 0x38 8 57 0x39 9 58 0x3A : 59 0x3B ; 60 0x3C < 61 0x3D = 62 0x3E > 63 0x3F ?...

什麼是平台，為什麼擁有自己的平台很重要 現今，一個獨立的創作者必須是一位行銷者，也必須知道如何製作產品並將其帶到市場。這種結合了罕見的技能組合同時是強大和爆炸性的。 除此之外，還有產品的部分，根據不同的類別，創業者還需要具備編程、寫作或與眾不同的獨特技能。 此外，還需要詳細了解如何建立網站、如何建立Facebook專頁、如何使用Twitter、如何建立電子郵件序列、如何設置廣告活動的詳細信息，以及通常我們可以歸類為“網站管理員”的所有工作。 對於一位企業家來說，不一定非要了解所有這些，但如果在傳統公司裡，有不同的人專門負責我列出的每一項任務，同時也是對的。然而，這與本文無關。本文關注的是創建一個只有你這個人的企業。 對於任何任務，您可以選擇雇用外部專家承包商來完成工作，而不是自己做。 然而，這會產生以下幾點思考： 這是一種分心，因為您必須以您負擔得起的價格尋找到有著正確技能的可信任的人 您必須為他們的工作支付酬勞 這將是一條沒有盡頭的隧道。技術問題永遠不會結束，而且您可能要長時間依賴於一個外部人員，而您並不了解他所做的工作，因為您最初委派太多事情而且並不真正知道事情的運作方式 考慮一下，如果您將某項技術事務委託給其他人，但突然間您的參考人不再可用，會發生什麼情況 許多這些工作應該是您核心業務的一部分，只有您能夠百分之百地管理 總之，如果您不知道如何做某樣事情，但又必須完成它，您就必須支付其他人的費用來完成。 在本文的接下來幾章中，您將獲得所有所需知識的概述，並從那裡開始進一步瞭解細節。 我出生在舊時代的程序員，隨著時間的推移，我不得不因需求而學習市場營銷知識。如果您有更多的軟性技能而非技術技能，您可以做相反的事情。您並不需要成為一位頂尖專家，因為有很多可用的工具可以製作完美的網站和擺脫編碼的落地頁面。 但請注意：您必須明白，您現在不瞭解的一切 - 這對您的業務成功至關重要 - 必須完美地學習，以避免使您的產品和品牌被感知為不受管理、業余或不吸引人。 不管您做什麼決定，您都無法撤銷某些非常模糊的東西。如果您理解這個主題，您將完全知道自己需要什麼，以及什麼是多餘的或根本不需要的。 您自己的平台 您的平台可以有不同的外觀，可能與其他人使用的平台相似，或者可能是以前從未見過的獨特的東西。沒有一個規則說明平台必須使用特定類型的軟件。它可以是一個博客、一個靜態網站，或者一個論壇。 重要的是您的平台需要滿足一些關鍵特點： 您必須對其擁有完全的自由 您必須能夠隨時與您的用戶聯繫 您必須能夠隨時提取此平台的所有數據 您不必受制於他人的決策 在過去的20年裡，許多事情發生了變化，但還有一些不變的常數，我們可以假定這些常數將在很長一段時間內保持不變。 我特別想著重兩件事情：您的網站和您的電子郵件列表。 您的網站 您的網站是您的運營中心。是您的平台，是您的總部。一切都應該導向您的網站。您的Facebook專頁、YouTube頻道、Twitter、您在其他博客上的客座文章以及您直播的內容都是宣傳您網站內容的工具。 您可以使用任何技術創建網站，這並不重要，但需要滿足以下條件： 它是在您所擁有的域名上 您可以按需更改每個細節 我不推薦在其他人的平台上創建您的網站，例如WordPress.com（WordPress的"hosted"版本）、Blogspot、Squarespace、Tumblr、Medium。 我告訴你們要避免使用其他人提供的托管和管理服務，是因為這些平台在將來會限制您，就像我之前在其他平台上所描述的那樣，您將受到其他人的決策和變化所束縛。 例如，如果您某一天決定在網站上添加一個電子商務模塊，在大多數列出的服務中，您將無法實現這一點，您將需要在另一個平台（如Shopify）上託管您的電子商務。 那麼，我應該在哪裡建立我的網站？ 如果您是一位技術型用戶，您已經有自己的喜好，但如果您處於早期階段，直接使用WordPress.org，這與商業對應版本WordPress.com相比，提供了更多自由，但需要更多的技術知識才能使用。這是最常見的選擇，而且您總是可以找到將幫助您使用它的人，無論您需要什麼，都將有插件可供安裝。在圖形方面，無論是哪種類型的網站，都存在幾乎無窮的選擇。 根據情況，網站的內容和組織會有很大的不同。在本文中，我無法深入討論細節，所以我將以一般性的術語談論。 在您的網站上，您將有各種類型的內容。可能是一個博客，所以一系列的文章。您也可以有一個簡單的個人介紹頁面，或者是您售賣的產品的描述，甚至是一個電子商務模塊。 訪客可以通過搜索引擎、AdWords或Facebook廣告活動，或者來自您在其他基礎上放置的平台（如YouTube和Pinterest）來到訪。我喜歡把網站想像成主要的堡壘，而您使用的每個單獨平台都是戰略位置。例如，您將擁有Facebook、Twitter和AdWords這樣的位置，它們的任務是吸引人們到您的網站，每個位置都有其自身的特點。 在您的網站上，人們將了解您、您的業務和您的產品，將他們推到加入您的電子郵件列表的關鍵。 您的電子郵件列表 如果您尚不熟悉電子郵件列表的概念，您可能會想知道為什麼在Facebook、Instagram、Snapchat和Twitter時代，您仍然需要使用像電子郵件這樣的舊式系統。 實際上，電子郵件是任何線上業務的重要工具。 給客戶發送電子郵件並不是一種發送垃圾郵件的系統，正如您可能會想的那樣，而是一個讓對您的內容或產品感興趣的人獲得更多信息的系統，或者關於您將來可能提供的新產品的信息。 電子郵件營銷是迄今為止最有效的系統之一，通過這種系統，人們會在一段時間內從訪客變成客戶。但這並不僅僅如此：您列表上的人明確要求在將來從您那裡接收更多信息。 這並不意味著在8個月後發送一封電子郵件要求他們購買您的新產品，更重要的是，您應該思考如何幫助您的客戶。 透過建立列表，您可以培養忠誠的顧客，建立關係，保持聯繫。您的列表的任務是訓練人們了解您正在談論的主題，給他們提供有關即將到來的消息的預告，但請儘量將焦點放在客戶身上，而不是你自己，因為一個人不會永遠存在於您的列表中，只有在您能夠保持他們的興趣的這段時間。 如何讓人們首先加入列表？通過一個小禮物，被稱為“引導磁石”，這可以是一份報告、一本免費電子書、獨家訪問高級內容、郵件課程，或者其他您可以作為文件發送的禮物。 這個概念很簡單，但是這個機制的齒輪必須得到完美的校準和定期潤滑，不能有任何偶然性，否則您的客戶眼中將視您為業余。 很重要的是，您要給人們他們想要的。 對於大多數在線業務擁有者來說，電子郵件列表被認為是業務中最重要的資產，也是真正屬於您100％的唯一一個。 列表的典型使用方式 讓我們舉個例子。這是大多數成功博客使用的系統：通過搜索引擎或Facebook進入他們的網站，彈出一個（不同程度的）彈窗要求您輸入您的電子郵件以獲得一份小禮物，您將通過電子郵件收到禮物，進而進入這個週期，您將通過一系列電子郵件提供各種產品。 通常，進入列表後會進入一個被稱為“銷售漏斗”的階段。銷售漏斗是一個自動化的加熱過程，通過這個過程將您從隨機訪客轉變為可能的客戶。 一旦您註冊，您將收到一封電子郵件，第二天您將收到另一封，三天之後將收到另一封，根據預定邏輯。通常這些郵件系列在7-8封郵件之後結束，並在結尾提供一個產品供購買。如果您不立即購買，電子郵件將繼續流動，直到自動序列結束。 有許多不同的序列類型，通常人們並不創造任何內容，而是使用經過良好測試的系統（一旦您接受培訓，您將輕易地識別出這些系統）。 一旦此序列結束，您的郵件將被放入另一個序列或一般列表中，該列表不再自動化，而是背後的人會不時向您發送更新的電子郵件，例如每個月一次，以確保您不會忘記他們。 簡而言之，列表的作者試圖銷售產品，但是如果您不購買，您將仍然保留在列表中，直到取消訂閱，因為在未來您可能會決定購買並成為客戶。 如果您購買了推薦的產品會發生什麼？這取決於列表是如何設定的，但通常情況下，您將進入第二個銷售漏斗，然後提供另一個更昂貴的產品，如此類推。 我以較輕鬆的方式使用列表：我有電子書作為引導磁石，如果您同意加入我的每週電子郵件列表，我會提供它給您，然後我通常會在幾天後問您喜不喜歡它。如果我有一個像收費課程一樣的額外產品，我會提及它。 否則，您將被添加到我的每週網路電子報中，其中包含我在過去7天內寫的所有博客文章的集合。 您如何使用電子郵件列表 當然，列表可以有多種用途。讓我們看看您在自己的情況下可以應用的一些情境。 如果您銷售電子書 因此，您的用戶就是您的讀者。您可以在站點上放置一個鏈接，作為引導磁石，您使用的免費電子書可能是您知道該用戶感興趣的主題。在列表中，您最初可以對已經編寫好的其他電子書提供升級，然後將人們放入您的每月、每兩週或每週郵件中，在其中發佈有關主題的有趣鏈接，並不時推廣您的新電子書。 如果您銷售產品 對於信息產品，與博客上常見的典型示例一樣，您可以使用如上所述的方法。也許作為引導磁石，您可以使用一個或多個章節，或者您可以擁有一個與主題相關的視頻或其他內容。...

GUI 程式設計既令人興奮又有趣！ Python 的標準庫中附帶的 tkinter 模組是一個 GUI 工具包，可用於在我們的程式中創建跨不同操作系統的圖形使用者界面。 雖然有第三方庫可以讓你創建 GUI 介面，但 tkinter 是與 Python 整合在一起的工具包，因此這是我們要解釋的內容。 讓我們從一個簡單的應用程式開始，它會顯示一個標籤： import tkinter as tk root = tk.Tk() label = tk.Label(root, text="Hello, World!", padx=10, pady=10) label.pack() root.mainloop() 從終端機運行此程式。 你很快就會看到一個視窗出現。在 macOS 上的外觀如下所示： 明確關閉視窗，您將看到終端機程式結束。視窗的外觀將根據您的操作系統而有所不同。 你可以調整視窗的大小、隱藏它，甚至使它全屏顯示。 在視窗打開的同時，從終端機啟動的 Python 程序仍然活動中。按下紅色的（x）按鈕關閉視窗，您將看到終端機程序退出。 與大多數 CLI（命令行界面）應用程序不同，GUI 應用程序始終等待用戶事件，例如鼠標或鍵盤事件，並只在明確關閉時退出。 現在你已經看到了魔法的發生，我們來談談程式。這僅僅是 5 行程式碼，卻為我們打開了 GUI 的世界。 import tkinter as tk root = tk.Tk() label = tk.Label(root, text="Hello, World!", padx=10, pady=10) label.pack() root.mainloop() 我們導入 tkinter 模組，並將其縮寫為 tk 以便使用。...

學習最受歡迎的 JavaScript Linter 基礎知識，它可以協助你的程式碼遵守特定的語法規範，檢查程式碼中是否存在潛在問題的來源，以及程式碼是否符合你或你的團隊所定義的一套標準。 什麼是 Linter？ ESLint 全域安裝 ESLint 本地安裝 ESLint 在你喜愛的編輯器中使用 ESLint 常見的 ESLint 設定 Airbnb 程式碼風格指南 React 使用特定版本的 ECMAScript 強制使用嚴格模式 更進階的規則 在特定行上禁用規則 ESLint 是一個 JavaScript Linter。 什麼是 Linter？ 好問題！Linter 是一種用於檢查程式碼中問題的工具。 運行 Linter 可以告訴你許多事情： 程式碼是否遵從特定的語法規範 程式碼是否包含可能的問題來源 程式碼是否符合你或你的團隊所定義的一套標準 它會提出警告，你或你的工具可以分析這些警告並提供可行的數據，以改進程式碼。 ESLint ESLint 是用於 JavaScript 程式語言的 Linter，使用 Node.js 撰寫。 它非常有用，因為 JavaScript 是一種解釋語言，並且許多錯誤只有在運行時才能發現。 ESLint 將幫助你捕捉這些錯誤。你問的是哪些錯誤呢？ 避免在 for 迴圈條件中出現無窮迴圈 確保所有 getter 方法返回某些值 不允許使用 console.log（或類似）語句 檢查 switch 中的重複 case 檢查無法訪問的程式碼 檢查 JSDoc 的有效性 還有更多！完整列表請參閱 https://eslint.org/docs/rules/...

以 JavaScript 編程語言介紹函數式編程的主要概念。 函數式編程介紹 一級函數 可以分配給變量 可以用作其他函數的參數 可以由函數返回 高階函數 聲明性編程 聲明性 vs 命令性 不變性 const Object.assign() concat() filter() 純度 數據轉換 Array.map() Array.reduce() 遞歸 組合 在純 JS 中進行組合 使用 lodash 進行組合 函數式編程介紹 函數式編程（FP）是一種具有特定技術的編程範例。 在編程語言中，你會找到純函數式編程語言以及支持函數式編程技術的編程語言。 Haskell、Clojure 和 Scala 是一些最受歡迎的純函數式編程語言。 支持函數式編程技術的流行編程語言包括 JavaScript、Python、Ruby 等等。 函數式編程並不是一個新概念，實際上它的根源可以追溯到 1930 年代的 Lambda 演算，並影響了許多編程語言。 近年來，函數式編程一直在不斷發展，所以現在是學習它的完美時機。 在本課程中，我將使用 JavaScript 代碼示例介紹函數式編程的主要概念。 一級函數 在函數式編程語言中，函數是一級公民。 可以分配給變量 const f = (m) => console.log(m) f('Test') 由於函數可以分配給變量，它們可以添加到對象中： const obj = { f(m) { console.log(m) } } obj.f('Test') 也可以添加到數組中：...