Personal Website

Language: JavaScript, HTML, CSS
Framework: React, NextJS
Integration: Notion API, GitHub Actions
Model: WebLLM & Llama 3.2
Date: 2024

Intro:

This project is a personal website built using React and NextJS. It showcases my portfolio and provides information about my skills and projects. You would know since you are on it right now! Here is how the website works:

Development:

The website is built using React and NextJS, a popular JavaScript library for building user interfaces. React allows for the creation of reusable components, making the development process more efficient. The website is also optimized for performance and SEO using built in Vercel tools.

Development:

Design:

The design of the website is clean and modern, with a focus on usability and accessibility. It includes a responsive layout that works well on both desktop and mobile devices. Incuded components from ShadCN/UI and Radix UI for simplicity on the frontend. These components give the website a professional look and feel.

Design:

Styling:

The styling of the website is done using Tailwind CSS. Custom styles are applied to ensure a consistent look and feel across all pages. A modern approach to reduce CSS bloat and improve performance on the frontend. It also allows me to implement custom themes and styles easily.

Styling:

Blog Integration:

Implemented an automated blog publishing system that connects Notion to my website. When I publish a post in Notion, a webhook triggers a process that converts the Notion content to Markdown, generates a static React component, and deploys the new content via GitHub Actions and Vercel—all without manual intervention.

Blog Integration:

Portfolio:

The website includes a portfolio section that showcases my projects. Each project includes a description, technologies used, and a link to the live demo or source code. This section is designed to highlight my skills and experience in web development and other aspects of computer science.

Portfolio:

Documentation and Models:

I have also started to experiment more with LLM's and decided to add a WebLLM integration into the website. This allows me to run Llama 3.2 models directly in the browser and generate responses to user input. This is a proof of concept that shows my skills in machine learning and natural language processing.

I have also added a documentation section that provides information about the website and its features. This section includes a guide on how to use the website and its features, as well as information about the technologies used to build it. Here is a creative common photo of a llama I found on the internet :)

Documentation and Models:

Automated Content Pipeline

Developed a seamless content publishing workflow that connects Notion as a CMS to my website. The system uses Notion webhooks to detect new posts, converts them to Markdown, generates React components, and triggers GitHub Actions for deployment—creating a fully automated publishing process.

WebLLM Implementation

Implemented WebLLM which enables running large language models (LLMs) directly in web browsers using WebGPU for hardware-accelerated computations. It performs text generation locally on the user's device, ensuring privacy and offline access without server dependencies. Optimized for browser constraints, it provides seamless and accessible AI interactions.

Training Llama 3.2 Personal Model

Trained a custom Llama 3.2 Instruct 3B model which is specialized on a Leetcode dataset I found on HuggingFace. This prototype model is a proof of concept that shows my skills in understanding, training, implementing, and deploying personalized fine-tuned Llama models. Looking forward to implementing a multi-modal model soon.