Sharing Time: What's your development workflow?

Advanced Development
1

Hi All,

I’m wondering what your development workflows are.

I really don’t love what we’re doing right now and I’m looking to upgrade us all to a better workflow.

Some of our requirements are:

  1. collaboration - it’s possible for us to have multiple devs working on the same site
  2. backup/versioning
  3. Ideally ability to use SCSS, minifying actions etc.

Currently we don’t do simultaneous development. We just take turns getting into the code, which is not very good. For backup/versioning we use Dropbox as our local folders, which seems to work pretty well unless somebody makes changes through the admin interface. It works well during development at least. We’re not using SCSS regularly but that’s mostly because we have some people on our team that don’t use it, but I think if we had a simple workflow they would fall in line and at least write CSS in the right place.

So that’s the rub. We tried looking into using Git/Bit Bucket, but because we need to preview the sites live when we’re working on them to see the CMS content, it would mean committing very frequently which would create crazy logs and be slow.

My current best guess is to try VScode with the live share plugin and see if we can get it running on code-server to keep a liveshare session running for devs to log into. We would continue to sync to a dropbox folder for backup and versioning. And I’m looking at running a local machine to sync FTP to the same dropbox folder after the site is live. There is a tutorial on how to script and schedule winSCP to download local backups.

I know there is a lot of room for improvement in what we’re doing. I’d love to hear what everybody else is doing.

Please share your workflows in the comments I’m sure there will be new ideas, tips/tricks for all of us.

2

Hmm… thought more people would be into this :neutral_face: Maybe it’s just been a busy week for people.

3

Aye, extremely busy… also In my case, i’m looking to transition to a new workflow after the migrations are complete.

Currently using DW and SCSS but thats about it.

Basically I would love to transition to vscode, with gulp & scss. In an ideal world, version control would be in the mix too.

Just don’t have the time to change until end of the EOL period.

4

Thanks @James for sharing. Yeah, we’re still using DW as well. I haven’t found an FTP plugin for vscode that handles treepl’s secure connection. That being said I haven’t tried them all. I’d love to switch over to vscode.

I’m stumped on how to integrate git with a CMS. I’ve tried twice with an external senior dev to get this workflow working. We can get it working, but it just ends up not being feasible for our dev pipeline. I’d love to know if somebody is using git successfully.

5

I have asked the Devs in the past what they use to connect vscode to treepl.

They mentioned this extension: https://marketplace.visualstudio.com/items?itemName=liximomo.sftp

However I have not checked it since all the FTP changes, so there might need to be some configuring on your side done to get the correct settings.

6

I’ve tried to get exactly that extension to work in vscode to connect to treepl, but I’m unable to get it to work. Any @treepl devs willing to share connection settings to get this extension to connect to a treepl site.

I have gotten the ftp-simple extension to work with non treepl sites, but it appears it doesn’t support TLS explicit connections. At least that’s what an afternoon of testing ang google lead me to. It works great on non treepl sites.

7

It’s not great - but have been using Coda2 to edit/publish via FTP - Love to hear a VSCode solution if it’s found!

8

Use this config. I’ve just tested and it works fine:

sftp.json config file:

{
    "name": "Treepl",
    "protocol": "ftp",
    "uploadOnSave": true,
    "passive": true,
    "secure": true,
    "host": "yoursite.treepl.co",  
    "port": 21,
    "username": "yoursite.treepl.co|youremail@email.com",
    "password": "YOURPASSWORDORLEAVEITBLANK",
    "remotePath": "/" 
}
9

@James Thanks I got it working with the SFTP extension. Even better I got ftp-simple working which has an “Remote directory open to workspace” which provides basically the same experience we had in Dreamweaver where we work on the live server. It took me a while to find so here is what my config ended up looking like:

{
	"name": "Treepl Site Name",
	"host": "site.trialsite.co",
	"type": "ftp",
	"port": 21,
	"username": "site.trialsite.co|email@address.com",
	"remotePath": "/",
	"uploadOnSave": true,
	"password": "YOURPASSWORD",
	"secure": true,
	"secureOptions": {
		"rejectUnauthorized": false,
		"secureProtocol": "TLSv1_2_method"
	},
	"autosave": true,
	"confirm": true,
	"path": "/"
}

I’m pretty excited. I’d previously read that simple-ftp extension didn’t support the explicit TLS option. But I was wrong.

10

@Alex_B_Centrifuge So i get this error message trying to use ftp-simple using the config command:
Running the contributed command: 'ftp.config' failed.

Did you come across this? am using a Win10 machine Std VSCode (not insiders)

11

I’m also running regular VScode on Win10. So I think we’ve got the same config.

I just double checked my current config to make sure nothing has changed and it’s all the same.

One thing I noticed is that I didn’t include the square brackets in my example. The full config file should look like this (note square brackets wrapping the entire list, and one set of curly braces for each entry separated by a comma):

[
{
	"name": "Treepl Site Name",
	"host": "site.trialsite.co",
	"type": "ftp",
	"port": 21,
	"username": "site.trialsite.co|email@address.com",
	"remotePath": "/",
	"uploadOnSave": true,
	"password": "YOURPASSWORD",
	"secure": true,
	"secureOptions": {
		"rejectUnauthorized": false,
		"secureProtocol": "TLSv1_2_method"
	},
	"autosave": true,
	"confirm": true,
	"path": "/"
},
{
	"name": "Treepl Site Name2",
	"host": "site2.trialsite.co",
	"type": "ftp",
	"port": 21,
	"username": "site.trialsite2.co|email@address.com",
	"remotePath": "/",
	"uploadOnSave": true,
	"password": "YOURPASSWORD",
	"secure": true,
	"secureOptions": {
		"rejectUnauthorized": false,
		"secureProtocol": "TLSv1_2_method"
	},
	"autosave": true,
	"confirm": true,
	"path": "/"
}
]

If that doesn’t work, I would suggest uninstalling and reinstalling your ftp-simple extension to make sure you have the most current version. (There was an incopatibility between the new version of VScode and the previous version of the plugin, but it has been resolve in the current version)

If that doesn’t work try disabling all other extension and see if ftp-simple works. There can be conflicts between extensions. Then enable one-by-one to figure out which one is causing the problem.

12

@James I noticed you posted the SASS articles. Do you use the VSCode Live Sass Compiler. I’ve been using it and I like it.

13

So I had to revert back to version 0.6.8 to get the command to work. Looks like an issue in the later versions. Running the contributed command:'ftp.config' failed. · Issue #139 · humy2833/FTP-Simple · GitHub

Now it allows me to build the json file.

Its annoying it doesnt just add the files to each dev folder locally , but this will do fine.

By the looks of your config you do all your coding remotly? Have you tried to configure for local editing and uploading?

14

@James No I haven’t configured to for local editing. I was just so giddy I got remote editing working I haven’t bothered to get the local + upload. What’s the config local editing?

15

I am just looking at Treepl and found this thread very helpful thank you. I prefer VS Code as well so getting this config file to work is great. Thank you both!

1 Like
16

@DMorgan Agreed. I greatly prefer VScode as well.

And that’s the utility of getting this discussion on the forum. So we can all benefit from solutions we generate :slight_smile: