Jump to content

Visual Studio Code for ProcessWire Developers


kongondo

Recommended Posts

thx @Peter Knight don't know what the benefit of another program should be... I like to have everything in the editor and see everything live while I'm working on the code:

5a5f29cf7b582_2018-01-1711_45_02-screenshot.thumb.png.cbae05d84ff2235048e2f06992461aee.png

only thing missing is a proper way to push changes to a pw site... but that's part of the roadmap thread (of course it is possible, but as mentioned there I think it is a lot more complicated to achieve than I am used to by processwire easiness).

Link to comment
Share on other sites

+1 for Tower!

Switched away from Sourcetree because it requires an account now. 

For now, Tower/Sourcetree/... are easier for me to handle all kinds of git-things apart from simple commit/push/pull like for example: rebase, stash, squash, ... and it is visually nice.

I also use vs code. It is still nice to browse diffs in it or just to have a convenient second place to commit/push.

  • Like 3
Link to comment
Share on other sites

1 hour ago, blynx said:

+1 for Tower!

Switched away from Sourcetree because it requires an account now. 

 

Completely understand if you don't wish to create accounts for the sake of it. 
I happen to use Bitbucket quite a lot as well, which integrates well with Sourcetree since they share the same maker.



 

Link to comment
Share on other sites

  • 2 weeks later...
On 17/01/2018 at 9:24 PM, bernhard said:

looks interesting!

so @kongondo don't you use vscode git at all or do you use vscode git for simple tasks (like shown in my screenshot) and sourcetreeapp for more complex ones?

thx

Oops, forgot to respond..

I don't use VSC git at all. One, I was already used to sourcetree (I tried others but they never worked for me). I feel the VSC git interface looks a little bit cramped. I guess I am also a bit jittery I'd make mistakes in there. In a sense, I don't want a swiss army knife in this case. I use VSC for the text side of things and sourcetree for what it was meant to be; a git app :).

 

  • Like 2
Link to comment
Share on other sites

  • 2 weeks later...
10 minutes ago, SamC said:

So do none of you guys use the command line for git? Using desktop apps instead?

For me it's a mix. I really like a GUI for visually reviewing the code changes in all files before committing.

But for checking out and pulling updates from other (not my) repos, I use the command line.

  • Like 1
Link to comment
Share on other sites

18 minutes ago, adrian said:

For me it's a mix. I really like a GUI for visually reviewing the code changes in all files before committing.

But for checking out and pulling updates from other (not my) repos, I use the command line.

I guess I haven't been doing anything complex enough to need a GUI. Just stuff like this:

https://confluence.atlassian.com/bitbucketserver/importing-code-from-an-existing-project-776640909.html

Forced myself away from dropbox and now have to use git on my two computers in order to sync my work. Otherwise I would have just kept putting it back.

It's been interesting to say the least. Cool progress though!

Link to comment
Share on other sites

  • 2 months later...
57 minutes ago, bernhard said:

If anybody of you like me totally missed the markdown preview of vscode just click the preview icon on the top right:

I've been using the Auto-Open Markdown Preview extension. Works a treat. Only problem I have with it is that it does not auto-close the preview when the markdown file is closed.

  • Like 1
Link to comment
Share on other sites

I'm been using VSCode for the last 9 months or so and I love it. I'm mostly a Javascript developer so it does fit in my alley but I've had success with using it with PW. 

On 1/17/2018 at 10:49 AM, bernhard said:

only thing missing is a proper way to push changes to a pw site... 

2

The little circle/refresh symbol in the bottom left  allows you to push your changes to Github/Gitlab etc. Or you can use the command palette to "Git Push". Works a treat with Continuous Interaction. 

There's also a remote FTP plugin which lets you sync which I've used a couple of times on legacy projects. 

  • Like 2
Link to comment
Share on other sites

4 hours ago, StanLindsey said:

The little circle/refresh symbol in the bottom left  allows you to push your changes to Github/Gitlab etc. Or you can use the command palette to "Git Push". Works a treat with Continuous Interaction. 

There's also a remote FTP plugin which lets you sync which I've used a couple of times on legacy projects. 

Thx, I know all those options. Don't know exactly what I meant with my comment ;) I think I was talking about some kind of staging/dev setup... Not related to vscode of course :)

  • Like 1
Link to comment
Share on other sites

  • 4 weeks later...

what are your settings for the file search ignore? today I hit ctrl+p to find and edit /site/ready.php but I accidently chose ready.php inside the filecompiler folder...

Fa0nygh.png

**/site/assets/cache/**

This snippet in the user settings helps, but I wonder if you have any other folders excluded?

146426696_2018-05-0814_39_14-settings.json-360-VisualStudioCode.png.ccb63f189a0f3a229088d4903acd3fcf.png

  • Like 1
Link to comment
Share on other sites

  • 1 month later...
On 5/8/2018 at 1:40 PM, bernhard said:

what are your settings for the file search ignore?

I have never gotten round to adding custom ignore ones. 

On 5/8/2018 at 1:40 PM, bernhard said:

today I hit ctrl+p to find and edit /site/ready.php but I accidently chose ready.php inside the filecompiler folder

😀

Link to comment
Share on other sites

  • 3 weeks later...
  • 2 weeks later...
  • 2 weeks later...

Thx @gmclelland very helpful!

I'm working on my git workflow and I just found the GitLens extension. I haven't tested it much but it looks quite amazing so far! https://gitlens.amod.io/

2018-08-02--16-40-23.thumb.png.8f0e126ebe2a481454d3086ef5d8e397.png

Also I've switched from the portable version back to a regularly installed version, because that has several benefits (for example having it in the context menu). I just moved my "data" folder to my OneDrive and placed a symlink to the installed VSCode folder:

// make a backup of your data folder
// open cmd (with admin privileges!)
mklink /J "C:\Program Files\Microsoft VS Code\data" "D:\OneDrive\programme\portable\vscode\data"

 

Link to comment
Share on other sites

  /* editor */
  "editor.rulers": [80, 120],
  "editor.tabSize": 2,
  "editor.renderWhitespace": "boundary",
  "files.associations": {
    "*.module": "php",
    "*.inc": "php"
  },
  "editor.renderIndentGuides": true,

  /* search */
  "search.exclude": {
    "site/assets/cache/**": true,
  },

 

