DEV Community: kamaaaal

I turned an old phone into a Linux homelab

kamaaaal — Sun, 21 Dec 2025 14:21:44 +0000

I wanted to set up a homelab and first explored Raspberry Pi boards. That search led me to postmarketOS, a Linux distribution for smartphones. OnePlus 6T had good mainline Linux kernel support in postmarketOS.

I found a OnePlus 6T where the display had been replaced with an LCD, lock and volume buttons weren’t very clicky. Even though it was a bit of a gamble, I bought the device out of curiosity to try postmarketOS.

Advantages of using OnePlus 6T as a homelab

The main advantage was the price — I bought this device for less than the cost of a Raspberry Pi 5 (excluding the power supply and case).

It also has a built-in battery, which effectively makes it a portable server and a relatively powerful processor for its size. The device even has a display, although it didn’t work in my case because it was an LCD replacement. postmarketOS currently supports the original AMOLED display, so I assume the display driver mismatch caused this issue.

these lines comes and goes randomly on reboots

Another major advantage was postmarketOS Edge. Unlike Android-based setups, postmarketOS provides a real Linux environment based on Alpine Edge, which is lightweight and minimal. The Edge version includes systemctl support and has relatively good compatibility with tools like k3s.

Workloads Running on the OnePlus 6T

llama.cpp – Using llama.cpp with Qwen2.5-Coder-0.5B, I was able to run a fast and efficient local LLM. The Qwen2.5-Coder-0.5B model is only around 650 MB, which makes it suitable for constrained hardware. With the Continue VS Code plugin, I could chat with the model directly from VS Code, although code autocompletion did not work reliably.

k3s

Setting up k3s was straightforward using the apk package manager. I ran Jellyfin inside the k3s cluster, Jellyfin is a media server similar to Plex.

I created a persistent volume and mounted it to the Jellyfin pod, where I stored my media files. Jellyfin also supports multiple users and SyncPlay, which is similar to Spotify Jam.

Headless Setup: Accessing the Device Without a Display

Since the device supports USB networking, I can connect it to any laptop and SSH into it. Through this connection, I configure and connect the device to a Wi-Fi network.

I also connect the OnePlus 6T to my main Android phone Hotspot and SSH into the postmarketOS device from there. This allows me to access my homelab even while traveling, and even in situations where I don’t have a laptop with me.

Is It Worth It?

This device has a lot of limitations.

Without a display, I always have to rely on another device to SSH into it.
Because of the ARM architecture, I am not able to run some Docker images.
Networking is the biggest challenge — I have to create flannel configurations and dummy network interfaces to make k3s work reliably on the OnePlus 6T hotspot. While doing this, I learn a lot about Linux networking.

However, many of these problems also exist with a Raspberry Pi. The main difference is that on a Raspberry Pi, I can install almost any Linux distribution, whereas on the phone I am mostly restricted to Alpine Linux through postmarketOS.

Finally

I did this mainly for fun and learning, and along the way I ended up with a setup that actually works. I can now use SyncPlay with friends, and the device runs reliably as a small, always on system.

This may not be a traditional homelab, especially since installing Linux on a phone is a different process, but it served its purpose. If you’re curious or have ideas for other workloads to try on this setup let me know.

I ll write follow-up posts with in-depth setup details for the workloads I run on this homelab.

Full stack Postgres

kamaaaal — Sun, 22 Jun 2025 12:43:32 +0000

I tried an experimental project with this stack:

Database – PostgreSQL
API – PostgREST
Templating language – pg_render
Front-end – of course SQL can't render buttons, so I used HTMX to avoid writing any JS and keep the stack constrained.

The Project:

A simple inventory app that lets you add items, increment or decrement their counters, and delete them when needed — basically a good old to-do-style app, but each item has a counter

Breaking It Down

Docker

