首页 >web前端 >css教程 >如何将iPad用于WordPress主题开发

如何将iPad用于WordPress主题开发

尊渡假赌尊渡假赌尊渡假赌
尊渡假赌尊渡假赌尊渡假赌原创
2025-03-17 09:34:12616浏览

How to Use an iPad for WordPress Theme Development

大学开学后,在入手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>code-server --link</code>会提供一个登录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。这会将_s代码下载到名为my-cool-theme的文件夹中。如果你希望主题直接位于你的WordPress主题目录中,你可以移动该文件夹,为其创建一个符号链接,或者在之前的命令中提供该文件夹的完整路径。我个人更喜欢通过运行npm run bundle来压缩我的文件,然后在我的主题文件夹中手动解压缩它们。

完成所有这些后,让我们运行<code>code-server --link</code>,打开我们的浏览器并导航到我们的URL!

在我们的VS Code实例中,我们可以打开包含我们主题的文件夹,并按照_s的快速入门步骤,正确命名我们的主题。然后,在集成终端中,我们运行composer installnpm 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中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn