DEV Community: Vishnu Das Puthukudi

Conclusion: Navigating Development Challenges

Vishnu Das Puthukudi — Wed, 13 Dec 2023 19:09:40 +0000

To sum up, this blog article summarises the process of deploying Navbar #2 for the Untis Planner project, including its planning, development, and release phases. Even though there were difficulties with the first pull request, the project shows tenacity and an optimistic outlook.

In summary, the planning, development, and release phases of the Untis Planner project's Navbar #2 deployment process are covered in this blog post. Despite some issues with the initial pull request, the project demonstrates perseverance and a positive vision.

A Forward-Looking Method
The initiative remains hopeful and forward-thinking in spite of its early setbacks. The pull request closing is presented as a chance for more contributions and improvements rather than as a setback. This kind of thinking is consistent with the dynamic, team-based character of open-source projects, where criticism is welcomed and used as fuel for development.

upcoming revisions and additions
Readers are encouraged to continue participating in the Untis Planner project by the finale. As the project progresses, more upgrades are planned, with the goal of including additional functionalities to strengthen the application's resilience. The project's inclusive and community-driven attitude is emphasized by the request for contributions and comments.

In conclusion, this blog article summarizes the difficulties encountered during the Navbar #2 implementation and lays the groundwork for an exciting future adventure. Readers are invited to follow along, contribute, and see how the Untis Planner project develops into a feature-rich, well-designed programme.

Progress: Implementation and Challenges

Vishnu Das Puthukudi — Wed, 13 Dec 2023 19:01:39 +0000

started Pull Request #13 with the goal of putting the features that were expected to be included in Issue #2—which concentrated on developing a responsive navbar for Units Planner—into action.

Comments and Difficulties
Following assessment, Dino-Kupinic, the project owner, offered helpful criticism on the pull request, emphasizing the following areas that needed attention:

Usage of Normal CSS: Rather of using Tailwind CSS, the pull request made use of normal CSS, which might not be in line with the project's stylistic guidelines.

Noisy Comments: When there are a lot of loud or lengthy comments in the code, it's a sign that the codebase needs to be more organized and simple.

Nuxt Auto-Import function: It appears that the project structure or procedures were not followed since the Nuxt auto-import function was not used.

Deviations in Layout and Style: The actual navbar's layout and style diverged from the original drawing, which might have an impact on the project's overall visual coherence.

Non-Functional Dropdown Menu: It was reported that the navbar's dropdown menu was non-functional, suggesting that changes were necessary to guarantee correct functioning.

Decision-Making and Project Guidance
Dino-Kupinic made the decision to close the pull request in response to the comments, thanking the contributor but stating that, at this point in the project's development, the contribution did not correspond with the project's mission. The determination to uphold uniformity, conform to coding standards, and guarantee appropriate operation throughout all navbar components served as the impetus for the choice.

Prospects for the Future
Even though the pull request was closed, Dino-Kupinic was upbeat about more contributions. urging participants to propose additional features as the project moves closer to a more sophisticated development stage. This forward-thinking strategy highlights how open-source projects are collaborative in nature, relying on incremental improvements and input to ensure project success.

Planning: Creating NavBar #2

Vishnu Das Puthukudi — Wed, 13 Dec 2023 18:48:43 +0000

Issue #2, which Dino-Kupinic opened five days ago, described how the Untis Planner project needed a responsive navbar. The main objective was to create a navbar that works flawlessly on desktop and mobile platforms. The Units Planner Logo integration, a Light/Dark mode switch, and a Settings button were among the features that were mentioned.

Labels and Assignees

Dino-Kupinic assigned the problem to dsamhabe, Neuery17Alt, and other contributors in order to move things forward more quickly. An "❗Level 4-important" label was used to emphasize the enhancement's importance, and the label "feature" was used to emphasize its priority. Concerned with the "Working Prototype" milestone was the problem.
Getting Ready for Implementation
Vishnudas2003 acknowledged the value of this improvement and stated that he was excited to get to work on Navbar #2's implementation. A synopsis of the

Project Blog: Building a Quiz App with React

