Forem: Ajo George

Topics in Open Source Final Run Part 3 (Release)

Ajo George — Wed, 11 Dec 2024 20:53:23 +0000

What is happening

Well, things took a big turn, the Repo moderators responded today for the first time after Release 0.3 and they requested lot of changes as we know today is the last of classes and submission for Release 0.4, they is very small room for changes and waiting for them to merge as they live in a different time zone it will be too late.

What they have asked me to do

As there was a styling issue with blog post page This PR They have requested a change in this and also this PR which i created a mock page for creating a blog post, now they requested they need a google form, and finally this PR affects my latest Issue.

What i did

I was able to answer to everything they have asked me too, well was lot of stress at the last moment as all of my other subjects finished today and i want to get everything done. I have added or changed everything based on their request.

First change was:

The second one which is the addition of an embedded Google Form for Blog Creation:

Lastly the updated test cases for google form: Little story about this was i was not sure that we will be able to write a test case for a google form, to my surprise we are able to, but a bit complicated.

Before everything there is a major concern with google form, as if we have a file upload in google form, google will prevent us from using it as an embedded format due to security issues. I have mentioned that to them no reply yet. Still i decided to make them a mock one with the test included.

So the test has has 3 major parts, Title section content section and the submit button section.

# Switch to the iframe containing the Google Form
        iframe = driver.find_element(By.TAG_NAME, "iframe")
        driver.switch_to.frame(iframe)

        # Wait for the form to load
        wait = WebDriverWait(driver, 10)

        # Fill out the "Title" question
        title_field = wait.until(
            EC.presence_of_element_located((By.CSS_SELECTOR, 'input[aria-labelledby="i1 i4"]'))
        )
        title_field.send_keys("Sample Title")

        # Fill out the "Content" question
        content_field = wait.until(
            EC.presence_of_element_located((By.CSS_SELECTOR, 'textarea[aria-labelledby="i6 i9"]'))
        )
        content_field.send_keys("This is a test content for the Google Form.")

        # Submit the form
        submit_button = wait.until(
            EC.element_to_be_clickable((By.XPATH, '//span[contains(@class, "NPEfkd") and text()="Submit"]'))
        )
        submit_button.click()

So in this basically, we choose the frame of google form, which i called as iframe and basically selecting everything with in but it is tricky we need to go and inspect each element and retrieve their aria-labelledby id's in order to call that element to the test case. In my case it was two id's for the text input forms.

Another part is to find the submit message and the success message to ensure the form is submitted, it can be done by taking the element by passing the div and the class id's to the EC.presence_of_element_located and it is located by XPATH. With this we can make sure the google form is active and working as indented.

Concerns

I am pretty sure that they will merge my PR request, only thing is that it won't happen in the time that is given to me, I have tried to contact them multiple time via Discord and all of them were unavailable due to several reasons and also another major thing is about the time zone.

Conclusions

I will still contribute this Repo and help them to finish there work when they are back from their events and classes and i will work my way forward in finishing this issues and merging and closing my issues and PR's.

After all of this mishappenings i am still glad that i was able to contribute to a good cause and i have learned a lot during this course, Special thanks to my Professor David Humphrey and all of classmates it was a wonderful semester indeed.

LINKS:
REPO : https://github.com/computerclubkec/computerclubkec.github.io
PREVIEW : https://deploy-preview-159--dainty-scone-61e301.netlify.app

Topics in Open Source Final Run Part 2 (Progress)

Ajo George — Sun, 08 Dec 2024 02:08:26 +0000

Introduction

As the second last week approaches, i was working on implementing some steps of goals that i have discussed in my previous blog, As this week concludes, i was able to implement one of them. Time is very limited and busy because of finals, assignments and co-op job hunt and interviews.

REPO LINK : KEC CLUB
BUILD PREVIEW : KEC WEBSITE PREVIEW

What progress did i make

As from Release 0.3, i have added a new section to KEC Computer Club's website to have a front end design to add blog post to their website for users. So i felt like it should have testing to show functionalities work properly to avoid any issues that may prevent users' in creating their post.

I will quickly discuss what i have used to carry out the test, i had a small discussion with the moderator and he agreed on using python language to conduct the test so i went with python and with in that i have used selenium. To carry out test. The main test's include :

def test_title_input_updates_preview(driver) : It checks if the user inputed title is getting added to the form and also visible in the preview button.
def test_content_input_updates_preview(driver) : It checks if the user inputed content of the blog is read by the form and also visible to the user when the preview button is pressed.
def test_image_upload_and_preview(driver) : It checks if the file upload for the blog cover works, that is if the image is getting loaded in the form or not.
def test_preview_toggle(driver) : This case checks if the preview button is working or not.

LINK FOR ISSUE : ISSUE
LINK FOR PR REQUEST : PR REQUEST

Concerns' that i have

As i have discussed before, due to the limitation of time, exploring an another repo and contributing to them can be hard, as i don't want to complete fail on my Release 0.4.

For the KEC website i had a chat with moderator, he said the whole group and his collogue are now rarely available as they are participating in an event and they also busy with their semester in their college, so they will very slow responses to PR's and questions.

Another thing to discuss is that, i felt it this issue is not a big thing, i just want to mention that i have already contributed couple of big contributions in the previous releases which they have already merged and this particular projecting is still on planning face and they have some limitations, so there is not much extra to contribute unless they have decided to add more, but i wanted to add at least some mockup or front end to their website that they can use or maybe connect to back end when they are ready to do so.

Hope i get more time to add one more issue to their repo and they get time to review and merge my PR to their Repo.

Topics in Open Source Final Run !

Ajo George — Sat, 30 Nov 2024 21:37:48 +0000

As our semester is coming to an end so as our course about DPS is, as i have learned so many things about open source and related topics around them i am so thankful for the opportunity and how the course have given me valuable experiences to understand the world of open source coding and its contributions.

What is going on now ?

As we are approaching the end we are planning to do a final part called the Release 0.4, which include a much higher contribution to a Repo that you like working on. We should contribute for a bigger issue and have 3 blogs written for it.

What is my plan ?

As i have working closely with the KEC Computer club website and i am quite familiar how their code is structured and what ideas they are using my best option is to stick with them and complete my final release 0.4.

KEC computer club GitHub, It is run by students and some other individuals to represent a computer club from the country Nepal, i was interested in this by their hard work and their dedication for their work as tier website is very organized and easy to use.
As in the previous release including the hacktoberfest, i have contributed couple of small and big PR's to their repo. As i am approaching the last one, i had a discussion with the maintainer of the group, i have some plans for them.

Add a test case and automate it for checking the forms for blog in their website.
Add may be mockup or a front end for a chatbot
Add an option for accessibility (Read a loud, contrast etc)

One issue that i may face is the availability of the moderators, as i was informed they are quite busy with some events and their college semester for the next couple of weeks. But they said they might find time to review my changes.

As i have contributed in small and large features, i dont have big ideas and their website doesn't have much backend functionality to expand their website. So my plan is to add front end if i am planning to implement new features that they can use later with a database and backend.

Hope everything goes well !

AJO GEORGE 30-11-2024

DocBot is Out !

Ajo George — Sat, 23 Nov 2024 21:39:58 +0000

As we are are nearing the end of our journey, DocBot was my tool as part of the Open Source class, As tasked in lab 9, we were informed to pack and release our tool, for everyone to use to the internet. First i thought it was an easy job, i was complete wrong and it took me extra time than submission to finish the activity. I will discuss everything in the blog what actually happened and how i managed to complete it. It was a roller-coaster.

How did i start the work

Me being a absolute beginner in packing and shipping it to code repos in my case PyPI. I had no clue how to make the file organization what extra files to add, luckily we have youtube and i found two excellent videos which did the explanation for me, which i will link here, amazing videos.

