DEV Community: Ifeanyi

My Buddy and I

Ifeanyi — Wed, 13 May 2026 16:33:04 +0000

This is a submission for the Gemma 4 Challenge: Build with Gemma 4

What I Built

I chose this project because as a kid (since age: 17) I have always had this vivid dreams of speaking with Elon Musk, he is kind of like my Idol and I would cherish the opportunity to have a conversation with him, until that day comes, this is what we would manage. When I came across this hackathon to test the lates model built by Google (Gemma 4) it was a no-brainer for me. I want the opportunity to understand the memory and context management of this model. I decided not to limit it to Elon Musk and included as much celebrities as possible. I want to give my friends the opportunity to test and use it.

Buddy is a web application that lets you have real, in-character conversations with iconic public figures such as athletes, billionaires, historical leaders, artists, and innovators. You pick a person, and the AI steps into their shoes completely. It speaks the way they speak, stays grounded in their real life and career, and refuses to break character.

Although, with this project I am not solving a problem like climate change or malaria cure, The problem Buddy solves is simple. Most AI chatbots are general-purpose. You can ask them anything, and they will answer as a neutral assistant. That is useful, but it is not immersive. Buddy flips that entirely. The AI is not an assistant anymore, it is a person. Ask Lionel Messi about his childhood in Rosario. Ask Steve Jobs why he believed design was everything. You get answers that feel like a real conversation, not a Wikipedia summary read back to you.

The experience Buddy creates is curiosity without friction. It is the feeling of sitting across from someone remarkable and just... asking them things.

Demo

Link: https://ifeanyi-buddy.netlify.app

Code

GitHub: https://github.com/MasterIfeanyi/google-gemma4-hackathon

How I Used Gemma 4

Buddy runs on Gemma 4 26B, accessed via OpenRouter using the google/gemma-4-26b-a4b-it:free model.

The choice of Gemma 4 over the smaller variants came down to one core requirement; persona consistency. Keeping an AI locked inside a specific person's personality across a full multi-turn conversation is genuinely hard. The model needs to remember who it is, match the person's tone and vocabulary, deflect off-topic questions naturally without sounding robotic, and stay grounded in real publicly known facts all at the same time. The smaller E2B and E4B variants are impressive for their size, but they tend to drift out of character more easily under pressure, especially when a user deliberately tries to break the persona with trick questions or unrelated topics.

The 26B model holds the character much more firmly. When you ask Messi a question in Spanish, it does not just translate, it responds with the rhythm and warmth of how Messi actually speaks. When you push Steve Jobs on a topic he would find irrelevant, it redirects with the kind of sharp confidence Jobs was known for. That level of nuance needs a bigger model.

One specific technical challenge worth mentioning is Gemma 4 does not support a native system role in its message format. To get around this, Buddy injects the personality prompt as a user / assistant turn pair at the very start of every request, effectively tricking the model into treating the persona as established context before the real conversation begins. The 26B model responds to this pattern reliably and stays locked in. Smaller models were noticeably less consistent with the same approach.

What Gemma 4 ultimately unlocked for Buddy was believability. Because the model is large enough to hold complex persona context across many turns, we never had to simplify the experience to make it work. We did not have to limit conversation length, restrict the types of questions users could ask, or hardcode fallback responses. The model handled edge cases we never explicitly planned for. When a user asked Messi to speak Spanish, Gemma 4 switched languages naturally and stayed in character at the same time, responding with the warmth and rhythm of how Messi actually communicates, without any instruction from us to do so. When users tried to break the persona with off-topic questions, the model deflected in the voice of the person, not with a generic AI refusal. That level of emergent, in-character behaviour is what a smaller model cannot reliably give you and it is what makes Buddy feel like a conversation rather than a demo.

Thank you.

Google Next '26 - My thoughts

Ifeanyi — Tue, 28 Apr 2026 08:01:47 +0000

