A minimalist clone of the Tech Crunch Homepage, with dark mode and daily incremental static regeneration.
Link to project: https://rascaltwo.github.io/TechCrunchClone/
Tech used: TypeScript, HTML, CSS, JavaScript, EJS, SVG, jsdom
After I completed making a simple static clone of the site, I realized that as far as the homepage is concerned, there were a relatively few pieces of changing content, and almost off of that content was stylistically identical. This led to be expanding the site into a daily regenerating variant, first by writing a scraper with the help of jsdom, that would from the homepage obtain the unique content - articles, images, events, etc - and pass this off to EJS to generate my HTML page.
Lastly I wrote a GitHub Action to perform this daily and push the static assets to production, which you can see right now!
While there always exist optimizations, in this case I got the code to a pretty optimized position, the only remaining optimization would be instead of requiring TypeScript, to build the TypeScript to normal JavaScript, allowing less dependencies to be installed daily.
Aside from learning to implement the design of the website, I additionally learned how to implement my own version of incremental static regeneration combining my scraper & HTML building script with GitHub Pages.