John Dykes

Full Stack Web and AI Developer


Featured Projects

  • LangPanel Project Thumbnail
  • WebAudio Synthesizer Project Thumbnail
  • Chinese Checkers Project Thumbnail
  • React Calculator Video Project Thumbnail

Recent Experience

  1. LangPanel

    Founder / May 2024 — Present

    • Developing AI powered translation application for comics
    • OCR AI model designed and trained using pytorch and proprietary text rendering library.
    • Models run in the browser with WebGPU, reducing costs
  2. Communications Security Establishment

    Cryptanalyst / September 2020 — May 2024

    • Implementing, evaluating cryptographic standards and algorithms
    • Other top secret cryptographic research
  3. Communications Research Centre Canada

    Computer Research Programmer / November 2019 — September 2020

    • Applied machine learning and Geo-computation to Telecommunications Data, including estimating the interference that cellular towers have on each other
    • Attended a 1-week long training course on machine learning using TensorFlow
  4. University of Waterloo

    Graduate Student / January 2019 — December 2019

My Favourite Tools

React JS

For creating awesome web apps

I use it for almost everything I make on the web, including this website!

  • Over five years of experience
  • Crafting lightning fast pages
  • Making interactive web apps

PostgreSQL

My SQL database of choice

Used by LangPanel, alongside the postgres provider Supabase.

Tailwind CSS

Making everything look pretty

For my styling needs, I often reach for Tailwind over plain CSS.

w-full md:w-auto inline-flex items-center justify-center px-6 py-3 border border-transparent text-base font-medium

w-full md:w-auto inline-flex items-center justify-center px-6 py-3 border border-transparent text-base font-medium

grid grid-rows-[auto_1fr] gap-y-6 grid-cols-1 col-span-1 bg-neutral-800 rounded-2xl border border-neutral-700 px-5 py-7 overflow-hidden group

grid grid-rows-[auto_1fr] gap-y-6 grid-cols-1 col-span-1 bg-neutral-800 rounded-2xl border border-neutral-700 px-5 py-7 overflow-hidden group

row-start-2 col-start-1 w-3/4 self-end justify-self-center transition-all duration-500 mt-1 text-sm text-neutral-400

row-start-2 col-start-1 w-3/4 self-end justify-self-center transition-all duration-500 mt-1 text-sm text-neutral-400

grid grid-rows-[auto_1fr] gap-y-6 grid-cols-1 col-span-1 bg-neutral-800 rounded-2xl border border-neutral-700 px-5 py-7 overflow-hidden group

grid grid-rows-[auto_1fr] gap-y-6 grid-cols-1 col-span-1 bg-neutral-800 rounded-2xl border border-neutral-700 px-5 py-7 overflow-hidden group

col-span-1 bg-neutral-800 rounded-2xl border border-neutral-700 px-5 py-7 mt-4 text-base text-neutral-100 w-7 fill-white stroke-none

col-span-1 bg-neutral-800 rounded-2xl border border-neutral-700 px-5 py-7 mt-4 text-base text-neutral-100 w-7 fill-white stroke-none

w-full h-full fill-neutral-700 group-hover:stroke-transparent group-hover:drop-shadow-neutral-400 drop-shadow-transparent drop-shadow-xs transition-all duration-500

w-full h-full fill-neutral-700 group-hover:stroke-transparent group-hover:drop-shadow-neutral-400 drop-shadow-transparent drop-shadow-xs transition-all duration-500

col-span-1 md:col-span-2 bg-neutral-800 aspect-video px-3 sm:px-5 py-5 sm:py-7 rounded-2xl border border-neutral-700 grid grid-cols-1 sm:grid-cols-2 overflow-x-clip group

col-span-1 md:col-span-2 bg-neutral-800 aspect-video px-3 sm:px-5 py-5 sm:py-7 rounded-2xl border border-neutral-700 grid grid-cols-1 sm:grid-cols-2 overflow-x-clip group

PyTorch

AI Powered Applications

Training custom AI models, or using existing ones withHuggingface.

Fastify

My go-to backend framework

Serverless is great, but sometimes you need a real backend. I default to Fastify.

Get In Touch