thomasjbutler.github.io

KO | EN

gitlite — search

#javascript #python #hacktoberfest #react #llm #golang #go #android #rust #linux #nodejs #kubernetes #pytorch #openai

thomasjbutler.github.io

(★ 13)

Personal Portfolio Website Built From Scratch (React, TypeScript, HTML, CSS, JS)

thomasjbutler.github.io Latest Version Download

Download Latest Version (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

## About Me

My passion is to build human orientated applications that feel natural and joyful to use, and empower humanity by harnessing the power of AI, by saving time and energy on day to day tasks.

I'm currently focused on creating AI integrated systems, building ethical AI models, and Next.js/React web applications as a secure front-end.

[![Commercial Portfolio](https://img.shields.io/badge/Commercial%20Portfolio-View-006400?style=for-the-badge&logo=matrix&logoColor=white)](https://thomasjbutler.me)
[![Personal Portfolio](https://img.shields.io/badge/Personal%20Portfolio-View-006400?style=for-the-badge&logo=matrix&logoColor=white)](https://thomasjbutler.github.io/ThomasJButler/)

## Featured Projects

- **SQL-Ball** – RAG-powered NL-to-SQL using a custom collated dataset of European football results. [GitHub →](https://github.com/ThomasJButler/SQL-Ball)
- **AgenticAICoursePortfolio** – Portfolio of web apps from the Generative AI & Agents Bootcamp. [GitHub →](https://github.com/ThomasJButler/AgenticAICoursePortfolio)
- **The Matrix Arcade** – Collection of custom-built games in the style of “The Matrix.” [GitHub →](https://github.com/ThomasJButler/The-Matrix-Arcade)

## My Tech Stacks

<table align="center">
<tr>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=react" width="48" height="48" alt="React" />
<br>React
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=typescript" width="48" height="48" alt="TypeScript" />
<br>TypeScript
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=vite" width="48" height="48" alt="Vite" />
<br>Vite
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=python" width="48" height="48" alt="Python" />
<br>Python
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=django" width="48" height="48" alt="Django" />
<br>Django
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=nodejs" width="48" height="48" alt="Node.js" />
<br>Node.js
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=dotnet" width="48" height="48" alt=".NET" />
<br>.NET
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=cs" width="48" height="48" alt="C#" />
<br>C#
</td>
</tr>
<tr>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=postgresql" width="48" height="48" alt="PostgreSQL" />
<br>PostgreSQL
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=mongodb" width="48" height="48" alt="MongoDB" />
<br>MongoDB
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=supabase" width="48" height="48" alt="Supabase" />
<br>Supabase
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=docker" width="48" height="48" alt="Docker" />
<br>Docker
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=aws" width="48" height="48" alt="AWS" />
<br>AWS
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=azure" width="48" height="48" alt="Azure" />
<br>Azure
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=vercel" width="48" height="48" alt="Vercel" />
<br>Vercel
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=tailwind" width="48" height="48" alt="Tailwind" />
<br>Tailwind
</td>
</tr>
<tr>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=tensorflow" width="48" height="48" alt="TensorFlow" />
<br>TensorFlow
</td>
<td align="center" width="96">
<img src="https://cdn.jsdelivr.net/gh/devicons/devicon/icons/scikitlearn/scikitlearn-original.svg" width="48" height="48" alt="Scikit-learn" />
<br>Scikit-learn
</td>
<td align="center" width="96">
<img src="https://www.svgrepo.com/show/306500/openai.svg" width="48" height="48" alt="OpenAI" />
<br>OpenAI
</td>
<td align="center" width="96">
<img src="https://cdn.worldvectorlogo.com/logos/langchain.svg" width="48" height="48" alt="LangChain" />
<br>LangChain
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=css" width="48" height="48" alt="CSS3" />
<br>CSS3
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=html" width="48" height="48" alt="HTML5" />
<br>HTML5
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=git" width="48" height="48" alt="Git" />
<br>Git
</td>
<td align="center" width="96">
<img src="https://skillicons.dev/icons?i=vscode" width="48" height="48" alt="VS Code" />
<br>VS Code
</td>
</tr>
</table>

## Credentials & Specialisations

### Qualifications
- **AWS Qualified** | **Azure Qualified** | **Cisco Qualified** | **HubSpot Qualified**
- Level 4 Software Developer Apprenticeship (2023-2024)
- City & Guilds Level 2 ICT Systems Support (May 2025)
- Machine Learning: Mastering Generative AI & Agents (September 2025)

### Areas of Focus
- **AI & ML** → Custom models, LLM training, prompt engineering, performance testing
- **Automation** → n8n workflows, API integrations, MCP creation, custom AI models
- **CSS** → GSAP animations, 3D transforms, Matrix effects
- **Full-Stack** → End-to-end application development

## GitHub Stats

![Thomas's GitHub stats](https://github-readme-stats.vercel.app/api?username=ThomasJButler&show_icons=true&theme=chartreuse-dark&border_color=00FF00&bg_color=0D1117&title_color=00FF00&icon_color=00FF00&text_color=FFFFFF)

![Activity Graph](https://github-readme-activity-graph.vercel.app/graph?username=ThomasJButler&theme=react-dark&bg_color=0D1117&color=00FF00&line=00FF00&point=FFFFFF&area_color=00FF00&area=true&hide_border=true)

</div>

<div align="center">
  
## Get in Touch

</div>

<div align="center">
  
[![LinkedIn](https://img.shields.io/badge/LinkedIn-Connect-0077B5?style=for-the-badge&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/thomasbutleruk/)
[![CodePen](https://img.shields.io/badge/CodePen-Follow-1e1e1e?style=for-the-badge&logo=codepen&logoColor=white)](https://codepen.io/thomasjbutler)
[![Buy Me a Coffee](https://img.shields.io/badge/Buy%20Me%20a%20Coffee-Support-FFB000?style=for-the-badge&logo=buy-me-a-coffee&logoColor=black)](https://buymeacoffee.com/ojrwoqkgmv)

</div>

**Email:** [dev@thomasjbutler.me](mailto:dev@thomasjbutler.me) |-------|
**Resume:** [Download Resume (PDF)](https://cvgenius.com/uk/cv-link/ca1e2690-125c-4422-804d-b68c1935f598/449d6614-8209-4741-bd30-2fc12fe4f8e8)

</div>

thomasjbutler.github.io

thomasjbutler.github.io Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

thomasjbutler.github.io

thomasjbutler.github.io Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Download README