This guys helped me to restructure my code to make sure all the packages gets' imported correctly, even though video was there i struggled a lot, it was a lot of trial and error which consumed a lot of time finally fixing all the path and imports.

The final file structure looks like this :

DocBot/                  # Root project directory
├── app/                 # Main application folder
│   ├── docbot_app/      # Python package
│   │   ├── __init__.py  # Marks this folder as a package
│   │   ├── src/         # Source files for the app
│   │   │   ├── __init__.py
│   │   │   ├── api.py   # Handles Groq API integration
│   │   │   ├── arg_parser.py  # Parses CLI arguments
│   │   │   ├── file_handler.py  # Manages file input/output
│   │   │   ├── DocBot.py  # Main CLI application logic
│   │   ├── tests/       # Directory for tests
│   │   │   ├── __init__.py
│   │   │   ├── test_api.py      # Tests for api.py
│   │   │   ├── test_arg_parser.py  # Tests for argument parsing
│   │   │   ├── test_file_handler.py  # Tests for file handling
│   ├── __init__.py      # Makes app a package
├── README.md            # Project documentation
├── setup.py             # Installation and packaging script
├── .env                 # (Optional) Environment variables for development
├── LICENSE              # License file

So after making sure everything is done, next part was building it, which required a file called setup.py, which had more dependency to install one was wheel a file which is needed to distribute the build and another one included twine which was a new tool for me !, This helps as to upload our tool to PYPI, making it available via pip.

Everything was smooth until i realised, i didn't implementing anything to make to work in CLI, after installing it via pip. That also took me me a very long time to figure out, as it was always giving me some error's of module missing, after fixing this docbot-ai was finally ready to be send to PYPI.

Then uploading via twine was so smooth, first i was testing it in PyPi Test site and everything was working smoothly. After ensuring everything was working fine, i updated my README.md to add all the new addition and guidelines to how to use the tool.

Action time

I added the new README.MD, changed the version to V1.0.1 build the tool and published it, along with tag and release in GitHub. Finally everything was done and DocBot is alive !

Conclusion

This lab taught me a lot, mainly file restructuring and organization, which consumed a lot of time for me. It also helped me learn about more tools like wheel, PYPI tokens, building python apps, twine etc. It was fun yet challenging to complete this task.

Links

DocBot AI
DocBot V1.0.1

Release 0.3, More Open Source

Ajo George — Wed, 20 Nov 2024 19:26:15 +0000

Release 0.3

As we progress through the world of open source and my course about open source, we have reached and completed another milestone of the course, which is Release 0.3. In this we were instructed to work on 2 PR's from a repo that you already experienced previously or a new one. So I have chosen the same one from last Release 0.2, The KEC Computer Club. KEC GITHUB.

What i did

As there was no open issues, i reached out to them if i can work on 2 issues which, can be considered as a continuation of what i have created for them in the previous release which was blog post page.
As Release 0.3 required minimum of 2 PR's i created 2 issues :

Creating better styling for blog post page Issue 1
Creating a sample Blog writing Interface Issue 2

Issue 1

In this i had a task to improvise the redirected page of the blog post, which include the whole content of the blog.
Previously it didn't had any styling which negatively contributed to the visual appealing of the website.
Screenshot of previous webpage:

What i did was, i created a new layout so that it can be used globally whenever they have a new blog post coming in. Which features the use of cards, and couple of styling to make it visually appealing to read and overall improve the clarity of the website.
Screenshot of updated page:

As for the PR status it is still pending for review, as this opensource is managed by some students they informed me that they need some extra time for review and updates, so my PR is still pending to be merged.

Issue 2

Now coming to issue 2, which included, introduced a new page which features a sample interface for the website to add blogs' as of now the website is still in development and they haven't implemented backend yet, So to give them a headstart i made a front end for the a blog writing interface it features:

A input area to add title to the blog
A text area to add the contents to the blog
A image upload area which is created with FileReader()
Image can be removed, if user wish too after uploading
A preview button which shows how the blog look after adding all the parts including a small preview of the image.

