App development setup with PHP and Vue.js

Question

I am new to Nextcloud app development and would like to create a simple app to play around. I saw that some apps are made with Vue.js, so I’m asking if there is a guide out there?

I generated an app skeleton and played around with the PHP templates but unfortunately I don’t know PHP and would like to create a Vue.js project into this existing demo app.

I found some premade Vue components for Nextcloud

https://github.com/nextcloud/nextcloud-vue

but no step by step guide on how to setup the Vue project after creating the skeleton app. I just saw that the Nextcloud app Tasks is also using Vue.js within the PHP code:

https://github.com/nextcloud/tasks

Thanks a lot for help.

Answer 1

I've looked at the repository you mentioned and it's fairly easy to setup, the question is what would you deserve after setup? If you clone the repository you have something like a 'working copy' of the plugin. But this Plugin needs to be build and the resulting package needs to be copied to right location at the nextcloud server (or maybe you have to install the package over frontend). This is some type of plugin and not a full web application which could run standalone, as I understood.

It's not like you said:

Nextcloud app Tasks is also using Vue.js within the PHP code

It's more like PHP is used for Backend and Vue is used for Frontend, these two 'projects' are completely independent from each other (PHP is backend and Vue is frontend there are no direct dependencies). Just create your Vue application (after build you will have an index.html and several js and css files) these files have to be available from browser. Then your applications entrypoint is the index.html. For PHP: You will just define Interfaces and Routes here which will give you the possibility to interact with the serverside. Then later to deploy your plugin, you have to package it in the format nextcloud needs. You can read from Makefile in the Tasks repository what happens if package is created.

I think a good starting point for you would be: https://docs.nextcloud.com/server/15/developer_manual/app/tutorial.html