diff --git a/docs/_posts/2024-06-03-code-w1.md b/docs/_posts/2024-06-03-code-w1.md new file mode 100644 index 0000000..11ba717 --- /dev/null +++ b/docs/_posts/2024-06-03-code-w1.md @@ -0,0 +1,97 @@ +--- +title: "Coding Period Week 1: May 27 ~ June 03" +categories: + - Blog +permalink: /coding-week1/ +toc_label: Table of Content +toc: true +sidebar: + nav: "docs" +--- + +From here onwards Coding period begins, During the Monday meeting, mentors discussed the blocks in VisualCircuit resources and initial tests with GitHub Actions. Additionally, I had some doubts about the VC resources repository, which were clarified by the mentors. + +## Goals +- [x] Add basic test with Github Actions. +- [x] Modify and add the blocks in VisualCircuit resources. + +## Accomplishment and Challenges + +* #### First yaml file for Github Actions +First of all, it was my first time writing a YAML file for GitHub Actions. I used resources such as YouTube videos [1] and GitHub Actions documentation [2] to help me write the initial script. From the discussions, it was clear that testing should trigger when there is a pull request to the master branch, so I started with that and followed the VisualCircuit documentation for the frontend installation. + +First failure of coding period: + +![one](../assets/images/one.png) + +* #### Creating workflow for installation process +The initial idea was to create a separate workflow for the installation process. This installation workflow would be reused for every test and other workflows. I worked on this and resolved the above issue by including '--legacy-peer-deps' at the end of the 'npm install' command. + +```shell +name: Install and Build + +on: + pull_request: + branches: + - 'master' + +jobs: + install: + runs-on: ubuntu-latest + + steps: + - name: Checkout code + uses: actions/checkout@v4 + + - name: Set up Node.js + uses: actions/setup-node@v4 + with: + node-version: '16' + + - name: Set up Python + uses: actions/setup-python@v5 + with: + python-version: '3.x' + + - name: Install NPM dependencies + working-directory: frontend + run: npm install --legacy-peer-deps + + - name: Create virtual environment + run: python -m venv .venv + + - name: Activate virtual environment + run: source .venv/bin/activate + + - name: Install dependencies + run: | + python -m pip install --upgrade pip + pip install -r backend/requirements.txt + - name: Add .env file + run: cp backend/.env.template backend/.env + + - name: Generate static files + run: python backend/manage.py collectstatic +``` +* #### Research and modifying the workflow +I reviewed some open source projects such as RocketChat and Volto by the Plone Foundation to understand the CI pipeline workflow. I realized that creating a separate workflow for installation is uncommon and not a best practice. Instead, I created a setup job and stored the results in artifacts for use in different tests (jobs). + +Initially, I encountered a "MODULE NOT FOUND" frontend error because I stored node modules in artifacts. Storing node modules in artifacts is not ideal since artifacts are typically used for build files. Stack Overflow and GitHub Actions documentation [3] suggested using Action Cache instead. After switching to Action Cache, the issue was resolved, and I proceeded to the next step of basic frontend testing. + +* #### CI Workflow with basic frontend test +For basic frontend testing, I researched Jest and React testing frameworks commonly used for unit tests on the React side. I used prebuilt React tests and initially printed the rendered HTML in the terminal. Based on this, I identified the menubar elements and added a basic test to find and verify that the "File" text is present in the rendered App. + +CI Workflow tested in forked repo: + +![two](../assets/images/two.png) + +## PRs created +1. [https://github.com/JdeRobot/VisualCircuit/pull/306](https://github.com/JdeRobot/VisualCircuit/pull/306) +2. [https://github.com/JdeRobot/VisualCircuit/pull/307](https://github.com/JdeRobot/VisualCircuit/pull/307) +3. [https://github.com/JdeRobot/VisualCircuit/pull/308](https://github.com/JdeRobot/VisualCircuit/pull/308) +4. [https://github.com/JdeRobot/VisualCircuit/pull/309](https://github.com/JdeRobot/VisualCircuit/pull/309) + +## Resources +1. [https://www.youtube.com/playlist?list=PL9ok7C7Yn9A-6uidd3RXZPf5EfhxkPXa_](https://www.youtube.com/playlist?list=PL9ok7C7Yn9A-6uidd3RXZPf5EfhxkPXa_) +2. [https://docs.github.com/en/actions/learn-github-actions/understanding-github-actions](https://docs.github.com/en/actions/learn-github-actions/understanding-github-actions) +3. [https://docs.github.com/en/actions/using-workflows/caching-dependencies-to-speed-up-workflows](https://docs.github.com/en/actions/using-workflows/caching-dependencies-to-speed-up-workflows) \ No newline at end of file diff --git a/docs/_site/feed.xml b/docs/_site/feed.xml index c9bd1b1..207298c 100644 --- a/docs/_site/feed.xml +++ b/docs/_site/feed.xml @@ -1,4 +1,110 @@ -Jekyll2024-06-03T13:24:56+05:30http://localhost:4000/gsoc2024-Pankaj_Borade/feed.xmlGSoC 2024 VisualCircuit Block Library - JdeRobotPankaj Keshav BoradeCommunity Bonding Week 32024-05-27T00:00:00+05:302024-05-27T00:00:00+05:30http://localhost:4000/gsoc2024-Pankaj_Borade/comm-w3In the last week of the community bonding period, a video showcasing the Autoparking exercise of RoboticsAcademy with VisualCircuit (ROS2 Humble) was released on the JdeRobot YouTube channel [1]. This was my first time having my work released and published on JdeRobot’s social media platforms [2] [3]. I observed an issue where the value remained the same in the internal constant of identical blocks. This issue occurred when I used multiple laser blocks in the project for the Autoparking exercise. Toshan verified this issue during a meeting on his system.

