Github Copilot

GitHub Copilot is a sophisticated AI-powered developer tool that functions as an intelligent pair programmer, helping developers write code with greater efficiency and less manual effort. Unlike traditional autocomplete, it uses advanced large language models to understand the deep context of the project to suggest everything from single lines of code to entire functional blocks. By automating routine tasks and providing real-time technical guidance, it allows developers to focus more on high-level problem solving and architectural design.

Learning Points:

• Ensure Full Repo Understanding: Before implementation, provide Copilot with comprehensive context by indexing the repository and opening relevant files to ensure it understands the project structure and architectural decisions.
• Verify Understanding via Q&A: Use a Q&A section in Copilot Chat to clarify its internal logic and ensure it isn't making false assumptions about the codebase. Explicitly asking AI not to assume but to verify against actual files (like package.json or custom logic) prevents confident but incorrect "hallucinations".
• Provide Existing Code Examples: Feed Copilot snippets of the existing project patterns to ensure consistency across the codebase.
• Demand a Full Implementation Plan: Instruct Copilot to generate a step-by-step reasoning plan before it writes a single line of code. Breaking down complex tasks into atomic, verifiable steps allows developers to identify logical flaws in the AI's approach early on.
• Evaluate Multiple Solutions: Prompt Copilot to offer several distinct solutions so developers can evaluate the trade-offs in robustness and platform compatibility themselves. Moreover, developers can also provide some possible solution to Github Copilot for evaluation.

Resources:

• Github Copilot Documentation
• Voiceflow: How to Prevent LLM Hallucinations

CodeRabbit

CodeRabbit is an AI-powered code review tool that integrates directly into developers' GitHub Pull Requests (PRs). For team project, it acts as an automated "gatekeeper" that catches common mistakes before a human mentor reviews the code.

Learning Points:

• Learn automated context-aware reviews: CodeRabbit analyzes the entire repository to understand how a change in one file might break another, providing instant, comprehensive feedback on every pull request.
• Identify edge cases in PRs: It identifies potential issues, such as bugs that static analyzers miss, security oversights, and logic errors that only surface under specific conditions.
• Summarize complex changes: It automatically generates a summary and walkthrough of code changes, which is particularly handy for large PRs where context helps teammates understand the scope of the work.

Resources:

• CodeRabbit Documentation
• CodeRabbit: 10 Best Practices for GitHub Copilot

Claude Agent Skills

Claude Agent Skills is a specialized feature within the Claude ecosystem that allows developers to define and package complex, reusable behaviors as "skills" that the AI can invoke when needed.

Learning Points:

• Encapsulate Domain Logic: Developers can create specific skills that encapsulate the complex logic of their project, such as a "Scope-Parser-Skill" that handles the different scenario, ensuring the AI uses the most robust method every time.
• Modularize Intelligence: Instead of overwhelming the AI with a massive list of instructions, developers can break them into modular skills that the agent only activates when the context of the task requires them.
• Continuous Skill Refinement:. Developers can iteratively improve these skills by feeding the agent feedback from failed runs.

Resources:

• Claude Agent Skills Overview

Tool/Technology 1

List the aspects you learned, and the resources you used to learn them, and a brief summary of each resource.

Tool/Technology 2

...

Tool/Technology 1

List the aspects you learned, and the resources you used to learn them, and a brief summary of each resource.

Tool/Technology 2

...

GitHub Copilot

GitHub Copilot is an AI-powered coding assistant built by GitHub and OpenAI that helps programmers write code faster and with less effort.

Learning points:

• Give examples of existing code with similar functionality, to avoid hallucination and ensure the code quality is consistent across the codebase
• Properly describe the expected usage of the product which is not always obvious when implementing libraries and dependencies. This can affect the implementation method chosen.
• Ask for many possible solutions (ie. planning) and evaluate them yourself before deciding on one and guiding the AI tool to implement it.

Resources:

• GitHub website
• Agentic AI prompting: https://www.ranthebuilder.cloud/post/agentic-ai-prompting-best-practices-for-smarter-vibe-coding

Tool/Technology 2

...

Tool/Technology 1

List the aspects you learned, and the resources you used to learn them, and a brief summary of each resource.

