Skip to content

Claude/organize vsstudio w399e #14010

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
freddyteddy123 wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Claude/organize vsstudio w399e #14010

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
8eb7af6
docs(developer): Add VS Code setup guide
claude Jan 23, 2026
7196983
docs(developer): Add Problem Panel extensions to VS Code guide
claude Jan 23, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 4 additions & 1 deletion developer_manual/getting_started/devenv.rst
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,10 @@
Development environment
=======================

We have a tutorial available on setting up your development environment using docker. You can find the tutorial `here <https://cloud.nextcloud.com/s/iyNGp8ryWxc7Efa?path=%2F>`_. We recommend you to follow that tutorial.
We have a tutorial available on setting up your development environment using docker. You can find the tutorial `here <https://cloud.nextcloud.com/s/iyNGp8ryWxc7Efa?path=%2F>`_. We recommend you to follow that tutorial.

.. tip::
If you use VS Code as your IDE, check out the :ref:`vscode` guide for recommended extensions, DevContainer setup, and debugging configuration.

This page describes how to set up your development environment without docker.

Expand Down
1 change: 1 addition & 0 deletions developer_manual/getting_started/index.rst
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,4 +7,5 @@ Getting started

development_process
devenv
vscode
coding_standards/index
152 changes: 152 additions & 0 deletions developer_manual/getting_started/vscode.rst
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,152 @@
.. _vscode:

===================
VS Code Setup Guide
===================

This guide covers setting up Visual Studio Code for Nextcloud development.

.. note::
VS Code is one of several IDEs you can use for Nextcloud development.
Other popular choices include **PhpStorm** and **Vim**.

DevContainer (Recommended)
Copy link
Contributor

@kesselb kesselb Jan 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
DevContainer (Recommended)
Dev Containers (Recommended)

The follow their wording: https://code.visualstudio.com/docs/devcontainers/containers

==========================

The Nextcloud documentation and server repositories include VS Code DevContainer configurations
Copy link
Contributor

@kesselb kesselb Jan 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
The Nextcloud documentation and server repositories include VS Code DevContainer configurations
The Nextcloud documentation and server repositories include VS Code Dev Containers configurations

for a consistent development environment.

Using DevContainer locally
Copy link
Contributor

@kesselb kesselb Jan 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Using DevContainer locally
Using Dev Containers locally

--------------------------

1. Install `Docker Desktop <https://www.docker.com/products/docker-desktop/>`_
2. Install the `Dev Containers extension <https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-containers>`_ in VS Code
3. Open the repository folder in VS Code
4. When prompted, click "Reopen in Container" or use the command palette (``F1``) and select **Dev Containers: Reopen in Container**

The DevContainer will automatically:
Copy link
Contributor

@kesselb kesselb Jan 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
The DevContainer will automatically:
The Dev Containers will automatically:


- Set up the required runtime environment
- Install necessary dependencies
- Configure recommended VS Code extensions

Using GitHub Codespaces
-----------------------

You can also use `GitHub Codespaces <https://github.com/features/codespaces>`_ for cloud-based development:

1. Navigate to the repository on GitHub
2. Click the green "Code" button
3. Select the "Codespaces" tab
4. Click "Create codespace on main"

For more details, see the `VS Code DevContainers documentation <https://code.visualstudio.com/docs/devcontainers/containers>`_.
Copy link
Contributor

@kesselb kesselb Jan 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
For more details, see the `VS Code DevContainers documentation <https://code.visualstudio.com/docs/devcontainers/containers>`_.
For more details, see the `VS Code Dev Containers documentation <https://code.visualstudio.com/docs/devcontainers/containers>`_.


Recommended Extensions
======================

PHP Development
---------------

For Nextcloud server and app development:

- `PHP Intelephense <https://marketplace.visualstudio.com/items?itemName=bmewburn.vscode-intelephense-client>`_ - PHP code intelligence
- `PHP Debug <https://marketplace.visualstudio.com/items?itemName=xdebug.php-debug>`_ - Xdebug debugging support
- `PHP DocBlocker <https://marketplace.visualstudio.com/items?itemName=neilbrayfield.php-docblocker>`_ - DocBlock generation
- `PHPStan <https://marketplace.visualstudio.com/items?itemName=swordev.phpstan>`_ - Static analysis