Vishnu Das Puthukudi — Wed, 29 Nov 2023 22:18:46 +0000

Overview

I'll go through the steps involved in creating a quiz app with React in this blog article. The project include developing a number of components, putting routing into place, managing user authentication, and improving the user interface.

Establishing the Project's Structure

I began by arranging the pages, other assets, and components in the project's structure. To make development easier, a clear, scalable framework was intended.

React Router Integration

I used react-router-dom to enable navigating throughout the app and created routes for various pages. The home page, quizzes, about, contact, help, and error pages all needed to have routes created.

Establishing the Layout Component

The programm as a whole is wrapped in the Layout component. It has a loading screen and contains the content area, footer, and navigation bar.

Component of Navbar

The purpose of the Navbar component was to make navigating the app simple. It has dropdown menus for user authentication with the Login component and connections to other pages.

Component of User Authentication Login

User authentication is handled via the Login component. It offers a straightforward login/logout process and stores user credentials in local storage. When the user logs in, the component also has a dynamic welcome message.

Establishing the Layout Component

The programme as a whole is wrapped in the Layout component. It has a loading screen and contains the content area, footer, and navigation bar.

Component of Navbar

The purpose of the Navbar component was to make navigating the app simple. It has dropdown menus for user authentication with the Login component and connections to other pages.

Component of User Authentication Login

In summary

Using React to build the Quiz App was a rewarding experience. It required creating components, integrating different libraries, and making sure the user experience was flawless. My abilities in state management, UI design, and React development have all improved as a result of this project.

Simplifying Releases: A Journey with Text2page

Vishnu Das Puthukudi — Fri, 24 Nov 2023 00:32:38 +0000

In the context of open-source development, making sure that consumers can readily obtain and profit from the most recent changes requires developing a smooth release procedure. I'll talk about my experience releasing Text2page, a command-line utility for Python that makes it easier to turn plain text files into well-organized HTML publications, in this blog post.

I used Twine for the release process and PyPI as the package registry for this project. Twine is a tool for publishing Python packages to PyPI, and PyPI is the official repository for Python programmes.

Creating a Release: Step by Step

Prior to starting the release process, I made sure my project followed the guidelines for Python packaging. Included in the project structure were necessary files such as style.css and text2page.py. To describe package information and dependencies, I wrote a setup.py file. The setup.py version number was changed to correspond with the project's current status.

To create source and wheel distribution packages, I ran the following commands:

python setup.py sdist bdist_wheel

Before making the release public, I uploaded the package to the Test PyPI to catch any issues. The following command was used:

twine upload --repository-url https://test.pypi.org/legacy/ dist/*

Once satisfied with the Test PyPI, I proceeded to upload the package to the official PyPI:

