The tech tools I use

Tools

So I thought about sharing the tools I use personally or at work, so let’s start with,

Design tools

  • Adobe Illustrator for logos, icons, illustrations
  • Adobe XD, Invision Studio, Figma or Sketch for designing user interfaces & wireframes
  • Adobe Photoshop for editing pictures & memes :D
  • Adobe After effects for editing videos (I recommend Adobe Premiere Pro for editing videos & AE to add effects) but recently I switched to Final Cut Pro.
  • Dribbble/Behance for inspiration and work showcase.

Code

Let’s now get into the tools I use while coding:

The code editor I’m currently using is VSCode.

I share my code & look for inspirations on:

  • 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, docs, blog or even a large web app I use:

  • Gatsby and I deploy it on ZEIT Now

    Have used Jekyll and Pelican before, Willing to migrate to Next Js soon.

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, tailwind, Tachyons & made my own micro CSS framework called Unnamed that has over 200 stars on GitHub, but I prefer coding with vanilla CSS or CSS in JS using styled-components or CSS modules, because I enjoy styling my elements from scratch since the components are fully reusable with React. I have used Theme UI and styled-system as well, I do think they are good and useful.

If I’m making a web app, for the front-end I use the create-react-app boilerplate as it’s the official one from the team that made React Js but I always have to add react-router-dom or @reach/router, Redux (well not on the upcoming projects), Recompose (not needed anymore) & many other modules I use the most. So I made my own boilerplate to handle that. But recently I use one of my Gatsby starters depending on the type of the API I’m willing to request data from.

I use Git bash as my terminal when I’m on windows, iTerm2 with “oh my zsh” themes when I’m on macOS.

For the backend, I was using PHP/MySQL which I didn’t personally like, so I switched to Node js meaning that I currently use Express Js/Mongoose and Mongodb as a NoSQL database to make Restful APIs which I deploy on Heroku if it was a mvp and on a Digital Ocean droplet when it’s a fully working product. I made my personal boilerplate to speed up that process.

I sometimes use Firebase services when I’m too lazy to work on the backend and willing to explore cloud functions.

Currently, I’m slowly migrating to Prisma/Apollo to make and consume GraphQL APIs.

For native apps, I use React native to build mobile apps (Ios & Android). I also have a personal boilerplate that I use to speed up the process.

Growth

For growth, I focus more on building useful products that users really need in their lives then I simply share it on this blog, Product Hunt, Hacker news, Reddit and on social media.

Setup

Laptops

  • MacBook Pro 2017 touchbar (belongs to the company I work for)

    • Display: 15” retina screen
    • CPU: 2.8 GHz Quad-Core Intel Core i7
    • GPU: Radeon Pro 555 2 GB / Intel HD Graphics 630 1536 MB
    • Ram: 8GB LP DRR3
    • SSD: 250GB (the attached product has 512GB)

Equipment

Phones

  • For Android, I’m using the Google Pixel 2 with a Dbrand dragon skin

    • Android 10
  • For iOS, I’m using the Iphone 7

    • iOS 13.2

Previously, I was carrying only a Nexus 6p which I had to stop using due to these reasons

Cameras

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

Ai assistant

Currently, I’m using a Google home mini

VR

Google VR 1st gen headset

Full setup with pictures can be found here.