This is a submission for the Google Cloud NEXT Writing Challenge

Introduction

I have been eyeing to participate in a DEV.TO hackathon for a while now and when I saw this come across my timeline, I jumped up excitedly. I want the badge of honor. The big focus for the Google Cloud NEXT event is on what Google is debuting in the A.I. race especially agents. The future of developing on the cloud is exciting !!

Keynote & Demos

In this article, I’ll break down the Developer Keynote because that stood out most to me and why.

I tuned in for the Developer Keynote (April, 23) which discussed building a marathon planning agent. A Gemini Enterprise Agent planned an entire Las Vegas marathon experience, coordinating hotels, routes, schedules, and logistics using multiple connected agents.

Demo 1 (Mofi Rahman) - Building agents with Agent Platform

We can design an agent in agent designer. When building an agent you need three things: Instructions; to help the agent understand its role as the marathon planner. Skills; help the agent progressively understand what is available to the agent to complete the work. such as using Google maps, handling Geo-spatial data. Map skills can make your agent an expert at using Google maps.

Recap

Give the agent a prompt
Agent loads the skills
Agent executes the tools to find viable routes.

What this means for developers

For developers, this means they can build specialized AI agents by composing three core components: instructions, skills, and tools, rather than writing complex logic from scratch. The agent designer platform handles how the agent loads skills, processes prompts, and decides which tools to call, so developers can focus on defining what the agent should do.

Demo 2 (Ivan Nardini & Casey West) - Creating multi-agent systems

We have a planner agent that needs to talk to 2 other agents: the simulator agent and the evaluator agent. The planner agent creates potential routes for the race. Evaluator sub-agent will judge routes based on specific criteria that we pick. Simulator agent works with the planner to get approved routes, run them and show results. How can we facilitate communication between all agents, we need two components; A2A protocol and agent registry.

A2A Protocol: Google introduced an open-source protocol called A2A protocol. This protocol eliminates API code to connect agents. Agents can just share a card that represents the capabilities of that agent.
Agent Registry: This is a directory where agents get registered and it resolves every agent identity and maps their specific skillset across the agent network.

What this means for developers

For developers, this means they can build multi-agent systems where agents communicate and collaborate without writing custom API integration code. The A2A protocol lets agents share capability cards with each other, while the agent registry acts as a directory that tracks every agent's identity and skillset across the network, so the planner, simulator, and evaluator agents can find and talk to each other automatically.

Demo 3 (Lucia Subatin & Jack Wotherspoon) - Enhancing agents with memory

When using gemini to do my job in the office, I usually copy all the files one-by-one and shove it into one prompt, in a bid to give gemini as much context as possible. For our planner agent we improve the context by giving it the ability to manage sessions, add memory and access other data sources. In this demo, we saw how we can use a skill to make the agent an expert at using alloyDB and vector functions. Basically what this Demo was showing is that by managing context efficiently and adding memory to our agent you can see the simulator agent adjust its route based on the memory and data it now had. The memory aspect comes from how the agent uses alloyDB together with vector functions to store and recall context from previous sessions, so it (alloyDB) behaves like a memory bank.

What this means for developers

For developers, this means they can replace the manual process of dumping files into a prompt by giving agents structured memory and database access instead. By connecting the agent to tools like AlloyDB and vector functions, the agent automatically manages its own context across sessions, so it can make smarter, more informed decisions without the developer having to feed it everything upfront.

Demo 4 (Megan O'keefe) - Debugging agents at scale

We all use console.log("here") to debug a point in our codebase, well in artificial intelligence, we can not do that but, Google provides tools for us to debug; Agent observability and Cloud assist investigation agent. Using these tools we will find and investigate the root cause of the error and then we will deploy a proactive fix. In this demo, we had an error and we were suggested a fix by the agent.

Error: The simulator agent is failing to call the gemini model API due to a request error. Something is wrong that the payloads were sending to the model.

Cloud assist prompt: Resume the Gemini cloud assist investigation about the simulator agent. What is wrong with agent.py

Fix: The agent is suggesting a fix that we add a token threshold parameter to our event compaction config so that we are periodically compressing context more often with each invocation. This is because we have a 1 million context token limit.

From this demo, I learned that Google cloud provides a full observability suite for agents - cloud assist, coding agent.

What this means for developers

For developers, this means they have a proper debugging suite for AI agents rather than guessing what went wrong. Google Cloud's observability tools let developers investigate agent failures, understand why an agent misbehaved, and get suggested fixes, so in this case the tool spotted that the simulator agent was hitting Gemini's 1 million token context limit and recommended compressing context more frequently to stay within that boundary.

Conclusion

Google Cloud NEXT made one thing clear: building AI agents is becoming a first class developer experience. You no longer have to stitch together APIs, manually manage context, or guess why your agent broke. Google is giving developers a full stack for agent development, from designing and connecting agents, to giving them memory, to debugging them when things go wrong. The A2A protocol, agent registry, AlloyDB memory, and Cloud observability tools all point in the same direction: agents are becoming software components that developers can build, scale, and maintain just like any other part of their stack. The marathon planner was just a demo but the underlying tools are real and they are ready to be used.

Outreachy May, 2026

Ifeanyi — Thu, 16 Apr 2026 00:20:49 +0000

Open source

I have been singing about open-source to my friends for about some time now. I write articles about it. I have done hacktoberfest (twice in 2022 & 2023). It has always been on my mind to take on the big 3 - MLH, Outreachy and G-Soc

Outreachy - initial applications

Alright, let me start by saying: "Thank you universe for the reminder at the eleventh hour". This is because I literally forgot that the initial applications for contribution phase for May-August, 2026 Outreachy internship had already started. It opened Feb 6 - Feb 13, 2026. I was only reminded by a random tweet from a stranger on the 11th hour (Feb 13, 2 pm). Applications closed by (Feb 13, 5 pm).

Interlude

Once you get selected after the initial applications, you would see different organisations, select the one that suits you best. I chose Mozilla firefox because it required knowledge of HTML, CSS, and JavaScript.

Outreachy - Contribution phase

Before you get selected as an intern with Outreachy, you need to take part in the contribution phase which lasts for about three (3) weeks. It actually ends today (March 20 - April 15, 2026).

I learned quickly how to use bugzilla to find issues on my own (I made sure to look out for bugs with the label good-first-issue) and how to create patches using phabricator. Bugzilla and Phabricator those words sound big and fancy but phrabicator is just a single line of code - moz-phab submit --single.

here is a sequence:

git checkout -b bug-2022414-array-profiles

git add "file name"

git commit -m "fix: migrations for profiles with backup enabled"

moz-phab submit --single

You submit a patch for a bug, you get feedback or review from a mentor and then you push again.

One thing I learned, always make sure that you checkout -b into a new branch from main so that the branch does not have unrealated histroy from other bugs or commits.

Outreachy - Final Application

In your final application, you would be asked a few questions, you are to write essays answering them, they ask about your experience with the organisation. Also, You need submit a timeline of the work you propose to do during the thirteen week internship. You look at the goal of the organisation and you outline how you intend to approach the task.

Benefits

My life is literally this meme and the best way to get a job is to have some experience under your belt, which the Outreachy internship will provide.

Thank you, please follow me.

This blog is only a single part, in a multi-series blog that I will write about my experience !!!

Stay tuned !!!

Useless project.

Ifeanyi — Mon, 06 Apr 2026 13:42:06 +0000

This is a submission for the DEV April Fools Challenge

What I Built

A button. Just a button.

You click it, and lines start crawling across your screen. 50 vertical lines and 50 horizontal lines slowly forming a grid of boxes like graph paper possessed by a ghost. That's it. That's the whole app. No data. No purpose. No redemption arc.

You can control how many lines appear, how fast they draw, and what color they are. You can also clear the grid and do it all over again, because apparently that's how you want to spend your time.

Demo

Code

MasterIfeanyi / grid-lines

How I Built It

Built with pure HTML5 Canvas, vanilla JavaScript, and zero regrets.

The core idea is simple, the canvas is just a blank piece of paper. I grab a "pencil" using getContext('2d'), pre-calculate all the x and y positions for each line by dividing the canvas width and height by the number of lines, store them in two arrays (verticals[] and horizontals[]), then draw them one by one using setTimeout so you can actually watch the chaos unfold in real time.

No frameworks. No libraries. No npm install. Just a canvas, a loop, and a questionable life decision.

Prize Category

Community Favorite.

Two worlds of mine colliding !

Ifeanyi — Wed, 18 Feb 2026 17:30:37 +0000

Ben Halpern for The DEV Team

Feb 18

A New Chapter: DEV is Joining Forces with Major League Hacking (MLH)

#news #devto #hackathon #discuss

388

Comments 106

6 min read

A must read on how to implement GitHub actions.

Ifeanyi — Sun, 18 Jan 2026 10:55:01 +0000

Ifeanyi

Mar 18 '24

GitHub actions example

#javascript #webdev #devops #githubactions

Comments

2 min read

Demistifying Nextjs

Ifeanyi — Sun, 18 Jan 2026 09:17:22 +0000

2026, Happy new year

It's been a while, my dear. I have been learning Nextjs by building an open-source project that is available for everyone to contribute at THOR.

In this article, I will try to demystify Nextjs

first, let's lay some ground work or establish some fundamentals.

Client vs Server

In Nextjs, you can have 2 types of components, namely (server) and (client) components. The server components will never run in the browser and they can be used to make calls to the backend or even directly to a DB. The client components can and will run in the browser, where you have access to localStorage and browser window, it is advisable to not have things such as API keys and secrets in the client components. To make a page a client component, you do this "use client".

File based routing

In Nextjs, you have "file-based routing" which means once a folder or file is created in /src/app directory it becomes a route that can be reached. example if I wanted a "community" route, I would create this /src/app/community/page.js. This will become a route that you can navigate to. Remember to add "use client", if you want the component to be a client component.

_components

In Nextjs, if you do not want certain components / pages that you create to become routes that can be accessed i.e You want to create components such as ToggleButton.jsx, Sidebar.jsx, NavbarLayout.jsx, Avatar.jsx etc. all of these are components that can be reused but I don't want them to become "routes", you can create a folder like this _components and every component you create inside that folder will never be route.

Fetch API

In Nextjs, if you want to make requests that involves API_KEYS or SECRETS to the backend or database, it is advisable to do that from a server component, and gone are the days of getServerSideProps, getStaticParams, and getStaticProps. now you can just use the native fetch API in Javascript to make those requests and you can mimic those behaviours using


const data = await fetch('https://api.example.com/data', {...options})

Here are some options.

Want fresh data every time? → cache: 'no-store' - this used to be getServerSideProps

Want cached data? → cache: "force-cache" - default behavior, similar to getStaticProps

Want periodic revalidation? → next: { revalidate: seconds } - this used to be getStaticProps with revalidate (ISR)

These 3 used to scare me so much, gosh !!!

route group

In Nextjs, if you have a bunch of files or folders and you want to group them for organization and readability, you can create a folder like this (docs) which will contain all of them to keep your workspace neat. e.g src/app/(docs)/content/page.js. This way you have many files in one place.

Thank you, Please follow me

Twitter

Navbar scroll event

Ifeanyi — Sat, 19 Jul 2025 10:09:31 +0000

Today, I want to show you how I darken the navbar when a user scrolls on the website.

THE SECRET

I am using an event listener scroll which I attached to the navbar to listen for when the user scrolls beyond a certain screen size. This will allow the text on the navbar to be readable.

Using JavaScript, we add two classes to the navbar

bg-dark: this will give the navbar a dark background. I believe this is an in-built bootstrap class.
slow: this will add animation to make the navbar slowly darken.

HTML

<!--NavBar-->
<nav class="navbar navbar-dark py-3 navbar-expand-lg fixed-top">
    <div class="container">
        <a href="#" class="navbar-brand">
            <img src="./img/halo-logo.jpg" class="img-fluid logo" alt="">
        </a>

        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navmenu">
            <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse" id="navmenu">
            <ul class="navbar-nav me-auto">
                <li class="nav-item">
                    <a href="#home" class="nav-link active">GAMES</a>
                </li>
                <li class="nav-item">
                    <a href="#news" class="nav-link">NEWS</a>
                </li>
                <li class="nav-item">
                    <a href="#about" class="nav-link">ESPORTS</a>
                </li>
                <li class="nav-item">
                    <a href="#occupation" class="nav-link">COMMUNITY</a>
                </li>
                <li class="nav-item">
                    <a href="#occupation" class="nav-link linkarrow">SUPPORT<i class="ri-arrow-right-up-line"></i></a>
                </li>
                <li class="nav-item">
                    <a href="#occupation" class="nav-link linkarrow">GEAR<i class="ri-arrow-right-up-line"></i></a>
                </li>
            </ul>
            <a href="#footer" class="btn btn-brand">GET HALO</a>
        </div>
    </div>
</nav>

CSS


.slow{
    @include transition-ease;
}

@mixin transition-ease{
    transition: all 1.4s ease;
}

JavaScript


const nav = document.querySelector("nav");

window.addEventListener("scroll", () => {
    if (window.scrollY > 100) {
        nav.classList.add("bg-dark", "slow")
    } else {
        nav.classList.remove("bg-dark", "slow")
    }
})

Explaination

we capture the navbar using DOM manipulation.
we add an event listener to the browser window to listen for when a user scrolls beyond 100 vh.
we add the classes "bg-dark" and "slow" to the navbar.

Thank You, Please Follow me.

Firebase: My negative Experience

Ifeanyi — Sat, 05 Jul 2025 21:56:43 +0000

I am working on a website that will allow a user to login and upload images to his website through a dashboard.

Problem 1

The first issue that I ran into was firebase SDK. I could not use npm packages directly in HTML/CSS. I had to use firebase SDK like this:


import { initializeApp } from "https://www.gstatic.com/firebasejs/11.8.1/firebase-app.js";
import {getAuth, onAuthStateChanged } from "https://www.gstatic.com/firebasejs/11.8.1/firebase-auth.js";

Here is a Fix:

Upgrade Firebase SDK - Make sure you're using the latest versions:

npm install firebase@latest

Problem 2


const firebaseConfig = {
    // authDomain: "oleru-young.firebaseapp.com",
    // storageBucket: "oleru-young.firebasestorage.app",
};

After enabling Storage, you'll see the bucket name in the Firebase Console. It will look like one of these:

oleru-young.appspot.com (older format)
oleru-young.firebasestorage.app (newer format)

This caused a lot of confusion, if you were wondering the newer format is the correct thing to follow.

Problem 3

CORS - I had to battle with this error


Access to XMLHttpRequest at 'https://firebasestorage.googleapis.com/v0/b/oleru-young.appspot.com/o?name=uploads%2F11f20756a8694b63b7ee0645cde15e2e.jpg' from origin 'http://127.0.0.1:5500' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

means your browser is blocking the request to Firebase Storage due to a CORS (Cross-Origin Resource Sharing) issue. Here’s how to fix it.

Here is a fix

Step 1:

Create a cors.json file in your VScode project and add the following syntax

[
  {
    "origin": ["*"],
    "method": ["GET", "POST", "PUT", "DELETE", "OPTIONS"],
    "maxAgeSeconds": 3600,
    "responseHeader": ["Content-Type", "Authorization"]
  }
]

Step 2:

Using your terminal in VScode, you need to login to google cloud by using the terminal

gcloud auth login

If you're working on a project and want to set the active project after logging in, you can run:

gcloud config set project [PROJECT_ID]

Replace [PROJECT_ID] with your actual Google Cloud project ID.

CORS

Set the CORS policy for your project by running this


gcloud storage buckets update gs://[PROJECT_ID].firebasestorage.app --cors-file=cors.json

Problem 4

Firebase Storage Rules

You need to set the rules for the bucket. When you are creating the bucket for the first time. You need to choose test mode. This will allow read and write access to the bucket for up to 30 days.

A firebase bucket looks like this.

rules_version = '2';


service firebase.storage {
  match /b/{bucket}/o {
    match /{allPaths=**} {
      allow read, write: if true;
    }
  }
}

Use something permissive for testing (not production-safe):

Google Cloud Auth Issue

Ifeanyi — Sun, 01 Jun 2025 12:10:16 +0000

Copying file://kitten.png [Content-Type=image/png]... ServiceException: 401 Anonymous caller does not have storage.objects.create access to the Google Cloud Storage object. Permission 'storage.objects.create' denied on resource (or it may not exist).

Steps to recreate it.

Having this issue while trying to copy a file to a new cloud storage bucket.

Download a cat image This will download the image for us.

wget https://cloud.google.com/storage/images/kitten.png

Try to copy the image to my cloud storage bucket

gsutil cp kitten.png gs://gcp-ifeanyi-tutorial

Now, we run into the issue stated above.

Steps to Resolve

gcloud auth login

Open your terminal and login to google cloud
Follow the prompt (Type Y for yes)
Copy the link provided in your browser
Select your google account and grant permission

After following the prompt you will be provided with a key that looks like this
4/9ANIR-c9k6BnlT ..........

Copy the key and paste it in your google cloud console
Try to run the previous command again

gsutil cp kitten.png gs://gcp-ifeanyi-tutorial

Load-balancing using docker and nginx

Ifeanyi — Mon, 17 Mar 2025 16:07:07 +0000

Let me be clear this article is not a tutorial on NGINX or Docker. Just how to setup Load-balancing using both (Nginx and Docker). I will be assuming pre-requiste knowledge of both subjects.

In this article, we will be looking at how to achieve load-balancing using nginx and docker. well, what exactly is nginx and what is docker ?

Understanding Load-balancing - A website can have millions of requests, which can cause a bottleneck and make the latency (response time) slow. We need a way to handle the millions of request, to do this we need to increase the number of servers.

NGINX

Nginx - is a web server that serves us web content.

Nginx can forward a user request to an available server. This is called (load balancing). Nginx chooses which server will handle user request at each time.

nginx.conf - the file to setup nginx


http {

upstream backendserver {
        # here, we can specify all the backend url, that we have.

        server 127.0.0.1:9000;
        server 127.0.0.1:9001;
        server 127.0.0.1:9002;
    }

server {
listen 8080;

location / {
            proxy_pass http://backendserver/;
        }

}

}

cd nginx - nginx

To start the nginx server

Docker

Docker - is a way to package your application, as a developer. This way another developer can quickly setup same application on their system without running into a lot of issues and errors along the way. A dockerfile comes with all of the necessary instructions needed to setup said application.

Now, Docker can host a nodejs web-server inside of a container for you, this way we can run multiple servers at once, just by spinning up multiple instances of docker containers.

I ran into a major problem when using dockerfile to spin up my containers.

Problem 1

The index.js file has changed, do I need to rebuild the dockerfile and if I do that, would I need to re-create new containers based off on the new docker image

Answer

The answer to that question was Yes, if the index.js file has changed, you need to rebuild the Docker image to include the updated code. After rebuilding the Docker image, you will need to recreate the containers based on the new image to run the updated code.

Doing this everytime feels repetitive and tiring.

Problem 2

Is there a way to automatically restarting your container every time a file has changed without the need to rebuild your image each time ?

Answer

The answer to that question was Yes, we have two ways or options to do that

Docker Compose
Mount Volumes

I would be looking into the second option for today, you can use Docker volumes to mount your local directory into the container. This way, any changes you make to your local files will be reflected in the running container without needing to rebuild the image.

So, we need a dockerfile that would contain information about the web-server.

# Uses node version 16 as our base image
FROM node:16

# Create app directory inside the docker image
WORKDIR /usr/src/app

# Copy package.json into the app directory of the docker image
COPY package.json ./

# Install dependencies
RUN npm install

# Copy our entire code into the app directory of the docker image
COPY . .


# Install nodemon globally
RUN npm install -g nodemon

# expose port
EXPOSE 3000

# Run app
CMD ["nodemon", "--legacy-watch", "index.js"]

I need to explain the dockerfile a bit

# Run app
CMD ["nodemon", "--legacy-watch", "index.js"]

This will ensure that nodemon automatically restarts the container when we make changes to our nodejs code locally.

Now, we can carry on.

Build the Docker image:

 docker build -t node-application .

Run the container with a volume mount:

We would have two docker containers running, so we would run this command twice.

(-e CONTAINER_NAME=web1): This is the environment variable to help us distinguish between each container.
(--name web1): This is the name of the container.
(-p 9001:3000): This is port-mapping, we expose the container's port (3000) to our local computer port (9000).

docker run -d -p 9001:3000 --name web1 -v C:\Users\PC\Documents\Documents\2025\nginx_tuts\server:/usr/src/app -e CONTAINER_NAME=web1 node-application

Nodejs

const express = require("express");

const app = express();

app.get("/", (req, res) => {
  console.log(`say nigga ${process.env.CONTAINER_NAME} hit`);
  res.send(`Hello World from ${process.env.CONTAINER_NAME}`);
});


app.listen(3000, () => {
  console.log("Server is running on port 3000");
});

This is how my basic nodejs-express server was setup

Thank you, please follow me

How to connect Git to GitHub

Ifeanyi — Thu, 20 Feb 2025 21:47:43 +0000

I bought a new laptop and I need to configure it properly. In this series, I will guide you, so that you can use if for programming.

In this article, I will guide you on how to install Git bash (adding a user account) and how to connect to GitHub so that you can upload (push) to your cloud GitHub Repo

1. Installing Git Bash:
Go to the official Git website: https://git-scm.com/downloads

2. Setting up a user account in Git:
After installation, open Git Bash and set up your user account with the following commands:

git config --global user.name "Barack Obama"
git config --global user.email "barack@gmail.com"

3. Connecting to GitHub:

Generate an SSH key (if you don't already have one):

ssh-keygen -t ed25519 -C "barack@gmail.com"

Press Enter to accept the default file location. You can choose to set a password or leave it empty. Now, you can start the SSH agent:

eval "$(ssh-agent -s)"

Add your SSH key to the agent:

ssh-add ~/.ssh/id_ed25519

run the following command and then copy the output, this is your public SSH key

cat ~/.ssh/id_ed25519.pub

Add the SSH key to your GitHub account:

Go to GitHub.com and sign in
Click on your profile picture in the top right and select "Settings"
In the left sidebar, click on "SSH and GPG keys"
Click "New SSH key"
Give your key a title (e.g., "My New Laptop")
Paste your public key into the "Key" field
Click "Add SSH key"

Hopefully, after following the steps stated above, you have successfully linked your computer to GitHub. To test this out, run a git clone command to clone a GitHub repository.

Clone your repository
If you do not have any repository, please feel free to clone mine.

git clone git@github.com:MasterIfeanyi/ifeanyi-coinnest-html.git

Summary

Now you should be all set up with Git Bash, connected to GitHub.

Thank you, please follow me