WordPress 테마 개발에 iPad를 사용하는 방법

대학을 졸업 한 후, 나는 MacBook Air를 구입하기 전에 iPad Pro를 사용하여 수업에 참석해야했습니다 (M1 칩은 훌륭합니다). 그러나 컴퓨터 과학 학생으로서 나는 그것을 프로그램 할 수있는 방법을 찾아야했습니다. 그래서 나는 iPad에서 프로그램하는 가장 좋은 방법을 찾기 시작했습니다.

처음에는 몇 가지 좋은 옵션을 찾았지만 명령 줄이나 루트 권한 부족으로 인해 원하는 코드 나 프로그램을 실행할 수 없기 때문에 완벽하지 않았습니다. 코더, gitpod, github codespaces, 심지어 Replit과 같은 플랫폼을 사용할 수 있었지만 내가 원하는 것이 아닙니다.

그러나 나는 완벽한 프로그램을 찾았습니다. 무료이며 오픈 소스이며 자체적으로 호스팅 할 수 있습니다. 또한 검색 할 때 발견 한 플랫폼 인 코더의 기초이기도합니다. 이를 코드-서버라고하며 기본적으로 서버 파일 시스템에 완전히 액세스 할 수있는 관리되는 코드입니다.

처음에는 사용 사례가 Java 프로그래밍 (수업 시간에 배우는 언어)이지만 다른 프로그래밍 작업, 즉 WordPress 테마 개발에도 사용할 수 있다는 것을 빨리 깨달았습니다!

전제 조건

시작하려면 두 가지가 필요합니다.

• 루트 액세스가있는 Linux 서버. 나는 개인적으로 OVH VPS를 사용합니다. 라즈베리 파이도 괜찮지 만 단계는 더 복잡 하고이 기사의 범위를 벗어납니다.
• iPad 또는 일반적으로 프로그래밍에 사용할 수없는 기타 장치 (예 : 크롬 북).

WordPress 사이트와 동일한 서버에서 작업하고 있다고 가정하고 있습니다. 또한이 안내서는 Ubuntu 20.04.2 LTS를 사용하여 작성되었습니다.

설치하다

먼저 SSH를 통해 서버에 연결해야합니다. iPad를 사용하는 경우 Termius를 사용하는 것이 좋습니다. 서버에 로그인하면 루트/sudo 권한이 필요한 코드 서버를 설치합니다.

설치는 매우 간단합니다. 실제로 하나의 터미널 명령 만 필요합니다. 업그레이드 할 때도 동일한 명령이 사용됩니다.

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

구성

코드 서버를 설치 한 후 여러 가지 방법을 통해 구성 할 수 있습니다. 코드 서버를 직접 실행할 수 있으며 작동하지만 HTTP가 부족하고 기본 인증 만 제공합니다. 나는 항상 https를 활성화하기를 원했고 내 도메인에도 필요합니다.

HTTPS를 활성화하는 방법에는 여러 가지가 있습니다. 코드 서버 문서의 첫 번째 방법은 Nginx 또는 Caddy와 같은 Let 's Encrypt 및 Reverse Proxy를 사용합니다. 이것은 훌륭하게 작동하지만 더 많은 수동 구성이 필요하며 귀찮게하고 싶지 않습니다. 그러나 Code-Server는 베타 단계에 있지만 다른 옵션 인 --link 을 제공합니다. 이 플래그는 TLS 인증서, Github 인증 및 전용 CDR.CO URL을 설정합니다! 구성이 필요하지 않습니다! 너무 멋지다 설정하려면이 명령을 실행하려면 (이 명령은 Root/Sudo Access가 필요하지 않습니다.

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

이것은 우리가 당신의 GitHub 계정에 로그인하여 승인 할 계정을 알 수 있도록 URL을 만듭니다. 일단 완료되면, 우리는 전용 URL을 얻을 것이고 모든 것이 준비되었습니다! 각 사용자는 고유 한 구성 및 GitHub 계정을 가지고 있으므로 기술적으로 여러 사람의 여러 인스턴스를 동시에 실행할 수 있다고 생각합니다. 그러나 나는 그것을 테스트하지 않았습니다.

GitHub 계정을 구성한 후 CTRL C를 눌러 프로세스를 중지합니다.

<code>code-server --link</code> 로그인 URL을 제공합니다.

Termius에서 URL을 클릭하면 Safari에서 열립니다.

로그인 한 후 GitHub은 귀하의 계정을 승인합니다.

응용 프로그램이 승인되면 친숙한 인터페이스로 직접 이동해야합니다!

