25
loading...
Live Share Your IDE between IntelliJ, Eclipse and VS Code
Being able to remotely collaborate on code with your colleagues has never been as essential as it is today. While adhoc screen sharing is okay for infrequent use, its capabilities fall far short for longer, more regular sessions. We move then, to code focused, IDE based solutions - there are several of these, but there are very few which support collaboration across multiple IDEs, and only CodeTogether supports Eclipse, IntelliJ and VS Code. This is what we’ll be using to get a collaborative session going, and through this tutorial, I’ll give you a quick walkthrough of some of its capabilities.
After installation, bring up the CodeTogether view in your IDE and click the log in link. The dialog that appears will allow you to register a new account - go ahead and do that, as some capabilities are accessible only by users who are signed in. Don't worry, no credit card is required, and there's a free usage tier that is very capable.
Before we get started with a session, go ahead and open a workspace or project of your choice. Click Host New Session to start hosting a session - your entire workspace will be accessible, whether it has one project or several.
Note: Use a .codetogether.ignore file to prevent specific resources from being shared.
The session permission dialog that pops up allows you to specify whether others can join the session without being explicitly allowed in, whether they can drive (i.e., whether they can open files and change the cursor location and selections), and finally, whether they can edit files in the session. Let’s use the defaults and click Start - your session will be up and running in a few seconds.
In this walkthrough, we’ll join our session from a local browser so we can see how CodeTogether works first hand. To do this, double-click, Try in local browser in the CodeTogether view, to have a browser open with the invite URL. Since this is the first time you’re joining a session, you will be asked to choose an IDE theme, key bindings, and specify a name. Use a different name in the browser so you can easily distinguish between the IDE and the browser. Choose the Log in link and use the same username and password you used in the IDE
Note: Logging in isn’t mandatory, but will give you access to advanced capabilities like Terminal write access.
If you have another IDE you’d like to try this with instead of a browser, select the Invite others node in the CodeTogether view, from where you will see a Copy Invite URL action you can use to copy the invite URL. In your desired participant IDE, make sure you install CodeTogether and in the CodeTogether view, click join by invite URL/Join Remote Session and paste in this URL. You will need to be signed in for this to work - you can use the same account.
Note: With CodeTogether Teams, team members who are connected to CodeTogether in their IDEs can be invited into sessions directly from the CodeTogether view, without needing to share the invite URL with them.
Terminology: We’re going to refer to the hosting IDE as the host, and whether you joined the session from an IDE or a browser, we’ll refer to that as the participant.
No matter how you’ve joined the session, you should now see the file you have open in the host, open on the participant side as well.
Try something simple like typing in the editors in both the host and the participant. See the code synch almost immediately to the other side? Now try selecting some code … see the selections marked in the other editor as well, with a small annotation indicating who has made the selection. Cool, huh?
In the participant, if you open the Project Explorer view, you will see that you have access to all the files in the host workspace. Double-click any file to open it. Notice that the same file is opened on the host as well. Similarly, if a host opens a file, or activates a different editor, the participant will be taken there too. This is because both the host and participant are in the same “Coding Room”.
Let’s work independently by clicking the Go to a personal room node in the CodeTogether view. Open another file - observe that the editor on the host does not change. Make some changes in the code - the host is still undisturbed, that’s because you are both in independent rooms. This is how multiple developers can browse and code in parallel, without disrupting each other.
A room can have several members in it, and they will all share a single cursor, consequently working on a single file. This is great if you’re having a mob programming session for instance. How does another member in the room take control? No special steps required, they just start typing or change the active editor to start driving the session.
You can have as many rooms as you like in a session - when a new participant joins a session, they can join whatever room they desire, or set off on their own as well.
In the participant, let’s try typing in some real code - content assist will automatically trigger when you enter characters like a period in Java for instance, but you can always manually invoke it using your preferred IDEs keybindings (typically Ctrl / Cmd + Space).
If you make an error in your code, you will see validation highlight it. Issues for which quick fixes exist will allow you to invoke the quick fix from the participant as well.
When it comes to code analysis features, everything from call and type hierarchies to references searches and implementation lookups are available in the client. Some capabilities, like the peek references feature available in the browser may not even be available in your host IDE!
Any console output emitted on the host will be shared in a dedicated console with the clients as well. You can scroll through the console just as you would on the host.
Open a Terminal on the host and type some commands in it. Observe that the terminal appears in the participant as well, and typed commands as well as output are synched between the two. Try typing in the participant terminal - you will be asked if you want to request write access to the terminal. Say yes, and there will be a popup in the host which you should accept. The participant will now be able to type and execute commands in the terminal as well.
Note: Terminals are listed under the Terminals node in the CodeTogether view.
Here are some key CodeTogether capabilities that are beyond the scope of this tutorial, but are features you should be aware of:
You may have observed the CodeTogether Teams section in the CodeTogether view. Once you create a team, you can see which members of your team are currently online, and invite them to a session directly from the CodeTogether view, without having to share an invite URL externally. They can also join running sessions in the team by themselves. Read more about team support here.
CodeTogether servers only relay data between session members, they do not store or cache any source code. Furthermore, this traffic is end-to-end encrypted, so the server has no way of “reading” your source code. For more information, please see this document on security.
For an additional level of security, you can run a private instance of CodeTogether on your intranet. You can additionally integrate this instance with an SSO provider like Okta, Microsoft AD FS, Auth0 or Azure AD - any provider that supports the OpenID Connect protocol. Visit the On-Premises page for more information.
Now that you know how easy it is to use CodeTogether, get a session going right now and invite your team to join in - the free usage tier works great for many everyday collaboration scenarios.
For more information on CodeTogether, do read our documentation and FAQs. If you prefer a visual walkthrough, just watch our 3 minute CodeTogether intro:
More questions? Catch us live in our Gitter community, or send an email to [email protected]. Happy coding!
25