I used Docker to keep things clean. Especially for pg_render, which isn’t available as a standard Postgres extension, Docker made setup much easier, so I leaned on this excellent example pg_render example let’s just say my Dockerfile is... heavily inspired.😉

Postgres

PostgREST is not a direct extension of PostgreSQL — it’s a separate application that connects to a Postgres database and exposes a RESTful API for all the available resources.

It automatically turns your tables, views into API endpoints that support standard operations like GET, POST, PATCH, and DELETE.

For custom logic, you can write RPC functions using PostgreSQL’s procedural languages. These functions can then be called through the API using the following pattern:

POST /rpc/function_name

PostgREST will handle the request and execute the corresponding function, returning the result as JSON.

Here’s the table that stores items of the app:

create table items (
    id serial primary key,
    name text not null,
    stock_count integer not null default 0,
    created_at timestamp default now()
);

PostgREST automatically exposes this as a REST resource at /items.

    GET /items — list all items
    POST /items — create a new item (with JSON body like { "name": "pen" })
    PATCH /items?id=eq.3 — update item with id = 3
    DELETE /items?id=eq.3 — delete item with id = 3
    POST /rpc/increment_stock — custom RPC function to increment stock_count for an item
    POST /rpc/decrement_stock — same, but decrements instead

pg_render

pg_render is a templating extension for PostgreSQL. It lets you render HTML templates with placeholders (using {{ }}) by filling them with values from a JSON object or a database row.

    render(template, row/json) – renders a single template

    render_agg(template, setof rows) – renders a list of rows into one big HTML string

Template used for item

insert into templates (id, template) values (
  'item',
  $$
  <div class="item-card" id="item-{{ id }}">
    <div class="item-info">
        <h4>{{ name }}</h4>
        <p>Stock: <span class="stock-count" id="item-{{ id }}-count">{{ stock_count }}</span></p>
    </div>
    <div class="item-actions">
        <button 
          hx-post="/rpc/increment_stock" 
          hx-vals='{"item_id": {{ id }} }' 
          hx-target="#item-{{ id }}-count" 
          hx-swap="innerHTML">+</button>

        <button 
          hx-post="/rpc/decrement_stock" 
          hx-vals='{"item_id": {{ id }} }' 
          hx-target="#item-{{ id }}-count" 
          hx-swap="innerHTML">-</button>

        <button 
          hx-delete="/items?id=eq.{{ id }}" 
          hx-target="#item-{{ id }}" 
          hx-swap="outerHTML">🗑️</button>
    </div>
  </div>
  $$
);

This can be rendered with render function

select render(
  (select template from templates where id = 'item'),
  i
)
from items i
where id = 1;

htmx

HTMX is a JavaScript library used on the client side to build dynamic web apps without writing JavaScript.

It provides JavaScript-like functionality by extending HTML with attributes like hx-post, hx-get, and hx-target to make API calls and update parts of the page.

HTMX follows the principle of hypertext-driven applications, where the server returns rendered HTML fragments instead of JSON, and the browser swaps them into the page.

HTMX POST to /items -> This triggers a POST request with body of {"name": "input_value"} when the form is submitted.

<form 
    id="create-item"
    hx-post="/items" 
    hx-trigger="submit" 
>
    <h3>Create New Item</h3>
    <input type="text" name="name" placeholder="Enter Item Name" required />
    <button type="submit">➕ Add Item</button>
</form>

Increase the count of an item and swap the latest count

<div class="item-info">
    <h4> {{ name }} </h4>
    <p>Stock: <span class="stock-count" id="item-{{ id }}-count">{{ stock_count }}</span></p>
</div>
<button 
        hx-post="/rpc/increment_stock" 
        hx-vals='{"item_id": {{ id }} }' 
        hx-target="#item-{{ id }}-count"
        hx-swap="innerHTML"> +
</button>

hx-post specifies the RPC function to be called.
hx-vals is the payload sent with the request.
hx-target points to the element where the response will be inserted.