Tool/Technology 2

...

GitHub Copilot

GitHub Copilot is a code completion and programming AI-assistant that assist users in their IDE. It uses LLMs can assist with code generation, debugging or refactoring through either real-time suggestions or language prompts

Key Learning Points:

• Context is King! Providing all relevant files immediately leads to faster, more accurate fixes. The AI performs best when it "sees" the full scope of the bug.

• Don't stop at the first working fix. Specifically, we can try asking the AI to improve code quality and clarity after the initial generation helps eliminate "AI-style" clutter and technical debt.

• Initial AI suggestions often prioritize the simplest fix. It still requires manually prompts & investigation for edge cases to ensure the solution is robust.

• We should treat AI as a collaborator, and not an automated system. Reviewing proposed changes and selectively implementing only what fits the project context prevents the introduction of unnecessary or incorrect logic.

Agent Skills

Agent Skills are folders of instructions, scripts, and resources that agents can discover and use to do things more accurately and efficiently. These skills are designed to be automatically founded and used by AI agents, providing them user-specific context they can load on demand hence extending their capabilities based on the task they’re working on.

Key Learning Points:

• Moving instructions from a giant system prompt into a SKILL.md file allows for "progressive disclosure," where the agent only loads the knowledge it needs for the specific task at hand.

• Provide a strict directory layout (Instructions in SKILL.md, automation in scripts/, and context in references/) to ensure the agent can reliably find and execute tools.

• Include specific trigger phrases & tags, as well as clear and well defined steps. This prevents the agent from guessing, thus ensuring it follows the exact logic required for the most effective application.

AI-Assisted Coding Tools

So far, I've experimented with many AI coding tools, incorporating them into my workflow and trying them out.

I've tried opencode, Mistral Vibe, Proxy AI, Github Copilot, Cline.

They can be divided into roughly two categories; AI tools that live in the CLI and those that integrate directly into IDEs. While their usage may be similar (many of them can inject context using slash/@ commands, in addition to other common features), their value can be quite different.

I've found that tools that integrated directly into IDEs were superior for engineering, provided that one does not enable settings such as "YOLO" mode (editing without permission). This way, you may review the AI's work file-by-file, and guiding it if its approach needs changing.

On top of that, leveraging plan/act modes, skills, and keeping context focused can improve model performance.

Resources: Cline documentation

Langchain

I learnt and used Langchain to create an AI workflow for the CSV classifier task.

Resources: Langchain documentation

AI Coding Tools

Skills

Worked with the team to explore adding repo-specific AI coding skills for common harnesses such as Claude, OpenCode and GitHub Copilot.

Subagents

Created subagents to handle specific tasks such as writing unit tests, generating documentation, and refactoring code.

Tool/Technology 1

List the aspects you learned, and the resources you used to learn them, and a brief summary of each resource.

Tool/Technology 2

...

Tool/Technology 1

List the aspects you learned, and the resources you used to learn them, and a brief summary of each resource.

Tool/Technology 2

...

Tool/Technology 1

List the aspects you learned, and the resources you used to learn them, and a brief summary of each resource.

Tool/Technology 2

...

Tool/Technology 1

List the aspects you learned, and the resources you used to learn them, and a brief summary of each resource.

Tool/Technology 2

...

Project Knowledge

RepoSense

Vue.js

resources Used:

• Vue mastery: complete 11 lessons to create a basic shopping cart frontend.
• Vue.js documentation

.zoom__day(v-for="day in selectedCommits", :key="day.date")

the :key attribute is a special directive used by Vue.js (which is being rendered by Pug) to uniquely identify each element in a looped list. It tells Vue which elements have changed, been added, or removed, allowing it to accurately update the DOM.

In Vue, custom events emitted with emit() from a child component can be listened to in the parent component using the @event-name syntax.

But they are only received by the immediate parent component.

Pug

Pug's parser is misinterpreting where the attribute value ends when you split it across lines. e.g.

:class="{warn: user.name === '-',
    'active-text': ...}"

The parser gets confused by the line break and the quote positioning. It's a quirk of how Pug tokenizes/parses attributes across multiple lines.