JavaScript/TypeScript Development
---------------------------------

For frontend development:

- `ESLint <https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint>`_ - JavaScript linting
- `Vue - Official <https://marketplace.visualstudio.com/items?itemName=Vue.volar>`_ - Vue.js language support
- `Prettier <https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode>`_ - Code formatting

Documentation
-------------

For working with Nextcloud documentation:

- `reStructuredText <https://marketplace.visualstudio.com/items?itemName=lextudio.restructuredtext>`_ - RST language support
- `PDF Viewer <https://marketplace.visualstudio.com/items?itemName=tomoki1207.pdf>`_ - Preview PDF files

Problem Panel Integration
-------------------------

These extensions report errors and warnings directly in VS Code's Problems panel (``Ctrl+Shift+M``):

**PHP:**

- `PHP Intelephense <https://marketplace.visualstudio.com/items?itemName=bmewburn.vscode-intelephense-client>`_ - Syntax errors, undefined variables, type mismatches
- `PHPStan <https://marketplace.visualstudio.com/items?itemName=swordev.phpstan>`_ - Static analysis errors
- `PHP CS Fixer <https://marketplace.visualstudio.com/items?itemName=junstyle.php-cs-fixer>`_ - Code style violations

**JavaScript/TypeScript:**

- `ESLint <https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint>`_ - Linting errors and warnings
- `TypeScript <https://marketplace.visualstudio.com/items?itemName=ms-vscode.vscode-typescript-next>`_ - Type checking errors
- `Error Lens <https://marketplace.visualstudio.com/items?itemName=usernamehw.errorlens>`_ - Shows errors inline in the editor

**PowerShell (for Windows scripts):**

- `PowerShell <https://marketplace.visualstudio.com/items?itemName=ms-vscode.PowerShell>`_ - Includes PSScriptAnalyzer for linting

**General:**

- `Error Lens <https://marketplace.visualstudio.com/items?itemName=usernamehw.errorlens>`_ - Highlights errors/warnings inline
- `Problems Tab Highlighter <https://marketplace.visualstudio.com/items?itemName=prantlf.problems-highlighter>`_ - Enhanced problem highlighting

Workspace Settings
==================

Create a ``.vscode/settings.json`` file in your project with recommended settings:

.. code-block:: json

{
"php.validate.executablePath": "/usr/bin/php",
"intelephense.environment.phpVersion": "8.1",
"editor.formatOnSave": true,
"files.trimTrailingWhitespace": true,
"files.insertFinalNewline": true
}

Debugging with Xdebug
=====================

To set up PHP debugging:

1. Install the PHP Debug extension
2. Configure Xdebug in your PHP installation
3. Create a ``.vscode/launch.json`` file:

.. code-block:: json

{
"version": "0.2.0",
"configurations": [
{
"name": "Listen for Xdebug",
"type": "php",
"request": "launch",
"port": 9003,
"pathMappings": {
"/var/www/html": "${workspaceFolder}"
}
}
]
}

4. Set breakpoints in your code
5. Start the debugger with ``F5``

For more information on Xdebug configuration, see the `Xdebug documentation <https://xdebug.org/docs/>`_.

Related Resources
=================

- :ref:`devenv` - Development environment setup without Docker
- `VS Code DevContainers <https://code.visualstudio.com/docs/devcontainers/containers>`_ - Official documentation
Copy link
Contributor

@kesselb kesselb Jan 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
- `VS Code DevContainers <https://code.visualstudio.com/docs/devcontainers/containers>`_ - Official documentation
- `VS Code Dev Containers <https://code.visualstudio.com/docs/devcontainers/containers>`_ - Official documentation

- `Nextcloud development tutorial <https://cloud.nextcloud.com/s/iyNGp8ryWxc7Efa?path=%2F>`_ - Docker-based setup tutorial