+Jekyll2024-06-03T19:10:59+05:30http://localhost:4000/gsoc2024-Pankaj_Borade/feed.xmlGSoC 2024 VisualCircuit Block Library - JdeRobotPankaj Keshav BoradeCoding Period Week 1: May 27 ~ June 032024-06-03T00:00:00+05:302024-06-03T00:00:00+05:30http://localhost:4000/gsoc2024-Pankaj_Borade/code-w1From here onwards Coding period begins, During the Monday meeting, mentors discussed the blocks in VisualCircuit resources and initial tests with GitHub Actions. Additionally, I had some doubts about the VC resources repository, which were clarified by the mentors.

+ +

Goals

+
    +
  • Add basic test with Github Actions.
    • +
  • Modify and add the blocks in VisualCircuit resources.
    • +
+ +

Accomplishment and Challenges

+ +
    +
  • +

    First yaml file for Github Actions

    +

    First of all, it was my first time writing a YAML file for GitHub Actions. I used resources such as YouTube videos [1] and GitHub Actions documentation [2] to help me write the initial script. From the discussions, it was clear that testing should trigger when there is a pull request to the master branch, so I started with that and followed the VisualCircuit documentation for the frontend installation.

    +
    • +
+ +

First failure of coding period:

+ +

one

+ +
    +
  • +

    Creating workflow for installation process

    +

    The initial idea was to create a separate workflow for the installation process. This installation workflow would be reused for every test and other workflows. I worked on this and resolved the above issue by including ‘–legacy-peer-deps’ at the end of the ‘npm install’ command.

    +
    • +
+ +
name: Install and Build
+
+on:
+  pull_request:
+    branches:
+      - 'master'
+
+jobs:
+  install:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '16'
+
+      - name: Set up Python
+        uses: actions/setup-python@v5
+        with:
+          python-version: '3.x' 
+
+      - name: Install NPM dependencies
+        working-directory: frontend
+        run: npm install --legacy-peer-deps
+
+      - name: Create virtual environment
+        run: python -m venv .venv
+
+      - name: Activate virtual environment
+        run: source .venv/bin/activate
+
+      - name: Install dependencies
+        run: |
+          python -m pip install --upgrade pip
+          pip install -r backend/requirements.txt
+      - name: Add .env file
+        run: cp backend/.env.template backend/.env
+
+      - name: Generate static files
+        run: python backend/manage.py collectstatic
+
+
    +
  • +

    Research and modifying the workflow

    +

    I reviewed some open source projects such as RocketChat and Volto by the Plone Foundation to understand the CI pipeline workflow. I realized that creating a separate workflow for installation is uncommon and not a best practice. Instead, I created a setup job and stored the results in artifacts for use in different tests (jobs).

    +
    • +