Screenshots of the page:

In this screenshot we can see the interface which consist of forms, in which title is an input area and content is a textarea. I also added an option to upload an image to the blog post, which also has the feature to remove and add again, if the user didn't like the image they choose at the first time.

Image upload is handled by:

// Handle image upload
    imageInput.addEventListener('change', (event) => {
      const file = event.target.files[0];
      if (file) {
        const reader = new FileReader();
        reader.onload = function(e) {
          imagePreview.src = e.target.result;
          imagePreview.style.display = 'block';
          previewImage.src = e.target.result;
          previewImage.style.display = 'block';
          removeImageBtn.style.display = 'inline-block';  
        };
        reader.readAsDataURL(file);
      }
    });

// Remove image
    removeImageBtn.addEventListener('click', () => {
      imagePreview.src = '';
      imagePreview.style.display = 'none';
      previewImage.src = '';
      previewImage.style.display = 'none';
      removeImageBtn.style.display = 'none';  
      imageInput.value = '';  
    });
  </script>

Also this page features an option to preview the blog post, which will show you title page and the preview of the image uploaded.

// Update title preview
    titleInput.addEventListener('input', () => {
      previewTitle.textContent = titleInput.value || 'Blog Title Preview';
    });

    // Update content preview
    contentInput.addEventListener('input', () => {
      previewContent.textContent = contentInput.value || 'Your blog content will appear here...';
    });
// Toggle Preview section
    previewBtn.addEventListener('click', () => {
      if (blogPreview.style.display === 'none') {
        blogPreview.style.display = 'block';  
        previewBtn.textContent = 'Hide Preview'; 
      } else {
        blogPreview.style.display = 'none';  
        previewBtn.textContent = 'Preview';  
      }
    });

You can see this in action in the below screenshots !

Like i said this PR is also pending to be reviewed, if i get any updates i will surely update it here along with their comments and changes they request.

Conclusion

After all, this was fun, and at the same time, it required time and communication with the repo owners. As I have mentioned in the previous releases, open source is a combination of people from around the world, so it is not expected to have them available any time at our convenience. Its assignment helped me learn more about open source and also the languages. At the end of the day, I am happy to host my contribution on the internet, and it may help others to use the website better.

Links

AJO GEORGE
20-11-2024

Lab 08 Continuous Integration (CI)

Ajo George — Sat, 16 Nov 2024 03:41:23 +0000

What is happening

In this we were tasked to implement CI workflow to the tool that. Also we were tasked to add some more test cases to make sure our CI implementation is working smoothly and also write some test cases in our classmates repos to test their CI integration

What i did

To finish of the first task which include CI workflow and automation of the test case running, i started with adding a workflow file to my GitHub Repo with the help of GitHub itself.
In this we include a .yml which is modified for python apps.

In this image we can see that, it auto runs the test case if there is a pull request or a merge happening in that main branch.

Also we can see that the use of API key of Gorq as it is required to conduct the test and also i have added this as a secret environment variable with in the GitHub.

In this screenshot of the code we can see the main steps and requirements that the .yml install's while running the test cases. then the code is finally tested with the help of pytest.

My new test case

So i wrote a simple test case for the functions which take part in argument parsing,

class TestParseArguments(unittest.TestCase):
In this function it acts as a simulation of passing a file and a model as an argument and then checks if it is correctly parsed and assigned to args.file and args.model. It also checks if the TOML configuration is empty.
def test_parse_arguments_with_token(self):
In this function, it simulates passing a file and a model and also the flag --token, Then it checks if args.token flag is correctly set to True.

What is did in my classmate Repo

I have used my friend Liam's repo, when i took it was too late it has already most the test cases covered so i managed to create a simple one using the help of jest.mock

The test consist of setup of mocks to prevent any interference with the actual file of the tools. Now the test case which node ./index.js nonExistentFile.js which situates the behavior of the tool when a non-existing file is passed as an argument, which will throw an error.