The RPC call returns the updated count after incrementing, and that value replaces the content inside the target element.

create or replace function increment_stock(item_id int)
returns INTEGER
language sql
as $$
  update items
  set stock_count = stock_count + 1
  where id = item_id
  returning stock_count;
$$;

Wrapping up

GitHub link – https://github.com/kamaaaal/fullstack_pg

Nginx can be used to hide the /rpc/index route and serve the initial page as just /.

This project has a few limitations (bugs) as of now — for example, adding a new product doesn’t immediately reflect on the page and requires a manual refresh. This could be fixed by using a custom RPC function that returns the newly added item as rendered HTML.

I feel this is a pretty cool idea — would love to hear your thoughts on what kind of applications could be built with this stack.

The problem with Higher Order Array Functions (js)

kamaaaal — Tue, 15 Aug 2023 05:26:36 +0000

So What are higher order functions ?

Higher order functions are functions which accepts an argument as a function or a function which returns another function. In JS we use lot of HOF(Higher Order function) and functional programming patterns. some examples

I'm using use the term functions interchangeably with methods

Function accepting callback function
Array.map, Array.filter, Array.reduce

Function returning function
Function.apply, Function.call, Function.bind

Use cases

Functional programming patterns provide easier expressive way to write code. Using Array methods helps us a lot by not writing a for loop statements by ourselves.

Array Methods

const nums = [2,4,6];

// map
const squred = nums.map( (num) => num**2);

// filter (only even numbers)
const evenNums = nums.filter( num => num%2 == 0);

For loops

const nums = [2, 4, 6];
const squared = [];
const evenNums = [];

// map
for (let i = 0; i < nums.length; i++) {
  squared.push(nums[i] ** 2);
}

// filter (only even numbers)
for (let i = 0; i < nums.length; i++) {
  if (nums[i] % 2 === 0) {
    evenNums.push(nums[i]);
  }
}

Array Methods provide a easier way to create a new object with .map method and with filter we can create a new array with desired elements

Array methods returns themselves(Array object), Allowing us to chain them with multiple methods.

const nums = [2,4,6,10];
// square all numbers and then sum them
const result = nums.map( (num) => num**2 ).reduce((prev,curr) => prev+curr,0)

In the above code sample combining array methods and arrow function allows us to perform lot of operations in single line.

Obviously, it is more expressive and readable than traditional loops.

So What are my Concerns

My concerns raised whenever I'm chaining array methods. Chaining Array methods looks good to our eyes but not to the JS Garbage collector.

Let's tackle a simple problem. We have an array of numbers representing people's incomes. Our job is to calculate a 5% tax on incomes that are above 500 and then create a new array containing those incomes along with their corresponding taxes only.


const incomes = [200,300,600,800];

const output = incomes.filter((income) => income > 500).map((income) => (income * 5 / 100) + income);

console.log(output); // [ 630, 840 ]

The above is the straightforward implementation. but we miss out the fact that to get the desired output we loop through the whole array twice and an intermediate array is also created.

So algorithmically speaking as we loop through the array twice the algorithmic complexity is O(2*n) I know the constant gets dropped in Big O, but let me dramatize and That filtered array(intermediate) array has to be garbage collected by the v8.

What can be done

Chaining Array methods with smaller arrays will not cause much of performance impact. but when doing those with larger arrays we can write traditional loops instead of array methods, so that we don't have to loop through multiple arrays.

const incomes = [200,300,600,800];
const result = []
for (let i = 0; i < incomes.length; i ++){
    if (incomes[i] > 500){
        const withTax = incomes[i] + (incomes[i] * 5 /100)
        result.push(withTax);
    }
}
console.log(result); //[ 630, 840 ]

in the above we are processing only the incomes above 500 and just pushing them to result array. Of course, this looks little longer than the array methods implementation.

we can use for(of) loops or .foreach() to make it little nicer.

So is this the perfect implementation ?