+ +

Initially, I encountered a “MODULE NOT FOUND” frontend error because I stored node modules in artifacts. Storing node modules in artifacts is not ideal since artifacts are typically used for build files. Stack Overflow and GitHub Actions documentation [3] suggested using Action Cache instead. After switching to Action Cache, the issue was resolved, and I proceeded to the next step of basic frontend testing.

+ +
    +
  • +

    CI Workflow with basic frontend test

    +

    For basic frontend testing, I researched Jest and React testing frameworks commonly used for unit tests on the React side. I used prebuilt React tests and initially printed the rendered HTML in the terminal. Based on this, I identified the menubar elements and added a basic test to find and verify that the “File” text is present in the rendered App.

    +
    • +
+ +

CI Workflow tested in forked repo:

+ +

two

+ +

PRs created

+
    +
  1. https://github.com/JdeRobot/VisualCircuit/pull/306
    2. +
  2. https://github.com/JdeRobot/VisualCircuit/pull/307
    3. +
  3. https://github.com/JdeRobot/VisualCircuit/pull/308
    4. +
  4. https://github.com/JdeRobot/VisualCircuit/pull/309
    5. +
+ +

Resources

+
    +
  1. https://www.youtube.com/playlist?list=PL9ok7C7Yn9A-6uidd3RXZPf5EfhxkPXa_
    2. +
  2. https://docs.github.com/en/actions/learn-github-actions/understanding-github-actions
    3. +
  3. https://docs.github.com/en/actions/using-workflows/caching-dependencies-to-speed-up-workflows
    4. +
]]>Pankaj Keshav BoradeCommunity Bonding Week 32024-05-27T00:00:00+05:302024-05-27T00:00:00+05:30http://localhost:4000/gsoc2024-Pankaj_Borade/comm-w3In the last week of the community bonding period, a video showcasing the Autoparking exercise of RoboticsAcademy with VisualCircuit (ROS2 Humble) was released on the JdeRobot YouTube channel [1]. This was my first time having my work released and published on JdeRobot’s social media platforms [2] [3]. I observed an issue where the value remained the same in the internal constant of identical blocks. This issue occurred when I used multiple laser blocks in the project for the Autoparking exercise. Toshan verified this issue during a meeting on his system.

Dr. JoseMaria explained the internal workings of RADI and the Robotics Application Manager. He assigned me the task of researching and understanding RAM. Additionally, he suggested running the VisualCircuit robotics application directly from a zip file inside RADI, which will automatically unzip and run the main.py of VisualCircuit. Previously, I was copying the unzipped files to the Docker image, but with this new method, the directly built version will be used in the Docker image.

diff --git a/docs/_site/index.html b/docs/_site/index.html index b2c94a6..c791161 100644 --- a/docs/_site/index.html +++ b/docs/_site/index.html @@ -170,6 +170,45 @@

Recent Posts

+
+
+ +

+ + Coding Period Week 1: May 27 ~ June 03 + + +

+ + +

+ + + + + + + + + + + + 2 minute read + + + +

+ + +

From here onwards Coding period begins, During the Monday meeting, mentors discussed the blocks in VisualCircuit resources and initial tests with GitHub Acti...

+
+
+ + + + + +
diff --git a/docs/assets/images/one.png b/docs/assets/images/one.png new file mode 100644 index 0000000..c8eb990 Binary files /dev/null and b/docs/assets/images/one.png differ diff --git a/docs/assets/images/two.png b/docs/assets/images/two.png new file mode 100644 index 0000000..f6ae814 Binary files /dev/null and b/docs/assets/images/two.png differ