Conclusion

I should say this was not that easy; I ran into a lot of issues with the conversion of my files into packages, as Python requires everything to be in a package for proper CI integration. Then there were issues associated with setting up the test cases with GitHub with the API, which required updating my source code. I managed to implement some simple test cases for me as well as my classmate's repo.

At the end, this lab helped me learn and see more important information about test cases, automation, GitHub, etc. I want to learn more about this to properly understand this to the fullest. I think I will do that slowly.

AJO GEORGE 15-11-2024

Testing DocBot with unittest

Ajo George — Fri, 08 Nov 2024 05:01:10 +0000

So as we wind up week 9, we had lab 07 which handled testing of our code, For me i always feel testing and writing test cases was a bit confusing for me, As for this lab it was even more which including mocking, for making it successfully i need a lot of references and online help !.

What i did !

As DocBot is written with python, i made use of unittest as it was the only one which i have seen and used a bit in the past.

First Task

The first task for us to write a simple test case for tool, so i decided to choose from the main file itself which is DocBot.py. Well for unittest to work we need to follow some file naming and structure. So all the files were stored under a new folder called testes.

For our first set of cases for the main file itself it was stored in test_docbot.py. I wrote very 2 simple test classes for this file.

Test for showing tool version

In this test it check if the -v is working as expected or not. I used io from StringIO to capture the output send to the console. In our case when the version flag is used we should get "DocBot", "0.3". To check this we use assertEqual which is check if the value tested is equal to value expected.

Test for checking if there is no files

In this test we are checking if the tool will give you a output saying "error: the following arguments are required: file". If there is no file given for processing. I managed this by using @patch which is a mock object helps to access the system output, errors etc in the local test case. Finally this test case looks, if exit's correctly and shows the error message to the users.

Second Task

The second task was also to write test cases, but in this case we were actually creating a mock version for our LLM, in my case Gorq API. This technique was first time for me. It tool lot of referencing and help online to finish this work.

Mocking is done in this case because we cant pass API keys and other associated attributes of an LLM for testing.

I have created 2 test classes for this file too, file is called test_api.py.

Test to check if README is generated or not

The final goal of this test was to create a mock version of the Gorq API and test if it creates the README file when files are passed to it.
We make use of MagicMock() which is available with in unittest.mock library. Basically MagicMock helps us to retrieve and hold complex values in a function. In this it is the API generation and values associated with its call.
To pass this test, when the mock API takes a file to generate the README it should have a print of README FILE (Model: llama3-8b-8192) and README content generated in the console. If yes we pass the test.

Test to check if API stopes if user didn't specify any files.

This is almost similar to the case in main file, the only difference is it is testing the main file arguments and here we are passing an non existing file to generate_readme functions, which tells there is no file to the API and checks how the API behaves.
In this case we will pass the check if the prints "Error: Source file nonexistent_file.py not found." to the users. This means there is no file called nonexistent_file.py found to be processed.

Well i know this not that perfect but, this what i made with my understanding.

Summary

As this task was complicated for me and found a bit of difficulty in completing it taught me and forced me to explore and learn new things about testing, As testing is a big part of Software Development. I still need more time to learn more about new things and testing hopefully i can improve in the future !

AJO GEORGE 08-11-2024

Lab 6 : Adding Static Analysis tool to DocBot

Ajo George — Sat, 02 Nov 2024 02:28:36 +0000

For this week we were tasked have a static Analysis tool for our tool that we have developed, in my case DocBot also we had a requirement for adding a CONTRIBUTING.md file to our Repo.

Formatter

What is a formatter, this is an additional tool that we can use in our code to have our code look cleaner and pretterier, making it organized and better to read. To accomplish this task i have used The Ruff Formatter, the reason why i choose this is that i found its documentation and their website easy to understand and the installation was also pretty easy.

Some other reasons include, availability of extensions and more support or documentations of this tool is available online for a beginner to use it.

How to use Ruff Formatter

