Перейти до основного вмісту

Connecting Your Applications to GitHub

To ensure data safety, prevent potential data loss, and enable universal access to your code, connecting your applications to GitHub is crucial. In this guide, we'll demonstrate the process using a GitHub web repository.

Prerequisites

Before proceeding, please ensure you have the following:

  • A GitHub profile.
  • Two repositories created on GitHub, with neither of them containing a README file; one for Node-RED and the other for the user interface (UI).

Setting Up GitHub

  1. Create Repositories on GitHub

    On GitHub, create two repositories for your project: one for the UI and another for Node-RED. Follow these steps:

    • While on your GitHub profile page, click the "New repository" button.

    GitHub Repository Creation

    • In the repository creation page, enter a name for the repository and uncheck the option "Initialize this repository with a README" to create it without that file.

    GitHub Repository Creation

    • Click "Create repository."
примітка

It's essential to choose clear and meaningful repository names that convey their purpose.

  1. Clone Repository

    You can choose to clone via HTTPS or SSH, based on your preferences.

    GitHub Clone Repository

Connecting UI Editor to GitHub

  1. Click on the "CONNECT TO GIT" button located in the bottom left corner.

    UI Editor Connect to GitHub

  2. Paste the SSH URL from GitHub.

    Generate SSH Key

  3. Click Generate SSH Key.

    Generate SSH Key

  4. Add the SSH Key to GitHub.

    • Copy the SSH key from the modal.
    • Go to your GitHub account, click on your profile picture in the top right corner, and select "Settings."
    • In the left menu, select the "SSH and GPG keys" field.
    • Paste the generated SSH key into the "New SSH key" field.
    • Click on the "Add SSH key" button.
  1. Complete the Connection

    Return to UI Editor. Under Author name, enter your GitHub username, and under Author email, enter your GitHub-associated email. Then, click the "Connect" button. The connection to GitHub will be established automatically, and the first commit will be made.

    UI Editor GitHub Connection

  2. Commit and Push

    After making any changes, click the plus button at the bottom. In the modal window titled "Deploy your application," enter a name for your commit in the field and click the "COMMIT & PUSH" button.

    UI Editor GitHub Connection

    UI Editor GitHub Connection

Connecting Node-RED to GitHub

  1. Create a Node-RED Project

    • In the Node-RED interface, click on the three lines icon at the top right corner to open a menu.
    • Click on "Projects" and select "New," or use the keyboard shortcut Ctrl + Alt + N to open the modal window.

    Node-RED Create Project

  2. Complete Project Setup

    • Choose "Create Project."
    • Enter your username and email, then click the "Next" button.
    • Give your project a name and click "Next."
    • Leave the flow file name as-is and click "Next."

    Node-RED Project Setup

  3. Disable Encryption

    • A modal window with encryption settings will open. Choose "Disable encryption" and click on "Create project."

    Node-RED Disable Encryption

  4. Add GitHub Repository Link

    • Create a project on GitHub (refer to the previous steps).
    • In Node-RED, click on the three lines icon at the top right corner to open the menu.
    • Select "Projects" and then "Project Settings."

    Node-RED Project Settings

    • In the menu, select "Settings."
    • Click on the "Add remote" button and paste the HTTPS link of your GitHub project in the URL field.
    • Click on the "Add remote" button to connect Node-RED to GitHub.

    Node-RED GitHub Connection

  5. Commit and Push Changes

    • To save changes in the remote environment, click on the "+add" button in Node-RED.
    • Click on "Commit."
    • Write the title of your commit and click "Commit."

    Node-RED Commit Changes

    • Click on "Commit History" and then on the button with arrows, selecting "Remote: None."
    • Enter your GitHub username or email and corresponding password, then click "Retry."
    • Once again, click on the tree button located at the top right between the book and the bug.
    • Select "Remote: None."
    • If there are no branches, enter any name for the branch and create it.
    • Click on the "Push" button to add your data to the GitHub repository.

    Node-RED Push Changes

Additional Information