The tech tools I use

Posted on:

Edited on:


A list of tools I use whether for:

  • Personal side projects
  • My full time job
  • Or working with clients

Design tools

  • Midjourney for logo, icon and illustration design
  • Figma for designing user interfaces & wireframes
  • Final cut pro for editing videos
  • Dribbble/Behance for inspiration and work showcase


The code editor I'm currently using is VSCode

I share my code & look for inspiration on:

  • Twitter
  • GitHub
  • Codepen
  • CodeSandbox

If I’m simply coding an interface that I might integrate into a web app I use plain HTML/CSS & vanilla JavaScript.

But if I'm working on a landing page, documentation website, blog or even a large web app I use:

Primary stack

  • Language: TypScript
  • Web framework: Next.js
  • Styling: Tailwindcss
  • Forms: Formik, Yup
  • Payments: Stripe
  • Web3: Rainbowkit, WAGMI, SIWE
  • Server state: React-query
  • Client state: Context, useReducer, useState, useContextSelector or libraries like Jotai/Zustand etc...
  • Next API routes or Serverless functions written in TypeScript
  • Headless CMS: Contentful
  • next-seo for SEO
  • Databases: Postgres or Mongodb (depending on the use case)
  • Server caching: Redis
  • ORM: TypeORM/Mongoose
  • API framework: Express or Fastify

I Have used CRA (create-react-app), Gatsby, Jekyll and Pelican previously, but prefer Next.js as it's clearly the winner here.

Side note for CSS, I’m cool to use what ever tech available out there that makes my task done quickly & well, I have personally used Bootstrap 3 & 4, Bulma, Lostgrid, Materliaze, Skeleton, Tailwindcss, Styled-components, emotion, CSS modules, Tachyons & made my own micro CSS framework called Unnamed that has over 200 stars on GitHub. Still I prefer using Tailwindcss.

To speed up development, I usually use the following boilerplates, some are open sourced some are not but will be available for sale soon.

More to be added

Mobile stack

React Native

I have used Ionic before, I didn't like it as much as RN.


  • Vercel using their GitHub intergration
  • Digital Ocean in a manual way
  • App Store / Play Store using Fastlane

Issue, expenses/income tracking and project management

  • Notion - for tracking everything
  • Linear - for tracking issues on some serious personal projects


  • Attijariwafa Bank
  • Mercury
  • N26



Don't longer ask for work laptop, it's frustrating to have to give it back.

  • MacBook Pro (14-inch, 2021)

    • Display: 14-inch (3024 × 1964) Built-in Liquid Retina XDR Display
    • Apple chip: Apple M1 Max
    • Ram: 32 GB
    • SSD: 2 Tb


  • Monitor: LG UltraWide 34WP85C
  • Keyboard: Keychron K2 (Hot-swappable) Wireless Mechanical Keyboard (Version 2)
  • Main Headset: Sony WH-1000XM4
  • Earphones: Apple Airpods
  • Microphone: NAN
  • Desk: TROTTEN Ikea desk
  • Mouse: Logitech MX Master 3
  • Trackpad: Apple Magic trackpad 2 gray
  • Mousepad: Sidorenko XXL Gaming Mousepad
  • Chair: Steelcase Gesture office chair with cover in onyx black with headrest
  • Webcam: Razer Kiyo


  • For iOS, I'm using the iPhone 13 Pro with a Dbrand Grip case and dragon skin which is my main phone
    • iOS 16
  • For Android, I'm using the Google Pixel 2 with a Dbrand dragon skin
    • Android 11


At the moment, I'm only carrying with me a GoPro hero 7 black edition limited edition


Oculus Quest 2


DJI mini 2


  • Nintendo Switch Oled with a Pro controller and a wirelss horipad
  • PS5 CD edition with 2 controllers
  • A PC Gamer (will share specs soon)

© Copyright 2016-2024 , All Rights Reserved by Smakosh LLC