Well this is pretty simple first it's the installation of the tool itself:

pip install ruff

Then there is actually 3 commands that you can use to format the code which include:

ruff format                   # Format all files in the current directory.
ruff format path/to/code/     # Format all files in `path/to/code` (and any subdirectories).
ruff format path/to/file.py   # Format a single file.

For Example :
Unformatted Code:

def my_function(x,y):return x+y

class MyClass:
 def method_one(self):print("Hello, World!")
 def method_two(self,x):if x>10:return True
 return False

Formatted Code (after applying Ruff):

def my_function(x, y):
    return x + y


class MyClass:
    def method_one(self):
        print("Hello, World!")

    def method_two(self, x):
        if x > 10:
            return True
        return False

In this small example we can see that how Ruff takes care of the Spacing, Line Breaks and Indentation.

Linter

So linter is a tool that helps analyze the code and gives or fixes the issue, which will improve code quality and helps users to find bugs. For my requirement i have used The Ruff Linter as Ruff offers both Formatter and Linter.

How to use Ruff Linter

First of is the installation it is same, it will get installed along with Formater.
pip install ruff

Well Ruff Linter offers 4 option to the user which are:

ruff check                  # Lint all files in the current directory.
ruff check --fix            # Lint all files in the current directory, and fix any fixable errors.
ruff check --watch          # Lint all files in the current directory, and re-lint on change.
ruff check path/to/code/    # Lint all files in `path/to/code` (and any subdirectories).

When i ran this in my code i had one issue which was picked up the tool:

This was an very easy fix !

VSCODE Automation

Final task for this week was to have it automated, it was pretty simple as theirs were clear instruction from Ruff on how to install the VS code extension and how to use the setting.json to make it automated.

All the details for this was found in Ruff VSCODE

The final setting.json file will look like:

{
  "[python]": {
    "editor.formatOnSave": true,
    "editor.codeActionsOnSave": {
      "source.fixAll": "explicit",
      "source.organizeImports": "explicit"
    },
    "editor.defaultFormatter": "charliermarsh.ruff"
  }
}

editor.formatOnSave: Automatically formats the code when you save the file.
editor.codeActionsOnSave: Specifies actions to take on save
source.fixAll: Applies all possible fixes explicitly (like linting errors).
source.organizeImports: Organizes import statements explicitly.
editor.defaultFormatter: Sets charliermarsh.ruff as the default formatter for Python code.

Conclusion

Well, it was fun adding an CONTRIBUTING.md file to our Repo, which i felt like a basic requirement for every open source programme, i was happy to learn about that and Secondly automation, which was also a new knowledge for me and i understood its importance too. Finally all of the commits were squashed together and merged to main.

AJO GEORGE 01-11-2024

Diving into Open Source, Final Part and Recap

Ajo George — Sun, 27 Oct 2024 19:11:59 +0000

As we are near to the end of the Hacktoberfest ,this is my final Pull Request, In this blog i will mention about what had happened in this month and also my last issue and what i did to fix it !

Objectives and Changes Made

As requested from the author/moderator my task was to remove a section from homepage of their website which consist of their executive members of their college group which include current year and previous year.

Link for issue: Issue
Link for PR: PR

Their task was labelled as:

Remove the option to view 2023/24 from the home page
Remove the 2024/2025 as well but make sure to display the members of 2024/2025

So i started with finding out how the data is called in to the main home page and the files which handles the data of the members of the group, so i found out that there is 3 main files.

_data : which has the data of the executive members of their group, for this requirement i don't want to change anything from this.
executive-members.html : which has the html code, which makes the cards for their members by calling in the data from the previously mentioned file.

An example screenshot of the card :

about.markdown : In this file which has the markdown code for rendering the about page, this just act as a page which will eventually call the members list, so that the members list is visible to anyone vesting about page.

What i added was mainly a new file called executive-members-list.html, which will hold all the members data from all the years they required. I believe with this addition they can easily control or edit the members list rather than manually changing it in all the places it requires.