11 minutes ago, zoeck said:

Could you post which plugins you use?
I am currently setting up my VS code 😉 

Sure, atm only these:

2018-08-03--10-13-58.png.a286da017fec09604e8f5756fee8af93.png

Nothing special. I don't have any fance code completion yet, so I'd be happy to get recommendations 🙂

Link to comment
Share on other sites

  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Similar Content

    • By Robin S
      This module is inspired by and similar to the Template Stubs module. The author of that module has not been active in the PW community for several years now and parts of the code for that module didn't make sense to me, so I decided to create my own module. Auto Template Stubs has only been tested with PhpStorm because that is the IDE that I use.
      Auto Template Stubs
      Automatically creates stub files for templates when fields or fieldgroups are saved.
      Stub files are useful if you are using an IDE (e.g. PhpStorm) that provides code assistance - the stub files let the IDE know what fields exist in each template and what data type each field returns. Depending on your IDE's features you get benefits such as code completion for field names as you type, type inference, inspection, documentation, etc.
      Installation
      Install the Auto Template Stubs module.
      Configuration
      You can change the class name prefix setting in the module config if you like. It's good to use a class name prefix because it reduces the chance that the class name will clash with an existing class name.
      The directory path used to store the stub files is configurable.
      There is a checkbox to manually trigger the regeneration of all stub files if needed.
      Usage
      Add a line near the top of each of your template files to tell your IDE what stub class name to associate with the $page variable within the template file. For example, with the default class name prefix you would add the following line at the top of the home.php template file:
      /** @var tpl_home $page */ Now enjoy code completion, etc, in your IDE.

      Adding data types for non-core Fieldtype modules
      The module includes the data types returned by all the core Fieldtype modules. If you want to add data types returned by one or more non-core Fieldtype modules then you can hook the AutoTemplateStubs::getReturnTypes() method. For example, in /site/ready.php:
      // Add data types for some non-core Fieldtype modules $wire->addHookAfter('AutoTemplateStubs::getReturnTypes', function(HookEvent $event) { $extra_types = [ 'FieldtypeDecimal' => 'string', 'FieldtypeLeafletMapMarker' => 'LeafletMapMarker', 'FieldtypeRepeaterMatrix' => 'RepeaterMatrixPageArray', 'FieldtypeTable' => 'TableRows', ]; $event->return = $event->return + $extra_types; }); Credits
      Inspired by and much credit to the Template Stubs module by mindplay.dk.
       
      https://github.com/Toutouwai/AutoTemplateStubs
      https://modules.processwire.com/modules/auto-template-stubs/
    • By FrancisChung
      PHPStorm for PW Devs
      This thread is a place for ProcessWire developers who use PHPStorm to share their experience, tips, frustrations, solutions, code snippets and generally discuss all things PHPStorm.
      From Wikipedia:
       
      Thanks @kongondo for the Visual Studio Code post earlier.
    • By szabesz
      CodeRunner 2 is on sale at MacUpdate: https://www.macupdate.com/app/mac/38362/coderunner
      Mostly I use it for writing shell scripts, mocking up algorithms in PHP, JavaScript/jQuery. But is also supports other programming languages as well.
      https://coderunnerapp.com/
      "An advanced, highly flexible, and easy-to-use programming editor for your Mac. CodeRunner supports a large number of languages, and delivers big IDE features while remaining lightweight and clutter-free."
    • By pwFoo
      I moved from netbeans to atom. Tested lighttable, brackets and visual studio code, but at the moment I take a look into web based IDEs. Most are based on ACE editor (alternative could be codemirror) like chrome apps caret or super neutron drive (both with chrome dependency at the moment). 
      Recently I looked into cloud9, codetasty, ... and codiad.
      Codiad is open source. php / js based and works fine. Autocomplete feature and suggestions should be improved, but it's ok. Because it's open source you can download it from github repo or test it as a docker container (wernight/codiad image for example). 
      Codytasty is a cloud hosted solution with a really awesome autocomplete / suggestions for php, js and html! But it isn't open source (there is a free to use hosted version with limited workspaces and features).
      At the moment I testing codiad@docker, but use still atom for coding and searching for the best IDE out there *g*
       
      What do you think about IDEs and the new trend to web based IDEs?
    • By benbyf
      HELLO! Anyone happen to be using Atom the open source IDE from github? I've been using it for about a year now and other than the occassional crash it's been great.
      I was wondering if anyone out there has proccesswire specific snippets, syntax hightlighting or autocomplete package they've created to add their PW work? If not would anyone be interested if I made one, and what would be most useful?
×
×
  • Create New...