DEV Community: Victor Osaikhuiwuomwan

I Built a Testable Profile Card Using Only Vanilla HTML, CSS & JavaScript

Victor Osaikhuiwuomwan — Thu, 16 Apr 2026 20:14:29 +0000

Hey everyone,

I recently completed a frontend challenge to build a Profile Card using only plain HTML, CSS, and JavaScript — no frameworks allowed.

The requirements were quite strict. I had to include specific data-testid attributes on every key element so the automated tests could verify everything easily. The card needed to show a name, bio, avatar, live epoch time in milliseconds, social links, hobbies, and dislikes.

I focused on making it responsive: it stacks cleanly on mobile and switches to a side-by-side layout with the avatar on the left on larger screens using CSS Grid.

Accessibility was important to me too — I added meaningful alt text, made sure all links are keyboard navigable, and used aria-live for the updating time.

The live time was implemented with Date.now() and refreshes every 600ms. After finishing the card, I wrote Playwright tests to automatically check all the requirements, and they all passed.

Live Demo: https://profile-intelligence-service-beige.vercel.app/

GitHub: https://github.com/victorion0/profile-card

It was a good exercise in paying attention to details and writing testable, accessible code with just the basics.

Would love to hear your thoughts or suggestions!

From zero to $10M empire!” – Me & my future yacht!

Victor Osaikhuiwuomwan — Sat, 29 Nov 2025 21:23:56 +0000

I Built a Task Manager Empire in One Day — And Deployed It for Free!

Okay, maybe not $10M yet… but I shipped a complete Task Manager API with Node.js, Express, MySQL — and it’s already live on the real internet, 24/7, for exactly $0.

Here’s the live empire 👑

🔗https://task-manager-empire-victorion014-z7znahfd.leapcell.dev

Go ahead, spam GET /api/tasks — it’s serverless, I literally pay nothing 😎

Why I Built This (The Quick Origin Story)

I was grinding backend with freeCodeCamp and wanted a project that checks every box:

Real database (no fake JSON files)
Actually live on the internet forever
Costs me $0 forever
Looks amazing on my GitHub and resume

So I built Task Manager Empire in a couple or more crazy days — and now I’m giving you the full blueprint so you can clone and flex your own empire in under 10 minutes.

Tech Stack (Simple, Free, Powerful)

Layer	Technology
Runtime	Node.js v20
Framework	Express.js
Database	MySQL via PlanetScale
Hosting	Leapcell.io (serverless)
Dev Tools	nodemon, Postman, Git

Zero lock-in. Zero cost. 100% production-ready.

API Endpoints (Clean & RESTful)

Method	Endpoint	Description
GET	`/api/tasks`	Get all tasks
POST	`/api/tasks`	Create a new task
PUT	`/api/tasks/:id`	Update a task
DELETE	`/api/tasks/:id`	Delete a task

Try It Live Right Now!

Create an epic task:


bash
POST https://task-manager-empire.leapcell.app/api/tasks
Content-Type: application/json

{
  "title": "Buy Lambo",
  "description": "After this post goes viral"
}

You’ll get back:json

{
  "id": 123,
  "title": "Buy Lambo",
  "description": "After this post goes viral",
  "status": "pending",
  "created_at": "2025-11-29T23:59:59.000Z"
}

Feel free to break it — it auto-scales and costs me nothing!!!

Project Structure (No Confusion)

task-manager-empire/
├── server.js                    # Entry point
├── config/db.js                 # PlanetScale connection
├── routes/tasks.js              # All routes
├── controllers/taskController.js# Logic
├── leapcell.yml                 # Deployment config
├── .env                         # Secrets (gitignored)
├── package.json
└── README.md

Run Your Own Empire Locally (5 minutes)bash

git clone https://github.com/victorion0/task-manager-empire.git
cd task-manager-empire
npm install

Create your .env file (get free credentials from PlanetScale):

DB_HOST=xxxxxxxx.us-east.connect.psdb.cloud
DB_USER=xxxxxxxx
DB_PASSWORD=xxxxxxxx
DB_NAME=taskmanager
DB_PORT=3306

Then: bash

npm run dev

API runs at http://localhost:5000 Deploy in 60 Seconds on Leapcell.io (Free Forever Plan)Push your code to GitHub  
Go to https://leapcell.io → New Project → Connect your repo  
Add the same PlanetScale env vars  
Click Deploy

Done. Your empire is live forever. No credit card needed. 

What’s Next for the Empire? 

User authentication with JWT
React frontend (already sketching it)
React Native mobile app
Email/SMS reminders
Pro plan: $5/month for unlimited tasks + golden crown badge

Final Words: This is a backend project that actually lives on the real internet, scales automatically, and costs nothing to run. If you're learning Node.js, Express, or backend in general — stop watching tutorials all day. Build your own empire today. Star the repo if this helped you
https://github.com/victorion0/task-manager-empireFollow me for more “zero to hero” projects, and drop a comment:

What should the empire conquer next?

#nodejs #beginners #webdev #api #mysql #serverless #javascript #programming

My First RESTful API: A Beginner's Journey

Victor Osaikhuiwuomwan — Sun, 19 Oct 2025 23:36:15 +0000

On October 20, 2025, I built my first RESTful API with Node.js and Express. Here's my journey!

The Task

Create a GET /me endpoint with:

Profile: victorosaikh@gmail.com, Victor Osaikhuiwuomwan, Node.js/Express
Dynamic UTC timestamp
Random cat fact from https://catfact.ninja/fact

My Process

Setup: Installed Node.js, VS Code, and ran npm init -y.
Coding: Built an Express server with Axios for cat facts.
Debugging: Fixed SyntaxError: Unexpected token '(' and Git branch mismatch (master vs main).
Testing: Tested with curl http://localhost:3000/me.
GitHub: Added .gitignore, README.md, and pushed to main branch.
Deployment: Deployed on Railway.
Documentation: Fixed missing README.md issue and wrote this post.

Challenges and Lessons

Challenge: Git branch mismatch (master vs main).
Lesson: Align local and remote branches with git branch -m.
Challenge: Missing README.md in GitHub.
Lesson: Verify commits and pushes to the correct branch.

Try It Out!

Live Demo: profile-api-production-94d0.up.railway.app
GitHub Repo: https://github.com//profile-api/victorion0

Screenshots

What’s Next?

I want to explore databases or more endpoints. Tips?