Next the requirement was to remove the indications of the years from the home screen which was actually controlled by executive-members.html, I removed all the button components and year list to easily fix the issue.

Before screenshot:

After screenshot:

Finally the about page update, now they will be able to see all the members list over there i.e 2024,2023.

As of now i have send in the pull request for the issue. They have not responded. I will update this when i get any response from them.

I got an update 29-10-2024, they were happy with my change and approved my PR without any further changes!

Recap

As Hacktoberfest, is coming to end which also marks the end of Release 0.2, It was a fun month of participating in Open Source contributing into Repo, engaging with other members of open source community. Some of the main difficulty that i faced was, sometimes the authors take too long to respond which will affect the ability to proceed further as time is not on our side.

First PR PR PR 1

Let's start with my first

As this was my first PR, not much clue what to expect from the community i had started this, this was a simple work, i was browsing through the page with the Repo participating in this issue. So decided to add a bit for my first PR. This was just a simple jump_search algorithm in Python.

As of now this PR is not merged as the author is not available to communicate, he has requested some changes which i have updated no, response still so still waiting on it.

Second PR PR 2

Now, this one is the one i enjoyed the most among everything, i came across a Engineering college in Nepal which has their website for IT club up in GitHub, they are called Computer Club Dhapakhel,Lalitpur, they had cool active members and discord servers.

My issue was with them to add a blog post for their website based on the figma design they had already in place, i did a pull request with their requirement but i was requested have some changes, with layout, sizing and coloring scheme. Honestly i was a bit scared will i even get accepted for a merge, eventually after back and forth reviewing with the authors i work was finally accepted and merged in with their main code.

Third PR PR 3

My third PR was also with the same IT club which i mentioned above this time it was about adding a new feature to their events page, which was adding a function that the users will be able to download .ics files to mark the events in their calendar. I was successfully to create and implement the feature for them, It is still in the reviewing stage. As the owners or not in the same time zone and they are also students they are limitation for them to review the code.

Final PR PR 4

For my final PR which was also with them, i improved their user experience, which was requested by one of the authors of their Repo, which is basically mentioned above of this blog post

Conclusion

I have learned a lot of new things about language, GitHub, and especially how to participate and behave in the open source community. Some of the things that worry me the most are when the people who work with you also directly impact your progress in open source. Like, we need to wait for them to review, merge, etc., which sometimes can be frustrating, but I think it is normal to have it like that!

All I can say is that this is not easy; time and patience are also key things to have when we are working with open source. That is the main takeaway for me as I finished my PR's.

Link for their website deployment (Please note this may not have all of the changes i made, 2 of my issues are still under review !):
https://computerclubkec.github.io/

All of my issues and PR'S

Issues

Pull Requests

AJO GEORGE 27-10-2024

Diving into Open Source Part 3

Ajo George — Fri, 25 Oct 2024 02:45:36 +0000

I'm, excited to share yet another update i have made in the Computer Club KEC github, As part of the Release 0.2 of our Open Source Class, this is the third Pull Request i am making to complete the course work as well as Hacktocterber Fest.

What was the issue.

The issue that i was assigned to complete was about adding a features that allows user to download .ics file, so that they can import the file into their calendar and save the event details.

Key Changes Made to solve the issue.

1. Add to Calendar Button Template
As they have implemented templates for everything, i also decide to create a template for my new functions so that i can be reused incase.
I created an "Add to Calendar" button template that captures the details of our events and allows users to download the corresponding calendar file. This template is designed for reuse, making it easy to implement for future events.

2. Integration in Event Pages
In the event.html file, this is the file that renders detailed data of the event when the user click the primary card I added the Calendar Button component. Now, when users click on the event card, they can find a download link for the calendar file. This integration enhances user accessibility and makes it convenient for them to save event details directly to their calendars.