twine upload dist/*

To tag the release on GitHub, I used:

git tag v0.1.0 git push origin v0.1.0

I added details on the new features and changes included in this release to the README.md file. urged people to download and try out the latest version. gathered input to make the project even better.It was satisfying to release Text2page. An open-source project's release process, user testing, and documentation updates are essential steps in its upkeep. With any luck, this post helps shed some light on the release process and inspire other devs.

Title: Enhancing User Authentication: A Deep Dive into the Login Page

Vishnu Das Puthukudi — Thu, 23 Nov 2023 00:35:15 +0000

We will discuss the recent pull request that brings substantial improvements to our user authentication procedure in this blog post. The updated login page is the main feature of this update. Let's examine the process of ideation, execution, and lessons discovered along the road. By adding a more user-friendly and aesthetically pleasing login screen, this pull request aimed to improve the user login experience. Furthermore, the integration of Microsoft and Google login choices was done to give consumers safe and practical options.
Reworking the login page's design was one of the first things to do. To guarantee that customers will have an intuitive and visually pleasant experience, a simple and user-friendly design was chosen. A makeover was applied to the login form to improve readability and overall design. To produce a consistent and polished appearance, appropriate font modifications, colour selections, and spacing were used. Expo Router was used to elegantly incorporate the login page into the pre-existing navigation structure. The Tabs.The login screen was added as a navigable option alongside the current tabs using a screen component.
Core React Native components, such as TextInput for user input and Button for login actions, were used to construct the login form. The form fields might be updated dynamically thanks to state management using useState. The implementation of the handleLogin, handleGoogleLogin, and handleMicrosoftLogin routines took care of the logic for authentication. During the development stage, logging messages were positioned to make debugging easier.
An important step has been taken in the direction of improving the user login experience with this pull request. We have created a login page that complies with contemporary standards by giving equal weight to both functionality and aesthetics. Our dedication to providing high-quality user experiences is seen by the way we iterate and get better every time.

Setting up GitHub Actions CI Workflow for Text2page project

Vishnu Das Puthukudi — Sat, 18 Nov 2023 17:20:59 +0000

In the project root, I made a file called.github/workflows/ci.yml to configure GitHub Actions for Continuous Integration. This is how the YAML workflow file appeared:

name: CI

on:
  push:
    branches:
      - main

jobs:
  test:
    runs-on: ubuntu-latest

    steps:
    - name: Checkout repository
      uses: actions/checkout@v2

    - name: Set up Python
      uses: actions/setup-python@v2
      with:
        python-version: 3.8

    - name: Install dependencies
      run: |
        python -m pip install --upgrade pip
        pip install -r requirements.txt

    - name: Run tests
      run: |
        python -m unittest discover -s tests -p 'test_*.py'

This process checks out the repository, installs dependencies, installs Python, and runs the unit tests using unittest. It is triggered by each push to the main branch.

I provided tests for the processDirectory function in my partner's code as part of our collaborative testing experience. I became acquainted with their project structure by navigating their repository and looking through the README and CONTRIBUTING files. This partnership required me to adjust to their testing environment and any potential language or framework incompatibilities, unlike my original codebase. Understanding testing conventions and procedures required reading their documentation. Carefully examining the foreign codebase, identifying places lacking appropriate test coverage, and aligning with the project's objectives were necessary before adding tests. Clarity in communication was crucial, and prior to submitting the pull request, local tests were conducted to guarantee smooth integration and compliance with their continuous integration (CI) procedure. Overall, the experience highlighted flexibility, good communication, and the common objective of improving the codebase.

CI setup has proven to be a useful experience. It ensures that code updates don't create new defects and that the project stays in a deployable condition by automating the testing process. Any faults may be promptly identified with the aid of the visual feedback that CI pipelines in the GitHub Actions interface give.

Testing Journey with Text2page: A Developer's Perspective

Vishnu Das Puthukudi — Sat, 11 Nov 2023 04:01:40 +0000

The incorporation of test-driven development (TDD) into Text2page development has added a new level of maturity to the project. The purpose of this blog article is to explain the newly added functionality, the unittest framework selection, the testing procedure, and the insightful lessons discovered throughout this testing journey.

Features Implemented

Sturdy HTML Creation
Text2page's primary role is to transform Markdown and plain text files into beautiful HTML pages with ease. The latest improvements guarantee stable HTML creation that supports several input types.
Examining the output in HTML
A full set of tests has been implemented to ensure the accuracy of the HTML output. Carefully examining every step of the HTML creation process helps to detect regressions and guarantee Text2page reliability.

Choice of Testing Framework

Accepting Unit Testing
Because of its strong set of testing features and natural connection with Python, the unittest framework was selected in the search for an efficient testing approach. The choice is consistent with the project's dedication to compatibility and simplicity.

Procedure for Testing Test Suite Extension

The testing suite now includes more tests for important Text2page functionalities. This comprises:
Ensuring precise Markdown to HTML translation is known as HTML Content Parsing.
File Type Recognition: Checking if the programmer can process different kinds of input files

Uncovered Bugs and Edge Cases

The testing procedure revealed flaws and edge cases, proving the value of a methodical testing strategy in identifying possible dangers.

In summary

An important step has been accomplished with the incorporation of test-driven development into Text2page. The dedication to testing guarantees the project's resilience and flexibility to upcoming difficulties as it develops further.

We appreciate you participating in this examination of the Text2page testing environment. I hope your code is resilient and your tests are green!

Enhancing Code Quality and Workflow in Text2Page

Vishnu Das Puthukudi — Sat, 04 Nov 2023 00:51:02 +0000

Intro
As we worked to make the Text2Page project better, we realised how important it was to keep the code consistent and of high quality. Our project's open-source nature attracts a varied set of contributors, each with their own coding preferences and techniques. We made the decision to incorporate Black and Flake8, two essential tools, to make sure that our code is still understandable and follows Python style requirements.

Tools of Choice
Black: Black is renowned for being straightforward and efficient, so we decided to use it as our code formatter. Python code is automatically reformatted by Black to follow its style rules, resulting in consistently well-formatted code. More details on Black are available here.
Flake8: We choose Flake8 for style checking and static code analysis. This flexible tool finds possible problems in your code, such typical programming errors and style infractions. It may greatly improve code quality and ensure adherence to PEP 8 principles. Flake8 may be explored here.

Setting Up the Development Environment
Implementing Black and Flake8 was a straightforward process. We updated our CONTRIBUTING.md file to include clear instructions for contributors to use these tools. To run Black, contributors can execute black . in the project directory to ensure their code adheres to the Black style guidelines. For Flake8, the command flake8 . identifies and reports any style or quality issues in Python code.

Uncovering Code Issues
Flake8 was essential in helping us find possible problems in our codebase. It found frequent code errors, inconsistencies, and style violations. We were able to preserve strict guidelines for code quality and guarantee the project's long-term maintainability by resolving these problems.

Conclusion
To sum up, we have found that adding Black and Flake8 to Text2Page has improved code quality and allowed contributors to work together more successfully. The tools we've chosen are very easy to use and efficient, so our codebase will always be clear, legible, and manageable. We hope that additional open-source projects will take into account these kinds of improvements, as they will eventually result in better code and more fruitful partnerships. We can guarantee the Text2Page project's survival and purpose fulfilment by taking proactive measures to fix difficulties as they arise.

Hacktoberfest 2023: My Journey in Open Source

Vishnu Das Puthukudi — Tue, 31 Oct 2023 23:48:43 +0000

Every year, Hacktoberfest is a celebration of open-source software where participants from all over the world gather to work together on fascinating projects and make improvements. I had the honour of taking part in Hacktoberfest 2023 this year, and it was an exciting adventure full of development, learning, and difficulties. As an open source supporter and tech enthusiast, I jumped at the chance to contribute significantly to a range of projects. I'll take you through my Hacktoberfest experience in this blog post, emphasizing the problems I solved, the pull requests I made, the blog entries I wrote, the difficulties I encountered, and the insightful insights I discovered.
Come along on this journey with me as I explain the nuances of my contributions to open source and offer insights into the dynamic and cooperative open source community. This trip offers something for everyone, regardless of skill level—it might be for a beginner programmer, an experienced developer, or someone who is just interested in the wonders of open-source software. Now let's explore the open-source world and go right into the heart of Hacktoberfest.

Added TLDR Page for Azure Kubernetes Service (AKS) Command

Issue Description: It was necessary to improve the Azure Kubernetes Service (AKS) command by include a TLDR (Too Long; Didn't Read) page. Users might use this as a fast reference, as it summarizes the main features and instructions associated with AKS.
My Contribution: My contribution was a succinct yet educational TLDR page for the AKS command, which I made with much enthusiasm after accepting this challenge. This update was made to help users quickly become familiar with AKS capability.

Adding quotations to QuoteVerse

Issue Description: The objective assigned to me for this problem was to improve the QuoteVerse project by including fresh quotations. QuoteVerse is an online resource that offers users motivational and thought-provoking quotations.
My Contribution: I jumped into this issue headfirst and filled QuoteVerse with a tonne of inspirational and intriguing quotes. These sayings were chosen with care to encourage and brighten the spirits of platform visitors.

Add Rate Limiting for PyFuzz

Issue Description: In order to prevent misuse or overuse of the programme by a single user, rate limitation had to be implemented for the PyFuzz project. This included imposing restrictions on the frequency at which particular procedures might be carried out.
My Contribution: I took on the task of integrating rate limitation into PyFuzz and put in place the required safeguards and limitations to avoid abuse. The purpose of this update was to enhance the performance and stability of the application.

Integrate Weatherbit Forecast API

Issue Description: This problem concerned project integration for the Weatherbit Forecast API. Users may get real-time weather information by integrating weather APIs into apps, which supply vital meteorological data.
My Descrption: With my effective integration of the Weatherbit Forecast API into the assigned project, customers may easily get the most recent weather forecasts. The functionality and user experience of the project were improved by this modification.

Being a part of Hacktoberfest 2023 was a very fulfilling experience. I got the chance to contribute to a range of open-source projects throughout the event, each with its own set of objectives and difficulties. Through these efforts, I was able to advance my technical abilities and significantly influence the open-source community.

Syntax Highlighting Feature in "text2page" Project:

Vishnu Das Puthukudi — Tue, 31 Oct 2023 22:31:19 +0000

Feature Description

The "text2page" project's syntax highlighting function is intended to improve the readability of code on documentation pages.
It colourizes code snippets to make them stand out visually and be easier for readers to understand.
Enhancing code understanding and presenting code in an aesthetically pleasant manner are the main objectives of the feature.

How It Works

The syntax highlighting functionality examines the content of a code block that it finds in the documentation text.
The programming language used in the code block is identified by the feature.
It uses syntax highlighting conventions, including comments, strings, and keywords, that are exclusive to that programming language.
The code's visual attractiveness is enhanced by colorization based on the syntax highlighting theme or style selected.

Purpose and Problem Solving

Technical documentation frequently contains code samples, which might be difficult to comprehend if they are not formatted properly.
This issue is resolved by the syntax highlighting feature, which gives code a more orderly and aesthetically beautiful representation.
By streamlining the process of identifying code components, it facilitates users' ability to discern between variables, keywords, and other code elements.

Inspiration from Docusaurus

Commonalities with Docusaurus

"text2page" recognizes code blocks in the documentation, much like Docusaurus does.
The use of themes and styles results in code that is rendered with improved visual clarity.
The method of implementing syntax highlighting rules and language recognition is consistent with Docusaurus practice's.

Points of Distinction from Docusaurus

Taking cues from Docusaurus, "text2page" could provide distinctive code display themes or styles.
It may come with unique configuration options that let users alter how code blocks look.
Depending on who the project is intended for, the available programming languages may change.

Enlightening Syntax Highlighting in Docusaurus

Vishnu Das Puthukudi — Tue, 31 Oct 2023 21:58:47 +0000

Docusaurus is a dynamic platform that works wonders for improving your project webpages and documentation. It's more than simply a static site generator.

Syntax Highlighting: Shedding Light on the Code

The technique of highlighting particular words and characters in source code to make it easier to read and comprehend is known as syntax highlighting.

The Anatomy of Syntax Highlighting

Including Prism.js
The renowned Prism.js package is used by Docusaurus to highlight syntax. The open-source syntax highlighter Prism.js is renowned for its versatility and wide language support.
Plugin Docusaurus
Very an exclusive plugin, Docusaurus integrates Prism.js with ease. Prism.js must be configured by the plugin in order for it to function with your documentation.
Component of a Code Block
Docusaurus makes use of a unique code block component to implement syntax highlighting. Code samples in your Markdown files are processed by this component, which then applies the proper syntax highlighting depending on the code language.
Code Blocks in Markdown

function greet() {
  console.log("Hello, world!");
}

Peeking into the Code
Let's now investigate how Docusaurus handles syntax highlighting inside the source. Here are a few salient points:

The Docusaurus configuration file, usually called `docusaurus.config.js}, contains the configuration for the Prism.js plugin.
Docusaurus interfaces with Prism.js by developing a unique code block component. This part is contained in the source code of Docusaurus.
To provide syntax highlighting, the code block component searches your code blocks for language tags and applies the appropriate Prism.js style.
To fit the aesthetics of your project, you may even add your own code themes and modify the Prism.js styles.