SSH 세션으로 돌아가서 영구 URL을 사용할 수 있음을 알 수 있습니다! 코드 서버가 실행 중일 때만 작동합니다.

WordPress 테마 종속성을 설정하십시오

WordPress 테마 개발을 수행하는 방법에는 여러 가지가 있지만 Automattic의 밑줄 (_S)이 실제로 마음에 들기 때문에 시작합니다.

_s를 시작하려면 작곡가를 설치합시다. 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>

이 명령은 업데이트 된 노드 PPA를 추가합니다. Ubuntu가 포함하는 하나가 오래 되었기 때문에 (노드 10!), 노드를 설치하고 버전을 가져옵니다.

마지막 명령은 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로 이동합시다!

대 코드 인스턴스에서 테마가 포함 된 폴더를 열고 _s의 QuickStart 단계를 따라 테마의 이름을 올바르게 이름을 지정할 수 있습니다. 그런 다음 통합 터미널에서 composer install 및 npm install 실행합니다. 테마에 필요한 모든 패키지를 설치합니다. 더 많은 경험이 많은 사람들이 그렇게했던 것처럼 WordPress 테마의 작동 방식을 설명하지 않을 것입니다.

그게 다야! 우리 서버에는 이제 iPad 또는 브라우저 및 키보드가있는 다른 장치를 사용하여 멋진 WordPress 테마를 개발하는 데 필요한 모든 것이 있습니다. 새 브라우저가 출시되면 Xbox를 사용할 수도 있습니다.

개발 과정

우리가 논의한 모든 것은 이론적으로 훌륭하게 들립니다. 궁금한 점은 실제로이 구성으로 iPad에서 개발하는 것이 실제로 어떤 것인지입니다. 나는 나에게 어떻게 보이는지 보여주기 위해 다음 비디오를 녹음했다. 몇 분 거리에 불과하지만 WordPress 개발에서 무슨 일이 일어나고 있는지에 대한 좋은 아이디어를 반영한다고 생각합니다.

이 설정에 대한 몇 가지 지침

Code-Server는 오픈 소스 대 코드 (Microsoft 버전이 아닌)를 사용하기 때문에 문제가 없습니다. 또한 Microsoft의 확장 시장을 사용하지 않으므로 모든 확장을 사용할 수있는 것은 아닙니다. 설정을 동기화하기 위해 Microsoft 또는 Github 계정에 로그인 할 수는 없지만 개인적으로 내선을 동기화하는 데 어려움이 있지만 설정 동기화 확장자를 사용할 수도 있습니다. 각 Linux 사용자는이 폴더에 저장된 자체 설정 및 확장 기능이 있습니다 : ~/.local/share/code-server . 일반 대 코드 설치의 폴더 구조와 유사합니다.

Code-Server를 SSH 세션에서 직접 실행하는 대신 서비스로 실행하여 항상 실행되도록 코드 서버를 서비스로 실행하는 방법도 있습니다. 그러나 필요한 경우 열기를 선호합니다.

몇 가지 iPad 관련 팁

나처럼 iPad를 사용할 계획이라면, 경험을 더 즐겁게 만들기위한 몇 가지 팁이 있습니다!

• Application이 백그라운드에서 실행중인 경우에도 SSH 연결을 활성화하기 때문에 Termius에서 위치 추적 기능을 활성화하십시오.
• Safari로 웹 사이트를 열고 공유 테이블을 열어 홈 화면에 추가하십시오! Long Live PWA!
• 사파리는 콘텐츠를 매우 적극적으로 캐시하며 캐시를 치우는 것은 매우 성가신 일입니다. 내가 찾은 유일한 방법은 기본적으로 브라우저의 역사를 지우는 것입니다. 다른 데스크탑 브라우저와 마찬가지로 "포스 리프로즈"가 없습니다. 그러나 크롬은 더 잘 처리 할 수 ​​있습니다.
• 블루투스 키보드를 구입하거나 보호 케이스 (Brydge는 좋은 선택입니다) 태블릿보다 랩톱처럼 느껴지 기 때문에. 물리적 키보드는 스크린 내 키보드보다 1,000 배 더 나은 경험을 제공합니다!
• iPad는 때때로 편집자의 초점을 "잃어 버리기", 특히 앱 사이를 전환 할 때 입력 할 수 없습니다. 나는 보통 사이드 바를 클릭 한 다음 편집기를 클릭 하여이 문제를 해결합니다.

위 내용은 WordPress 테마 개발에 iPad를 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!