PhpStorm+Docker+Win10(Pro)でのNextcloudアドオン開発のはじめかた
はじめに
-
Nextcloud Meetup Tokyo #01が開催されるとのことで、記念にNextcloudアドオン開発の始め方を公開します。
- 現時点で席の空きがあるようなので、お時間のある人は是非いらしてください (ビアバッシュあるみたい)
- 環境は、PhpStorm + Docker + Win10 です。
- 因みに、Win10に
Docker for Windows
をインストールするということは、Hyper-Vになるので、すなわちVirtualBoxは使えなくなります。この件は、社内でも議論になっていて、既存の環境を捨ててローカルの開発環境をオールDockerで行くという強い意気込みが必要かもしれません。
- ownCloudじゃなくて、Nextcloudって?という方は、こちらを。
概要
-
以下の構成で、apps配下にカスタムアプリを配置するといったNextcloudアドオン開発始めるまでの手順です。
/nextcloud-docker-develop
├─docker-nextcloud <-- docker-composeベースディレクトリ
│ ├─apps <-- カスタマイズアプリ配置ディレクトリ
│ ├─conf <-- カスタムconfファイル配置ディレクトリ
│ └─docker-compose.yml
├─server-src <-- nextcloudのcoreソース
├─.gitignore
├─.gitmodules
└─README.md
事前準備
-
こちらを参考に Windows10にDocker for Windows
を入れます。
- 以下は、今回利用したバージョンです。
PS C:\> docker --version
Docker version 18.03.1-ce, build 9ee9f40
-
PHPで開発するので、PHPStorm必須です。入れます。
- 以下は、今回利用したバージョンです。
Version: 2018.1.2
Build: 181.4668.78
環境構築
Dockerの設定
- Dockerの設定画面は、タスクトレイのDockerアイコンを右クリック -> Settings から表示できます。
PhpStormからのDockerコマンドは、 tcp://localhost:2375
でリッスンするため、以下の Expose daemon on tcp://localhost:2375 without TLS
を On にします。
PhpStormのワークスペース(ソースの配置場所)のドライブに対して共有設定を行います。私の場合は、EドライブにワークスペースがあるのでEドライブにチェックを入れました。
PhpStormの設定
-
PowerShellにて本記事用に用意したgitリポジトリからソース群をCloneします。submoduleで構成されているので --recursive
を付与してください。
> cd E:
> git clone --recursive [email protected]:ukitiyan/nextcloud-docker-develop.git
> cd nextcloud-docker-develop
-
以下のようなディレクトリ構成でCloneされていることを確認してください。
/nextcloud-docker-develop
├─docker-nextcloud <-- docker-composeベースディレクトリ
│ ├─apps <-- カスタマイズアプリ配置ディレクトリ
│ ├─conf <-- カスタムconfファイル配置ディレクトリ
│ └─docker-compose.yml
├─server-src <-- nextcloudのcoreソース
├─.gitignore
├─.gitmodules
└─README.md
-
上記 nextcloud-docker-develop
をワークスペースとして、PhpStormを起動します。
- 本記事では、
E:¥nextcloud-docker-develop
をワークスペースとしています。
ツールバーの File
-> Settings
-> Build, Execution, Deployment
-> Docker
から、APIが疎通(Connection succeefull)していることを確認してください。確認したら OK
クリックで抜けてください。
ツールバーの Run
-> Edit Configurations..
からダイアログを表示し +
-> Docker
-> Docker-compose
を選択してください。
-
表示された画面に以下を入力し、 OK
クリックで抜けてください。
- Name: Nextcloud
- Compose file(s): .\docker-nextcloud\docker-compose.yml;
ツールバーに Nextcloud
のRunボタンが表示されるので、クリックします。( ツールバーの Run
-> Run 'Nextcloud'
でもOKです )
コンソールに 'Compose: docker-nextcloud/docker-compose.yml' has been deployed successfully.
と表示されたらブラウザで http://localhost:8080 にアクセスし、以下のトップ画面が表示されるか確認してください。
Nextcloudの初期設定
-
引き続き、Nextcloudの初期設定を行います。事前に docker-compose.yml を確認しておきましょう。
docker-compose.yml
version: '2'
volumes:
nextcloud:
db:
services:
db:
image: mariadb
restart: always
volumes:
- db:/var/lib/mysql
environment:
- MYSQL_ROOT_PASSWORD=nextcloud
- MYSQL_PASSWORD=nextcloud
- MYSQL_DATABASE=nextcloud
- MYSQL_USER=nextcloud
command: mysqld --character-set-server=utf8 --collation-server=utf8_unicode_ci
app:
image: nextcloud:fpm
links:
- db
volumes:
- nextcloud:/var/www/html
- ./apps:/var/www/html/custom_apps:rw
restart: always
web:
image: nginx
ports:
- 8080:80
links:
- app
volumes:
- ./conf/nginx.conf:/etc/nginx/nginx.conf:ro
volumes_from:
- app
restart: always
- db, app, webの3コンテナで起動していることが分かります。
-
MYSQL_XXX
にDBの設定情報が記載されていることが分かります。
- appサービスの volumesにて
apps
がマウントされていることが分かります。
-
さて、ブラウザに戻り以下の通り設定し セットアップを完了します
ボタンをクリックしてください。
- ユーザー名: admin (任意)
- パスワード: ********* (任意)
- データフォルダ: /var/www/html/data
- データベースを選択してください: MySQL/MariaDB
- データベースのユーザー名: nextcloud (docker-compose.yml参照)
- データベースのパスワード: nextcloud (docker-compose.yml参照)
- データベース名: nextcloud (docker-compose.yml参照)
- データベースのホスト名: db
カスタムアプリ追加
- 現時点で席の空きがあるようなので、お時間のある人は是非いらしてください (ビアバッシュあるみたい)
Docker for Windows
をインストールするということは、Hyper-Vになるので、すなわちVirtualBoxは使えなくなります。この件は、社内でも議論になっていて、既存の環境を捨ててローカルの開発環境をオールDockerで行くという強い意気込みが必要かもしれません。-
以下の構成で、apps配下にカスタムアプリを配置するといったNextcloudアドオン開発始めるまでの手順です。
/nextcloud-docker-develop ├─docker-nextcloud <-- docker-composeベースディレクトリ │ ├─apps <-- カスタマイズアプリ配置ディレクトリ │ ├─conf <-- カスタムconfファイル配置ディレクトリ │ └─docker-compose.yml ├─server-src <-- nextcloudのcoreソース ├─.gitignore ├─.gitmodules └─README.md
事前準備
-
こちらを参考に Windows10にDocker for Windows
を入れます。
- 以下は、今回利用したバージョンです。
PS C:\> docker --version
Docker version 18.03.1-ce, build 9ee9f40
-
PHPで開発するので、PHPStorm必須です。入れます。
- 以下は、今回利用したバージョンです。
Version: 2018.1.2
Build: 181.4668.78
環境構築
Dockerの設定
- Dockerの設定画面は、タスクトレイのDockerアイコンを右クリック -> Settings から表示できます。
PhpStormからのDockerコマンドは、 tcp://localhost:2375
でリッスンするため、以下の Expose daemon on tcp://localhost:2375 without TLS
を On にします。
PhpStormのワークスペース(ソースの配置場所)のドライブに対して共有設定を行います。私の場合は、EドライブにワークスペースがあるのでEドライブにチェックを入れました。
PhpStormの設定
-
PowerShellにて本記事用に用意したgitリポジトリからソース群をCloneします。submoduleで構成されているので --recursive
を付与してください。
> cd E:
> git clone --recursive [email protected]:ukitiyan/nextcloud-docker-develop.git
> cd nextcloud-docker-develop
-
以下のようなディレクトリ構成でCloneされていることを確認してください。
/nextcloud-docker-develop
├─docker-nextcloud <-- docker-composeベースディレクトリ
│ ├─apps <-- カスタマイズアプリ配置ディレクトリ
│ ├─conf <-- カスタムconfファイル配置ディレクトリ
│ └─docker-compose.yml
├─server-src <-- nextcloudのcoreソース
├─.gitignore
├─.gitmodules
└─README.md
-
上記 nextcloud-docker-develop
をワークスペースとして、PhpStormを起動します。
- 本記事では、
E:¥nextcloud-docker-develop
をワークスペースとしています。
ツールバーの File
-> Settings
-> Build, Execution, Deployment
-> Docker
から、APIが疎通(Connection succeefull)していることを確認してください。確認したら OK
クリックで抜けてください。
ツールバーの Run
-> Edit Configurations..
からダイアログを表示し +
-> Docker
-> Docker-compose
を選択してください。
-
表示された画面に以下を入力し、 OK
クリックで抜けてください。
- Name: Nextcloud
- Compose file(s): .\docker-nextcloud\docker-compose.yml;
ツールバーに Nextcloud
のRunボタンが表示されるので、クリックします。( ツールバーの Run
-> Run 'Nextcloud'
でもOKです )
コンソールに 'Compose: docker-nextcloud/docker-compose.yml' has been deployed successfully.
と表示されたらブラウザで http://localhost:8080 にアクセスし、以下のトップ画面が表示されるか確認してください。
Nextcloudの初期設定
-
引き続き、Nextcloudの初期設定を行います。事前に docker-compose.yml を確認しておきましょう。
docker-compose.yml
version: '2'
volumes:
nextcloud:
db:
services:
db:
image: mariadb
restart: always
volumes:
- db:/var/lib/mysql
environment:
- MYSQL_ROOT_PASSWORD=nextcloud
- MYSQL_PASSWORD=nextcloud
- MYSQL_DATABASE=nextcloud
- MYSQL_USER=nextcloud
command: mysqld --character-set-server=utf8 --collation-server=utf8_unicode_ci
app:
image: nextcloud:fpm
links:
- db
volumes:
- nextcloud:/var/www/html
- ./apps:/var/www/html/custom_apps:rw
restart: always
web:
image: nginx
ports:
- 8080:80
links:
- app
volumes:
- ./conf/nginx.conf:/etc/nginx/nginx.conf:ro
volumes_from:
- app
restart: always
- db, app, webの3コンテナで起動していることが分かります。
-
MYSQL_XXX
にDBの設定情報が記載されていることが分かります。
- appサービスの volumesにて
apps
がマウントされていることが分かります。
-
さて、ブラウザに戻り以下の通り設定し セットアップを完了します
ボタンをクリックしてください。
- ユーザー名: admin (任意)
- パスワード: ********* (任意)
- データフォルダ: /var/www/html/data
- データベースを選択してください: MySQL/MariaDB
- データベースのユーザー名: nextcloud (docker-compose.yml参照)
- データベースのパスワード: nextcloud (docker-compose.yml参照)
- データベース名: nextcloud (docker-compose.yml参照)
- データベースのホスト名: db
カスタムアプリ追加
こちらを参考に Windows10にDocker for Windows
を入れます。
- 以下は、今回利用したバージョンです。
PS C:\> docker --version
Docker version 18.03.1-ce, build 9ee9f40
PHPで開発するので、PHPStorm必須です。入れます。
- 以下は、今回利用したバージョンです。
Version: 2018.1.2
Build: 181.4668.78
Dockerの設定
- Dockerの設定画面は、タスクトレイのDockerアイコンを右クリック -> Settings から表示できます。
PhpStormからのDockerコマンドは、
tcp://localhost:2375
でリッスンするため、以下のExpose daemon on tcp://localhost:2375 without TLS
を On にします。
PhpStormのワークスペース(ソースの配置場所)のドライブに対して共有設定を行います。私の場合は、EドライブにワークスペースがあるのでEドライブにチェックを入れました。
PhpStormの設定
-
PowerShellにて本記事用に用意したgitリポジトリからソース群をCloneします。submoduleで構成されているので
--recursive
を付与してください。> cd E: > git clone --recursive [email protected]:ukitiyan/nextcloud-docker-develop.git > cd nextcloud-docker-develop
-
以下のようなディレクトリ構成でCloneされていることを確認してください。
/nextcloud-docker-develop ├─docker-nextcloud <-- docker-composeベースディレクトリ │ ├─apps <-- カスタマイズアプリ配置ディレクトリ │ ├─conf <-- カスタムconfファイル配置ディレクトリ │ └─docker-compose.yml ├─server-src <-- nextcloudのcoreソース ├─.gitignore ├─.gitmodules └─README.md
-
上記
nextcloud-docker-develop
をワークスペースとして、PhpStormを起動します。- 本記事では、
E:¥nextcloud-docker-develop
をワークスペースとしています。
- 本記事では、
ツールバーの
File
->Settings
->Build, Execution, Deployment
->Docker
から、APIが疎通(Connection succeefull)していることを確認してください。確認したらOK
クリックで抜けてください。
ツールバーの
Run
->Edit Configurations..
からダイアログを表示し+
->Docker
->Docker-compose
を選択してください。
-
表示された画面に以下を入力し、
OK
クリックで抜けてください。
- Name: Nextcloud
- Compose file(s): .\docker-nextcloud\docker-compose.yml;
ツールバーに
Nextcloud
のRunボタンが表示されるので、クリックします。( ツールバーのRun
->Run 'Nextcloud'
でもOKです )
コンソールに
'Compose: docker-nextcloud/docker-compose.yml' has been deployed successfully.
と表示されたらブラウザで http://localhost:8080 にアクセスし、以下のトップ画面が表示されるか確認してください。
Nextcloudの初期設定
-
引き続き、Nextcloudの初期設定を行います。事前に docker-compose.yml を確認しておきましょう。
docker-compose.ymlversion: '2' volumes: nextcloud: db: services: db: image: mariadb restart: always volumes: - db:/var/lib/mysql environment: - MYSQL_ROOT_PASSWORD=nextcloud - MYSQL_PASSWORD=nextcloud - MYSQL_DATABASE=nextcloud - MYSQL_USER=nextcloud command: mysqld --character-set-server=utf8 --collation-server=utf8_unicode_ci app: image: nextcloud:fpm links: - db volumes: - nextcloud:/var/www/html - ./apps:/var/www/html/custom_apps:rw restart: always web: image: nginx ports: - 8080:80 links: - app volumes: - ./conf/nginx.conf:/etc/nginx/nginx.conf:ro volumes_from: - app restart: always
- db, app, webの3コンテナで起動していることが分かります。
-
MYSQL_XXX
にDBの設定情報が記載されていることが分かります。 - appサービスの volumesにて
apps
がマウントされていることが分かります。
-
さて、ブラウザに戻り以下の通り設定し
セットアップを完了します
ボタンをクリックしてください。- ユーザー名: admin (任意)
- パスワード: ********* (任意)
- データフォルダ: /var/www/html/data
- データベースを選択してください: MySQL/MariaDB
- データベースのユーザー名: nextcloud (docker-compose.yml参照)
- データベースのパスワード: nextcloud (docker-compose.yml参照)
- データベース名: nextcloud (docker-compose.yml参照)
- データベースのホスト名: db
カスタムアプリ追加
上記で触れた通り、 nextcloud-docker-develop/docker-nextcloud/apps
ディレクトリにカスタムアプリを追加します。
-
PowerShellにて本記事用に用意したサンプルアプリからソース群をappディレクトリにCloneします。
> cd E: > cd nextcloud-docker-develop/docker-nextcloud/apps > git clone [email protected]:ukitiyan/nextcloud-sample-app.git sampleapp
ブラウザに戻り、
右上の歯車アイコン
->+ アプリ
を選択しアプリ画面を表示し、 Sample App レコードの有効にする
をクリックします。(認証を求められたらログインパスワードを入力してください)
まとめ
Author And Source
この問題について(PhpStorm+Docker+Win10(Pro)でのNextcloudアドオン開発のはじめかた), 我々は、より多くの情報をここで見つけました https://qiita.com/ukitiyan/items/de25ad5d99c18f81ddec著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .