DEV Community: Khokon M.

Run LLMs Locally: Build Your Own AI Chat Assistant

Khokon M. — Thu, 27 Mar 2025 19:01:25 +0000

This week, I explored how to run an AI chatbot locally using open-source models like CodeLlama with Ollama. The goal was to create an AI assistant that works entirely offline, just like ChatGPT, but without relying on any cloud-based services.

If you’ve never worked with LLMs before, don’t worry—this guide will take you from zero to a working local AI chat assistant step by step.

Step 1: Install Ollama

Ollama makes it incredibly easy to run open-source AI models on your own machine. If you haven’t installed it yet, just run:

curl -fsSL https://ollama.com/install.sh | sh

This will install Ollama and its dependencies.

Once installed, you can pull any model you want. For example, to download CodeLlama:

ollama pull codellama

Now you have an AI model running locally! 🎉

Step 2: Run Your First AI Query

To test it, simply run:

ollama run codellama "What is the capital of France?"

Your local AI will respond just like an online chatbot!

Step 3: Expose Ollama's API

Ollama provides an HTTP API at localhost:11434 to interact with models. You can send requests like this:

curl -X POST http://localhost:11434/api/generate \
-H "Content-Type: application/json" \
-d '{ "model": "codellama", "prompt": "What is 2 + 2?", "stream": false }'

This returns a JSON response with the AI’s answer.

Step 4: Build a Chat UI

Instead of using the command line, I built a React-based chat interface that connects to Ollama’s API and streams responses in real time. You can find the code here:

🔗 GitHub Repo

How It Works

✅ Sends messages to Ollama’s local API (localhost:11434).

✅ Streams responses in real time, so text appears word by word.

✅ Keeps chat history so the AI remembers context.

Step 5: Adding Context History

By default, each request is independent, meaning the AI forgets previous messages. To fix this, we send the full conversation history as the prompt.

1️⃣ Store messages in an array

2️⃣ Send the entire chat history as the prompt

3️⃣ Limit message history to avoid long input sizes

Here’s an example of a JSON request that includes previous messages:

{
  "model": "codellama",
  "prompt": "User: Hello!\\nAI: Hi there!\\nUser: How are you?\\nAI:",
  "stream": true
}

The AI now remembers context and responds accordingly.

Final Thoughts

Running LLMs locally is easier than ever. You now have a fully offline AI assistant that can chat like ChatGPT, but without sending data to external servers. 🚀

Next step? Adding persistent memory by storing chat history in a database!

Let me know if you try this! Would love to hear how it works for you. 🙌

Building an APK from Expo: Everything You Need to Know!

Khokon M. — Sat, 22 Feb 2025 11:48:16 +0000

I spent hours trying to export an APK from a React Native Expo project—without ejecting it.
It took me nearly half a day to figure out, so I’m writing this guide to save you the trouble.

Let’s dive straight into the commands you need

Steps to Build an APK from Expo

Alright, let's get straight to it. Follow these steps to build your APK without ejecting your Expo project.

1. Install Dependencies

First things first, make sure you have all the necessary packages installed:

npm install 
npx expo install expo-dev-client

2. Check for Issues (Optional)

If you want to make sure your project is in good shape before building, run:

npx expo-doctor

This will scan your project and let you know if there are any issues that might cause trouble during the build.

3. Fix Package Compatibility Issues (If Needed)

If you run into any package version mismatches, you can fix them easily by running:

npx expo install --fix

4. Build the Project

Now, if everything looks good, it's time to build the project. Run:

eas build --profile development --platform android

Make sure you're logged into your Expo account before running this command. If you don’t have one, create it from the official expo website.

By default, this will generate an .aab file instead of an .apk file. If you need an APK, there’s one more step.

Modifying `eas.json` to Get an APK

To get an APK instead of an AAB, you’ll need to modify your eas.json file. Here’s what it should look like:

{  
  "build": {  
    "production": {
      "autoIncrement": true,
      "android": {
        "buildType": "apk"
      }
    }
  }  
}

Once you've updated the eas.json file, run this command to generate the APK:

eas build --profile production --platform android

And that's it! Now you’ll have your APK file ready to install or share.

Wrapping Up

And that's it! You now have a working APK from your Expo project—without having to eject. Whether you're testing your app or distributing it outside the Play Store, this method keeps your workflow smooth and hassle-free.

If you found this guide helpful, share it with fellow developers who might be struggling with the same issue. Happy coding!

Please suggest a tech stack to build a brand new blog site!

Khokon M. — Thu, 10 Nov 2022 20:02:56 +0000

Hi there dev commiunity,
I am planning to start a personal blog shortly. i'm a little confused about which stack to pick for my blog. Please suggest which tech stack should I use with a one-liner reason.
Thanks in Advance
Khokon M.

Home office vs work office. What do you prefer and why?

Khokon M. — Fri, 17 Jun 2022 14:20:40 +0000

We had a chance to experience the work-from-home situation due to the pandemic. And currently, some of us are back in the office again, and some are still working from home.

Based on your experience, what do you prefer the most now? And why?

What are some advice for starting the first OSS?

Khokon M. — Fri, 10 Jun 2022 04:17:04 +0000

What advice would you like to give to someone planning to start his first open-source project?

Should I start an Open-Source on my profile or my organization profile?

Khokon M. — Thu, 02 Jun 2022 07:17:55 +0000

Hi,
I'm planning to start my first open source project. I am just a little bit confused about where should I host it. Please advice me on this.
My personal Profile: KhokonM
And my organization profile: Blog Desire

How do you define an ideal portfolio?

Khokon M. — Tue, 31 May 2022 17:59:39 +0000

Let's discuss portfolios today. I will engage the discussion with some questions. Here I go,

What do you think about some must-have sections for a good portfolio?
As a developer, what color combination would you love to use in your portfolio?
Do you prefer a simple portfolio, or do you like complex fancy works to show off skills?
Do you prefer to upload your detailed resume to your portfolio? If not, is it a privacy concern or something else?

Rate my landing page design and help me improve please!

Khokon M. — Mon, 23 May 2022 14:18:27 +0000

Hi there, Dev community. I mostly do backend stuff. But sometimes, for my own personal projects, I also need to design some front-end stuff.
But I think I'm pretty much bad at designing stuff. That's why today, I'm asking your opinion about my ability to organize things.
If you think the design is good, please let me know. Otherwise, please advise how I can improve.
Thanks in advance, guys!
Landing Page URL

Why quitting job articles are so popular?

Khokon M. — Mon, 16 May 2022 18:48:34 +0000

We often see people posting about quitting their job; I mean including all blogs and not just dev.to. And somehow, they manage to attract a lot of attention. What are your thoughts on this topic?
Is it like most people hate their job but don't have the courage to leave it so they seek inspiration in such blogs or something else?
Let us know know your thoughts on this. Let's have a meaningful discussion on this topic.

5 Chrome extensions you might have considered if you knew they exist

Khokon M. — Tue, 26 Apr 2022 16:05:51 +0000

There are thousands of Chrome Extensions available on the Webstore. And do we know all of them? Indeed, it's impossible to know about every single extension available on the Webstore. So, there's a chance that you haven't discovered every extension you need yet! So, today I'm going to introduce you to such 5 extensions that you haven't found yet, but I think you would have considered them if you knew about their existence. So, without further talking, let's get started!

30 Seconds of knowledge

Learning new things as a developer often comes with lots of barriers when it comes to learning new things. But this extension made things easier. Every time you create a new tab, this extension will fill the new tab with some piece of information that you can quickly look at. The tips are pretty short, so you don't have to spend much time learning them. Currently, it provides tips about some popular languages like c++, python, javascript, etc. What a great way to learn, isn't it? Download Link

Library Detector

How many times did you wonder like, "Wow! This site looks gorgeous; which libraries did they use to build this?" Well, this extension will make your life easier. Just get the extension, and every time you visit a website, it will tell you which libraries they used to build the website you're visiting. Pretty good, right? Download Link

Web Lock

Okay, Let's be honest. I developed this extension. So, it's a kind of promotion here 😁.
But I think this is an excellent fit for many of us. We all use app locks on our phones, right? Then what about the websites on our browser? This extension comes to play the role of app lock on your browser. So you can protect websites that hold your sensitive information like Gmail, Google Drive, Photos, etc. It's also an excellent fit for parents to prevent kids from accessing specific sites. I would love to hear back your feedback on this 🥰Download Link

Figma To Code

This extension is perfect for converting your Figma design into code. It enables you to prepare your design into React, Vue, or just regular HTML without much effort. Although it uses Anima to convert your design, Anima has an official plugin on Figma that you can install and use. Yet I think it's an excellent extension to consider. Download Link

Scripty

I've spent hours coding my Scriptify Chrome extension so that I can inject javascript to any website easily. And then I discovered there is already a similar extension available with much better features. The later I would have found this extension, the more time I would have spent on my extension. So if you're like me and want to customize or automate some task on a particular website or all, I suggest you grab the extension and make the best use of it. You won't regret it! Download Link

I know there are a lot of popular extensions available that deserve to be installed, but I tried to keep the list among unpopular extensions. Let me know if you have found any of them helpful. Cause that's my inspiration.

Do you know such an extension that deserves more attention? Let me know in the comment section, and I would love to check them out and will add them to the list.

You need a universal logger right now!

Khokon M. — Mon, 18 Apr 2022 15:25:23 +0000

How many loggers have you set up so far to keep track of events in your different projects? If you took more than a couple of seconds to answer this question, this article is for you. And if you were unable to answer the question, well, this article is definitely for you.

The Problem

For me, it was a kind of repetitive task that I had to set up loggers for every project. Sure enough, there are a good number of npm packages for logging available. But that still didn't satisfy me. Because I still need to visit each project to check its log. And suddenly, this started feeling like a burden to me. So I had to come up with a solution for this.

The Solution

So, what's the solution? The idea was straightforward. I just had to create a centralized logger and use it for all the projects. And let the centralized system handle everything else. Like, separating logs for each project. So I can peacefully focus on building projects only and not on loggers. That was quite fun, so here I am to share the journey as my #devjournal

How My Universal Logger Works?

First, I created a backend that will accept any logs, as long as the request contains an API Key and a log message. The idea is to send logs from all projects to this particular endpoint. And then, I created this interface to manage and handle all the submitted records from different projects. Now, as I'm putting all my logs from the various projects into one place, I had to make sure I could identify which log was coming from which project.

To do that, I created the API key system. So for each project, I will simply create an API key from my interface with just one click. And to supply logs from a project, I will use the particular API key I made for the project.

How I use the logger in different projects

As the primary goal of the whole project was just to simplify managing logs, I had to find the easiest way to use the logger on all projects. For that particular reason, I created an NPM package called kLogs

So, for each project, I install the package from NPM
npm install @khokonm/klogs
And wherever I need to take log, I write a few lines of code.
First, I require the npm package
const kLogs = require("@khokonm/klogs")
and after that, just a few lines of code for any logs. E.g.:

const Logs = new kLogs('MY_API_KEY_FOR_THIS_PROJECT');
const log = {
  "message": "This is a log message",
  "additional_info": {
    aJavascriptObject
  }
};
Logs.prepare(log);
Logs.send();

The message is the only required parameter, but I can pass all the optional parameters like source (string), medium (string), additional info(object) as well.

Conclusion

If you're like me and hate repetitive tasks too, I hope this idea will help you to better organize your logs in your next project. Any suggestions or improvement ideas are highly appreciated.

If you want to help me improve my logger or use my logger for your project. You're most welcome. You can make a pull request to this repo, and I will be more than happy to merge it with my original work.

And if you want to use the interface to manage your logs, please visit logs.khokon.dev

How to password protect any website?

Khokon M. — Mon, 28 Mar 2022 13:37:06 +0000

Your browser is the new treasury of your personal data. Especially sites like google photos, email, etc. And there is no wonder that we share our devices with people close to us. Even if we have to share the device with someone, it’s not necessary to share the personal data it holds. When it comes to social media sites, you simply can just log out of the site and make sure no one can sneak around your social media while using your device. But what about services you don’t want to log out of but rather have another safety layer? In such a case, we can password protect websites in our browser. So no unwanted people can have access to the websites we don’t want them to. Luckily, we have a solution for this particular problem. Let’s jump into the content yey!

Web Lock

We lock is password protection for websites, just like the app lock we use on mobile devices. Except, this is a browser extension. You can get the extension from the chrome web store, which supports all chromium-based browsers like Microsoft Edge, Brave, Vivaldi, etc. So if you’re using one of them, you can simply install the extension from here. The extension will soon be available for other browsers like Firefox as well.

Setup Password

After you’ve installed the extension successfully, click on the extension icon from your browser and it will open a password setup page. Like the screenshot below.

On the first box, type your email address, this email will be used to reset your password if you ever forget it. But hopefully, you won’t 😀

The next two boxes are for passwords, you have to type the same password on both boxes. Once you’ve set up the password, you’ll be asked to log in using your password.

Protect Websites

Once you’ve logged in to the extension dashboard, you’ll see a screen like this.

All you need to do now is enter your desired website’s URL in the box and press enter. For example, I can put https://www.blogdesire.com in the box to protect my site from unwanted visitors, as I have admin access to the site 😀

So, next time someone tries to visit blogdesire.com from my browser, they will be asked to enter a password before they can access the site. Just like this.

That’s it. I hope you found the article helpful. If you’re having any issues with the extension or with the article, you can just let me know in the comment section. Thanks

DEV Community: Khokon M.

Run LLMs Locally: Build Your Own AI Chat Assistant

Step 1: Install Ollama

Step 2: Run Your First AI Query

Step 3: Expose Ollama's API

Step 4: Build a Chat UI

How It Works

Step 5: Adding Context History

Final Thoughts

Building an APK from Expo: Everything You Need to Know!

Steps to Build an APK from Expo

1. Install Dependencies

2. Check for Issues (Optional)

3. Fix Package Compatibility Issues (If Needed)

4. Build the Project

Modifying eas.json to Get an APK

Wrapping Up

Please suggest a tech stack to build a brand new blog site!

Home office vs work office. What do you prefer and why?

What are some advice for starting the first OSS?

Should I start an Open-Source on my profile or my organization profile?

How do you define an ideal portfolio?

Rate my landing page design and help me improve please!

Why quitting job articles are so popular?

5 Chrome extensions you might have considered if you knew they exist

30 Seconds of knowledge

Library Detector

Web Lock

Figma To Code

Scripty

You need a universal logger right now!

The Problem

The Solution

How My Universal Logger Works?

How I use the logger in different projects

Conclusion

How to password protect any website?

Web Lock

Setup Password

Protect Websites

Modifying `eas.json` to Get an APK