Latest Blog Posts

If there's one thing I consistently do, it's start writing a blog post, want a new feature for it and then spend the rest of the time adding that feature and then writing a blog post about it. This one is about adding data graph visualizations to Astro using apex charts but the same basic principals likely would apply to other graphing tools. Since I still haven't used mermaid diagrams from my last post I feel compelled to do that. Goals This is what I wanted and why I chose apex charts 1. Interactive charts 2. Define the chart in markdown 3. Support darkmode Example Chart (from example) Example Chart Rendered Out With chart { "chart": { "type": "line" }, "series": [{ "name": "sales", "data": [30,40,35,50,49,60,70,91,125] }], "xaxis": { "categories": [1991,1992,1993,1994,1995,1996,1997, 1998,1999] } } Initial Setup Integration With Rehype Our first step is to tell our markdown, rehype in this case to support these kinds of codeblocks. chart { ...

I just recently added UML diagrams for my blogs, since in the future I want to create blog posts and youtube videos about system design and wanted to define UML diagrams in markdown and have them rendered out. In this blog post I'll show you how I got UML diagrams like these to work with my current setup of Rehype + Astro. I also wanted to be able to put images in which was annoying enough to encourage me to make a blog post about this I decided to use mermaidjs to define and render out the diagrams since it seems to get the job done and honestly it had a better website and more stars than alternatives on GitHub. Let's get started! Initial Setup We'll be using rehype-mermaid, the way this library and others work is it internally uses playwright which is a headless browser that uses the mermaid javascript library to generate the images. Unfortunantely this does make both installation and the build step need an additional dependency. Lets install this package with And install...

For better or worse, we live in a world where data is power. This has been our reality for years, but the recent emergence of mainstream AI has only made this more publicly apparent from companies absorbing as much as they can train their LLMs. Debates have already been had about whether using your data in these LLMs is ethical. Still, I wanted to dive deeper and examine if the tools that AI companies and many others use to collect information from the internet are ethical or not. I've built most of the foundational parts of my early career and knowledge by doing a lot of web scraping for contracts, personal projects, and internships. Briefly about me, my most successful project by far is my TikTokAPI python web scraper with 1.5M+ downloads. When I was learning web scraping, there was no good single resource and I ended up making everything-web-scraping to help others learn. Doing all of this helped me get many web scraping related jobs with many of their business models relying hea...

I recently reworked my portfolio website to focus heavier on blogs, and this included adding a search bar to search across across my site. In this blog post I'll walk you through how you can add your own! If you're just interested in the code here it is as a template website. Adding Search For search, I wanted a locally powered search engine so I don't have to pay or rely on third party APIs as my site only has a handful of pages and is small enough to handle in-browser search fast. To make our lives easier we'll be using astro-pagefind which uses the pagefind as a search engine. Installing First install the package into your astro project. After that's installed we have to add the integration into our Astro config. Next, let's make a basic search page. This is all you need for the most basic search functionality. Next, we need to generate the search index which pagefind will use to efficiently query your site. You can do this manually but I modified my package.json to d...

I recently upgraded my site to a newer version of Astro that supported image optimization and I wanted to use that feature. I'll walk you through it, and it's a fairly quick change to improve the load times and the sizes of images you're serving to end users. If you're just interested in the code here it is as a template website. First, we need to move all of our images that we're serving into src instead of in the public folder. The public folder contents are all directly copied over in the build folder without pre-processing. Anywhere in your code that you have statically defined links to images like After moving the image from public/assets into src/assets we can replace it with the following. By using <Image> Astro will automatically optimize your image for the web at build-time, and that's all you have to do for statically linked images. With Dynamic Images From Blogs This is where it gets a little bit tricker as we can't dynamically import images from blogs, however Ast...

I recently competed in the IMC Prosperity 2 competition and I wanted to write a blog post about my experience as a first time competitor in a trading competition in addition to writing about some of the strategies I used for each round and how overall it turned out. What is IMC Prosperity 2? IMC Prosperity 2 is a competition where you trade virtual assets in a simulated market. There are multiple rounds and each round has a different set of rules and assets to trade. The goal is to make as much money as possible by the end of the competition. The two main types of trading are algorithmic trading and manual trading. In algorithmic trading, you write a program that automatically trades assets based on certain rules. In manual trading, you manually make trades based on the information you have. Round 1 Algorithmic Trading We had two good one was an amethyst which was considered relatively stable at 10K so we just did a strategy to buy below and sell at or above. We also had starfr...

I'm about to graduate from UW Madison and I thought I'd share my thoughts on the classes that I've taken. I'm a Computer Science major with a certificate in Entrepreneurship, which I'll talk about in the later sections. These are generally ranked by how much I enjoyed the class and how much I felt like I learned from the class. These are 100% the correct rankings and you should take my word as gospel and they're definitely not just my opinion. CS 500+ Level Courses S Tier For this tier these are the classes that you should take if you have the chance to take them. They're the most interesting and the most beneficial to you in terms of learning and experience. 642 - Information Security This class is probably my favorite class I've taken throughout my degree. I took it with Rahul Chatterjee and I know that some people don't like his lectures however I did enjoy them. I came into the class as someone who was interested in the field of security and who liked breaking systems partic...

I had the pleasure of helping organize GitHub Field Day NYC 2024, and it took a lot of planning and coordination to make it happen. I had a lot of fun at the event and wanted to detail some of the things that went into organizing it and some parts of the event that I found interesting. What Is GitHub Field Day? It was my first time attending a GitHub Field Day event and at first I was a little confused what it was all about. So I wanted to provide a little context for those who aren't familiar with the event and hopefully it will help you decide if you want to attend one in the future. GitHub Field Day is an unconference event that is organized by your fellow students who are a part of the GitHub Campus Experts program. An unconference is a conference without any topics set in advance and instead it is all participant-driven, meaning that the attendees decide what they want to talk about with each other. This is a great way to meet new people and learn from others from different ba...

I was dragged into Battlecode 2024 by one of our teammates. I had never heard of Battlecode before, but I was excited to try it out. I had a lot of fun and I'm glad I did it, and we ended up qualifying for the finals and placing 13th overall. So I figured I'd write a blog post about the experience from the perspective of a first time participant. What is Battlecode? Battlecode is a contest where you write code to control a team of robots that have to accomplish some task. You can read more about it here. This year the game was a duck based capture the flag game where our goal was to capture all 3 of the flags from the opponent. The game is played on a grid and each team has a base where they spawn ducks. Ducks can move around the map, build traps, and attack other ducks. The game is played in rounds, and each round the ducks are given a set amount of bytecode to execute their actions. Here's a quick snippet of what the game looks like. !Battlecode 24 There's a lot going on in th...

I was one of the lead organizers for MadHacks Fall 2023, a 24-hour hackathon at the University of Wisconsin-Madison. The amount of effort and time that went into planning and executing this was absurd, so I wanted to write a blog post about it and hopefully inspire others to organize more events like this, but hopefully with less stress and better tools and advice for the job. I might be out of the hackathon organizing scene now, but if you've organized hackathons and have advice I'd definitely write a blog post of your own about everything you learned so that others can learn from it :D My Role I was unofficially the lead organizer of the event and did pretty much everything except for: judging plans (thanks Sam), day-of event logistics, catering, and taxes (thanks Grace). However, I did: Finding sponsors Updating the website Designing and ordering swag and banner Marketing Planning the workshops Social media Coordinating to reserve space Attempting to make a photo booth Event ...