Desktop App

As a developer, crafting a communication tool that seamlessly aligns with your team's unique requirements can significantly boost productivity and collaboration. The Rocket.Chat desktop app is an open-source project that offers a customizable platform to tailor your communication needs. In this guide, we'll take you through the streamlined process of setting up and building your very own Rocket.Chat Desktop app directly from the source code.

The Rocket.Chat multiplatform client desktop app is built with Electron, a robust framework that empowers developers to create cross-platform applications using web technologies. Setting up the development environment requires downloading and installing multiple dependencies, which we will review below.

Please maintain an active internet connection throughout the installation process.

Requirements

Before you begin with the installation, make sure you have the following on your machine:

• Git

• Node.js

• node-gyp

• Yarn is recommended instead of npm.

Set up Rocket.Chat desktop app

Fetch the code

• Navigate to your working directory in the terminal and clone the Github repository by executing this command:

git clone https://github.com/RocketChat/Rocket.Chat.Electron.git

• Navigate to the cloned repository directory, install the project dependencies, and start the project with these commands:

cd Rocket.Chat.Electron
yarn
yarn start

Once the project is running successfully, a Rocket.Chat desktop app window will launch, prompting you to input your server details to initiate the setup process.

Project structure

The Rocket.Chat Desktop app's source code resides in the src folder. Running the app with yarn start command triggers a build process that compiles all the code in the src folder and outputs the result in the app folder, making the application ready to run. This means the app folder will contain the complete, runnable application, ensuring the app is always up-to-date with the latest changes to the source code.

Rocket.Chat.Electron
├── build
│   └── icons
├── src
│   ├── app
│   │   ├── main
│   │   └── reducers
│   ├── deepLinks
│   ├── downloads
│   │   └── reducers
│   ├── i18n
│   ├── ipc
│   ├── jitsi
│   ├── navigation
│   ├── notifications
│   ├── public
│   │   └── images
│   │       ├── touch-bar
│   │       └── tray
│   │           ├── darwin
│   │           ├── linux
│   │           └── win32
│   ├── screenSharing
│   ├── servers
│   │   └── preload
│   ├── spellChecking
│   ├── store
│   ├── types
│   ├── ui
│   │   ├── assets
│   │   ├── components
│   │   │   ├── AboutDialog
│   │   │   ├── AddServerView
│   │   │   ├── Dialog
│   │   │   ├── DownloadsManagerView
│   │   │   ├── ScreenSharingDialog
│   │   │   ├── SelectClientCertificateDialog
│   │   │   ├── ServersView
│   │   │   ├── SettingsView
│   │   │   │   └── features
│   │   │   ├── Shell
│   │   │   ├── SideBar
│   │   │   ├── UpdateDialog
│   │   │   └── utils
│   │   ├── icons
│   │   ├── main
│   │   │   └── serverView
│   │   ├── preload
│   │   └── reducers
│   ├── updates
│   └── userPresence
└── workspaces
    └── desktop-release-action
        ├── dist
        └── src

After setting up the application environment, move on to developing your desktop app. Customize it to align with your specific requirements.