3. Upcoming Events Overview
Lastly, I updated the upcoming-events.markdown file. So this file pulls the template from an another file called upcoming-events.html, This page basically acts as a path to display all the event data that they stored. So now the event card now displays a brief overview of upcoming events, along with the "Add to Calendar" option. This allows users to add events directly from the overview page, streamlining the process.

Screenshot of the following additions.

.ics file viewed in google calendar

GitHub Links

As of now they (24-10-2024) haven't reviewed my code, when there is an update i will post it here.

AJO GEORGE 24-10-2024

Diving into Open Source Part 2

Ajo George — Wed, 16 Oct 2024 03:34:51 +0000

What is happening ?

For this week, i found a new Repo which is collage website or some educational website hosted by the IT team or students from that institution situated in Bangladesh. So i was going through their Repo and found that theirs is an active issue for creating Blog page for their website.

What did i do ?

Link for issue : Issue#95

Pull Request : Pull Request#113

My first task was to make sure the website is running locally, they were making use of technologies that i never used before or like barely know about one of them was Jekyll (for building and serving the site) and the other one was Docker (for running the site locally in a container).

After making sure all the installations and requirement's were met, i was finally able to run the website locally using Docker.

My issue which was not originally created by me but i had a chat with the moderator and he said it is available to take, so i begin with reading the entire repo, regarding file and folder locations, naming etc.

The implementation was not that hard, it was basically understanding how the website is making use of Jekyll for loading pages and stuff.
With regarding to this i had to make 2 main files which include one layout for the blog page and another one is the markdown file, which will load in the template.

Interesting thing is that i got confused how is the blog is added to the files or loaded to them to circle accordingly, this was through adding files based on a format specified by Jekyll for example YEAR-MONTH-DAY-title.MARKUP

So with all this setup i had a reference to their figma design to make the website to look like that, i had made use of div which is styled to look like a card.

I have send in the Pull Request on 15-10-2024, if i get any updates i will post it here again.

So, i have received an update, after a few changes requested by the authors they approved my pull request.

Well there was so much happening, as open source pull request and merge is strictly controlled, i received feedbacks from the owners and reviewers to add new feature or apply fixes to mine to get what they want after a bit of communications all of my changes were approved and it was merged with the main.

Link to Pull Request Merge : Merge

This is the screenshot of the page i have created :

What did i feel ?

So apart from my first issue or first PR in the Hacktoberfest, which had an moderator who doesn't respond, i found this repo is activity always and have much bigger potential. Has active members, i said before there is an issue of time zone difference.

So this one i have enjoyed, I need to hear from the owners to fix any changes requested by them before they merge my change.

AJO GEORGE 15-10-2024

Git Rebase and DocBot Refactoring

Ajo George — Thu, 10 Oct 2024 15:38:15 +0000

Introduction

Well moving over to week 5 we updated our DocBot to release 0.3,This doesn't include any new addition but refactoring our old code, so that it easy to manage improve readability and so on.

The requirements for this week lab was to add three refactoring, which i will discuss in the blog later on, then we were asked to make use of git rebase so that all of our refactoring emerge as a single commit on the main.

Refactoring Code No 1

Added a new file called arg_parser.py this file will include all the necessary CLI argument's that the user gives in the CLI, for example -t,-h etc. It will allow us to clean up the main, and we can easily manage them from this separate file.

Refactoring Code No 2

For this i removed all the global variables from main, which was not that difficult so i included an another update in this same commit which included changing everything to functions. For example :

# Function to display the tool's version
def show_version(tool_name, tool_version):
    print(f"{tool_name}, version {tool_version}")

Refactoring Code No 3

In this last addition i made a new file called file_handler.py, the main focus for this addition was to separate command-line argument parsing from file parsing from AI management from output.

GitRebase

We had clear instructions how to use GitRebase, i haven't used git rebase that much, this week topic provided ideas for that, also i never knew that git had an interactive mode, I guess everything has a first time right ?

Conclusion

Like i said this week was fun, learned lot of new things, importance of code clarity and new tools and command in GitHub, especially the squash and interactive menu.

AJO GEORGE 10-10-2024