In pug, indentation defines parent-child relationships:

tooltip
  a.message-title        // child of tooltip
    .within-border       // child of a
  span.tooltip-text      // child of tooltip (sibling of a)

How does tooltip component know about tooltip-text? In style.css, we have:

  &:hover {
    .tooltip-text {
      opacity: 1;
      visibility: visible;
    }
  }

HTML

ESLint

Need cd into the frontend folder to run eslint commands.

cd frontend
npm run lint -- --fix

DevOps

GitHub Action workflow

Can set condition to only runs if:

• Push to master branch, OR
• Scheduled trigger (if enabled)

Does NOT run on pull requests (prevents deploying unreviewed changes)

deploy:
    needs: build
    if: (github.event_name == 'push' && github.ref == 'refs/heads/master') || github.event_name == 'schedule'

Summary of current github workflow:

• Push to master → Build report → Upload artifacts → Deploy to gh-pages → Live at GitHub Pages
• Pull request → Build report → Upload artifacts → (stop, don't deploy)

Gradle

Resources:

• DPE

Hot Reloading

Can make changes to frontend code and see the updates in the browser without needing to manually refresh the page.

AI in Development

Gemini integration for Java

resources Used:

• Gemini workshop for Java developers
• Offical Documentation: Gemini in Java with Vertex AI and LangChain4j
• Google Cloud

Copilot

In-line chat: use ctrl + shift + I to open copilot chat window.

Claude

Claude has this Claude Code, which can load folders from your local machine to its interface for code understanding and generation.

It also has a CLI tool.

Tool/Technology 1

Github Copilot

• The model used matters. Claude models are much more effective and understanding large code bases and the relationships between different components.
• Context matters. Conversations that drag for too long tend to hallucinate and give inaccurate answers.

List the aspects you learned, and the resources you used to learn them, and a brief summary of each resource.

Tool/Technology 2

...

Github Copilot

Learning points:

• Provide as much context as possible, using extensions (@), commands (/), and file context (#)
• Keep each chat focused on a relatively small objective
• Agent mode is powerful for complex tasks, and also good as an investigative tool compared to ask mode with findings given as a rich document
• Treat is as a pair programmer, explain and ask things as you would to a human partner
• It is easy to get lost changing codes since Copilot makes it much easier to debug and try things out quickly that it is worth the time to ask yourself if any changes should be part of another PR

Resources used:

• Github website
• Gemini and ChatGPT for additional help List the aspects you learned, and the resources you used to learn them, and a brief summary of each resource.

Tool/Technology 1

List the aspects you learned, and the resources you used to learn them, and a brief summary of each resource.

Tool/Technology 2

...

GitHub Copilot

• Effective for understanding a large codebase using #codebase, helping me to identify relevant directories and files for E2E test migrations

• Useful for generating repetitive or boilerplate files (e.g. SQL-specific E2E test JSON) when similar examples already exist

• Less effective at identifying logical errors, often fixing symptoms (modifying test data) instead of root causes (updating test logic)

• Struggles with browser-based E2E tests due to lack of awareness of actual UI state and rendered content

• May ignore constraints in prompts and go off-tangent, requiring careful supervision and iteration

• Different modes can serve different purposes: Ask/Plan for exploration, Edit/Agent for code generation

• Undo functionality is useful for restarting cleanly.

• Output quality can be inconsistent even with similar prompts, requiring manual verification (especially for strict JSON formats).

Data Migration

• Data migration can be approached either top-down (front to back) or bottom-up (back to front), depending on the situation.

  • Example dependency chain: DeleteInstructorActionTest → InstructorLogic → Logic → InstructorsDb.

  • Top-down approach (front to back): Starts from endpoints of dependency

    • Changes are usually non-breaking initially.
    • Risk of missing dependent components if the call chain is not fully traced.

  • Bottom-up approach (back to front): Starts from database or low-level components.

    • Changes are often breaking during migration and require iterative fixes.
    • Immediately reveals all affected files and dependencies.

  • The choice of approach should be made based on the scope, risk, and complexity of the migration task.

Tool/Technology 1

List the aspects you learned, and the resources you used to learn them, and a brief summary of each resource.

Tool/Technology 2

...

General Knowledge

Testing

• Additional logic in test case may introduce issues:
  • More logic to maintain & might diverge.
  • Depending on the frontend may cause tests to pass if the frontend code is buggy (false-positive).
  • Depending on the local test case external logic may mismatch with what the front-end expects.
• Be very particular about test cases (we want them to fail to spot bugs).
• Hard-coded test inputs allow full control of the desired outcome.
• UUID has a different format than long.
• The server depends on the docker status, so I need to run docker first.
• Back door APIs for testing aims to improve testing performance by providing a more direct way to perform API calls without going through the UI, for databases it allows direct manipulation to set up the exact db state the test requires. However, it may introduce security risks like allowing unauthenticated users to make API calls and false positives in test outcomes if front door API calling isn’t tested properly.
• TestNG: @BeforeTest and @BeforeMethod differences: @BeforeTest runs before the entire test class, @BeforeMethod runs before every @Test in the same class, same applies to @AfterTest and @AfterMethod. Source

Design Patterns

• Builder Design Pattern to allow separation of construction logic from the final product and enables flexibility in building variations of the same product.

Tips

• You can right click and inspect a web UI element to check its ID for debugging.
• You can terminate the E2E test early to keep a browser open, so when an E2E test fails, I can reload the previous browser to check the latest state of the failed E2E.
• Splitting a big PR into multiple smaller ones may cause the codebase to be in an non-ideal state (such as removing tests first will introduce a codebase with un-tested features), but fine if done in one go during the same iteration or migration. Other choices include defining the clear boundary of each small PR using commits within the same PR, or push the PRs into a separate branch before merging that branch into master.
• It’s possible to create a PR to fork’s master branch to run the CI privately.
• You can change the base branch that a PR merges into if you have write access.

Tools

Github Copilot

• Copilot is able to automatically scan similar files and all scripts related to them before writing the json file I need.
• Non-agentic AI like ChatGPT on browsers can be more useful in catching mistakes in scripts and less prone to hallucinations compared to agentic AI that have to deal with a large context frame.
• You can ask Copilot to access the git commit history on the current branch to check for potential bugs due to changes made.

VSCode

• To run the debugger on E2E tests (add –debug-jvm to the gradle command).
• To print statements when running tests using gradle (add –info to the gradle command).
• Possible to run “Convert Indentation to Spaces” in the command line in VSCode.
• Possible to run “Trim Trailing Whitespaces” in the command line in VSCode.

Git

• Can use keywords like Closes #<issue-number> or Fixes #<issue-number> to automatically close an issue when a PR is merged, but this doesn’t work in issues (an issue cannot close another issue).
• git switch -c <branch-name> to create and switch to the new branch, which was introduced solely for checking out branches, while ‘git checkout’ can be used for branches, commits, and files.
• You can create a new branch and make it track an upstream branch using git switch -c <branch-name> <upstream-name>/<upstream-branch-name>.
  • Example: To fetch a branch called chore/new-branch from the upstream repo and work on it locally, simply create a new branch of any name (preferably similar to better distinguish) and make it track that upstream repo branch.
  • Command line: git switch -c chore/new-branch upstream/chore/new-branch.
• Rebasing with -i (interactive) git rebase -i <target-branch>.
  • Rebasing to move the current commits on top of the HEAD of the target branch (i.e. doesn’t do anything if current branch is already on top).
  • Using interactive tag -i, we are able to edit/refactor the commits on the current branch and rebase will perform the operations.

TestNG

• Sometimes snapshots can be detected to be obsolete, especially if it doesn’t match the rendering anymore, run ng test --u to update snapshots.

Gradle

• Gradle runs tests parallelly which is much faster to run everything then a single suite which runs sequentially (Extremely slow).
• Github CI uses extensive powerful cores that scales dynamically and has fine-tuned resource control, which is why it runs so much faster than locally.

Hibernate

• Hibernate ignores inserted @UpdateTimestamp annotated attributes.
• @CreationTimestamp and @UpdateTimestamp are initialized automatically with the same initial value, then @UpdateTimestamp will update itself when the entry is updated. Source