This approach appears to be a good one. However, there is a potential issue with this code in the following line:

        result.push(withTax);

The .push method is used to add elements to an array, but internally, the JavaScript engine needs to make memory allocation calls to the operating system to allocate memory for the array. Making multiple operating system calls can be an expensive task, and this is abstracted by the .push method.

So, this should hold true for the .map implementation. But it's not the same. When we call the .map method on an array and the output array is going to end up with the same size, the V8 engine actually makes just one memory allocation call for the entire array.

Conclusion

so which is the faster way, It's always better to use HOF's if we are not chaining multiple methods. but I can't answer whether chaining multiple array methods or dynamically pushing elements into an array is faster. that might require multiple benchmarks and analysis.

I apologize if I made any grammatical mistakes.

Weird Type Coercions

kamaaaal — Sun, 19 Mar 2023 09:26:35 +0000

Hey Folks, I've been using multiple programming languages recently and I noticed the different behavior of type coercion in different languages.

JavaScript

We all know how weird is JavaScript so I'm not going to explain JavaScript type coercion lot.
but here is a simple snippet

"5" + 5 // results "55"
5 + []  // results "5"

here the number and Array[] are implicitly converted to a string,
so the behaviour is it does either addition or concatenation at certain operands.

Python and Typescript

Python and Typescript seems to be strict. they don't allow type coercion we need to explicitly convert them to a certain type to do addition or string concatenation.

Python

5 + int("5") # results 10, does addition. 
"5" + str(5) # results "55", does concatenation
5 + "55"     # throws TypeError

Typescript

5 + number("5") // results 10, does addition. 
"5" + string(5) // results "55", does concatenation

The above examples avoid unexpected behavior. but it may feel odd for others at first who had lot of experience with other languages.

CSharp / .NET

I've been learning asp.net Framework (2014) for my college semester. That's a sad story university never minds updating the curriculum.

back to CSharp, when I was writing an if else
statement checking for an empty string gave me an error saying that "Cannot implicitly convert type 'string' to 'bool' "

string emptyStr = "";

if (emptyStr){ //error : Cannot implicitly convert type 'string' to 'bool'  
   Console.WriteLine(emptyStr);
}

and i'm sorry for not including boilerplate "public static void Main" 🥺.

I didn't expect this because for a long time JavaScript, typescript and python were evaluating zeros(0) and empty string("") to be falsy. Then I realized that I didn't touch other typed languages for a long time 😅.

after this tried the same example in java got the same error. But the c++ evaluated empty string(char[]) as true because every pointer is evaluated to truthy value I guess. however, std::string throwed an conversion error.

After that I had a strong belief that Csharp is one of a safest strictly-typed language. That didn't last long.

Even though CSharp being strict on implicit conversion from converting string to bool.
It didn't care converting an int to string implicitly when using + operator

 string str = "no.";
 int num = 10;
 Console.WriteLine(num+str); // results no.10

Php

I'm currently doing a project in php for my friend. That's the reason made me to write this post.

Php has a dedicated operator for string concatenation which is ".". having a concatenation operator, it isn't a surprise that it implicitly converts an integer to string.

echo "Hello "."World"; // results "Hello World"
echo "Hello ". 10 ;    // results "Hello 10"

So, because of having a concatenation operator it doesn't allow "+" to do concatenation.

echo 10 + 10 ; // results 20
echo "Hello "+"World"; // Unsupported operand types: string + string

This seems to be somehow same behavior like other languages,but the next example isn't

$str1 = "10";
$str2 = "20";
echo $str1 + $str2; // results 20

Even though both the operand being string here, both of them are converted to integer because of the operator "+".

Without knowing this behavior, I tried to concatenate two strings containing a number 🙂.

I think I can't say it's a bad behavior , because it has a dedicated operator for concatenation, but still a newbie developer like me who have been practicing other languages for some time it seemed weird.

Thank you for reading this. I apologize for any grammatical errors in my writing.