如何將iPad用於WordPress主題開發

大學開學後，在入手MacBook Air（順便說一句，M1芯片真棒）之前，我不得不使用iPad Pro來上課。然而，作為一名計算機科學專業的學生，我必須找到一種方法來用它進行編程。因此，我開始尋找在iPad上編程的最佳方法。

起初我找到了一些不錯的選擇，但並不完美，因為由於缺乏命令行或root權限，我無法運行任何我想要的代碼或程序。我本可以使用Coder、Gitpod、GitHub Codespaces甚至Replit等平台，但它們並非我想要的。

但後來，我找到了完美的程序。它是免費的、開源的，並且可以自行託管。它也是Coder的基礎，Coder是我搜索時發現的一個平台。它被稱為code-server，基本上是一個託管的VS Code，可以完全訪問服務器的文件系統。

最初，我的用例是Java編程（這是我們在課堂上學習的語言），但我很快意識到，我也可以將其用於其他編程任務，即WordPress主題開發！

先決條件

你需要兩樣東西才能開始：

• 具有root訪問權限的Linux服務器。我個人使用的是OVH的VPS。樹莓派也可以，但步驟更複雜，不在本文討論範圍之內。
• 一台iPad或任何其他通常無法用於編程的設備（例如Chromebook）。

我假設你正在與你的WordPress網站相同的服務器上工作。另外，需要注意的是，本指南是使用Ubuntu 20.04.2 LTS編寫的。

安裝

首先，我們需要通過SSH連接到我們的服務器。如果你使用的是iPad，我建議使用Termius，因為它非常適合我們的需求。一旦我們登錄到服務器，我們將安裝code-server，這需要root/sudo權限。

安裝非常簡單；事實上，只需要一個終端命令。升級時也是相同的命令：

 <code>curl -fsSL https://code-server.dev/install.sh | sh</code>

配置

安裝code-server後，我們可以通過幾種方法進行配置。我們可以直接運行code-server，它就可以工作了——但它也會缺乏HTTPS，並且只提供基本的身份驗證。我一直希望啟用HTTPS，而且我的域名也需要它。

要啟用HTTPS，同樣也有幾種方法。 code-server文檔中的第一種方法使用Let's Encrypt和反向代理，例如NGINX或Caddy。雖然這效果很好，但需要更多的手動配置，我不想為此費心。但是，code-server還提供了另一個選項， --link ，它效果很好，儘管它處於測試階段。此標誌會設置TLS證書、GitHub身份驗證和專用cdr.co URL！無需任何方面的配置！太酷了‽ 要設置它，請運行此命令（此命令不需要root/sudo訪問權限，任何普通用戶都可以）：

 <code>code-server --link</code>

這會為我們創建一個URL，用於登錄到你的GitHub帳戶，以便它知道要授權哪個帳戶。完成後，我們將獲得一個專用的URL，一切就緒！每個用戶都有自己的配置和GitHub帳戶，所以我認為從技術上講，可以同時為多人運行多個實例。但是，我沒有測試過。

配置GitHub帳戶後，我們將按Ctrl C停止進程。

運行code-server --link會提供一個登錄URL。

在Termius中點擊URL可以在Safari中打開它。

登錄後，GitHub會授權你的帳戶。

授權應用程序後，它應該會直接把你帶到一個熟悉的界面！

回到我們的SSH會話，我們可以看到永久URL現在可用！請記住，只有在code-server運行時它才能工作。

設置WordPress主題依賴項

有很多方法可以進行WordPress主題開發，但我非常喜歡Automattic的underscores（_s）的方式，所以我們將以此為起點。

要開始使用_s，讓我們安裝Composer。因為我假設你與你的WordPress網站在同一服務器上，所以PHP已經安裝了。雖然我可以在此處列出步驟，但Composer的網站已經比我可能做得更好。

安裝Composer後，我們需要通過在終端中運行以下命令來安裝Node.js：

 <code>cd ~ curl -sL https://deb.nodesource.com/setup_16.x -o nodesource_setup.sh sudo bash nodesource_setup.sh sudo apt install nodejs node -v</code>

這些命令添加了更新的Node PPA——因為Ubuntu包含的那個已經過時了（Node 10！）——然後安裝Node，並獲取其版本。

最後一個命令應該返回類似v16.6.1的內容，這意味著我們已經準備好了！

設置主題

要設置_s npx degit automattic/_s my-cool-theme theme 。這會將_s代碼下載到名為my-cool-theme的文件夾中。如果你希望主題直接位於你的WordPress主題目錄中，你可以移動該文件夾，為其創建一個符號鏈接，或者在之前的命令中提供該文件夾的完整路徑。我個人更喜歡通過運行npm run bundle來壓縮我的文件，然後在我的主題文件夾中手動解壓縮它們。

完成所有這些後，讓我們運行code-server --link ，打開我們的瀏覽器並導航到我們的URL！

在我們的VS Code實例中，我們可以打開包含我們主題的文件夾，並按照_s的快速入門步驟，正確命名我們的主題。然後，在集成終端中，我們運行composer install和npm install 。這將安裝主題所需的所有軟件包。我不會解釋WordPress主題的工作方式，因為許多更有經驗的人已經這樣做了。

就這樣！我們的服務器現在擁有了我們使用iPad或任何其他具有瀏覽器和鍵盤的設備開發一些酷炫的WordPress主題所需的一切。一旦他們的新瀏覽器發布，我們甚至可以使用Xbox。

開發過程

我們討論的所有內容在理論上聽起來都很棒，對吧？你可能想知道的是，使用這種配置在iPad上進行開發實際上是什麼樣的。我錄製了以下視頻來展示對我來說是什麼樣的。它只有幾分鐘長，但我認為它很好地反映了WordPress開發中出現的問題。

關於此設置的一些說明

由於code-server使用的是開源VS Code——而不是Microsoft的版本——因此缺少一些功能。它也沒有使用Microsoft的擴展市場，這意味著並非所有擴展都可用。我們無法登錄到我們的Microsoft或GitHub帳戶來同步我們的設置，但我們也可以使用Settings Sync擴展，儘管我個人在使用它來同步我的擴展時遇到了麻煩。每個Linux用戶都有自己的設置和擴展，保存在此文件夾中： ~/.local/share/code-server 。它與常規VS Code安裝的文件夾結構類似。

還有一些方法可以將code-server作為服務運行，而不是直接在SSH會話中運行，以便它始終運行，但我更喜歡在需要時打開它。

一些iPad專用提示

如果你計劃像我一樣使用iPad，以下是一些技巧，可以使你的體驗更愉快！

• 在Termius中激活位置跟踪功能，因為它即使在應用程序在後台運行時也能保持SSH連接處於活動狀態。
• 使用Safari打開網站，然後打開共享表將其添加到你的主屏幕！ PWA萬歲！
• Safari非常積極地緩存內容，清除緩存非常煩人。我找到的唯一方法基本上是清除瀏覽器的歷史記錄，這並不理想。它不像其他任何桌面瀏覽器那樣有“強制刷新”。不過Chrome可能會更好地處理它。
• 購買一個藍牙鍵盤，甚至是一個保護套（Brydge是一個不錯的選擇），因為它讓它感覺更像一台筆記本電腦而不是平板電腦。物理鍵盤比屏幕鍵盤讓體驗好上1000倍！
• iPad有時會“失去”編輯器的焦點，尤其是在應用程序之間切換時，這使得無法鍵入。我通常通過點擊側邊欄，然後點擊編輯器來解決這個問題。

以上是如何將iPad用於WordPress主題開發的詳細內容。更多資訊請關注PHP中文網其他相關文章！