A HackClub Stardance project.
No AI was used to put together the code or text content of this project. AI was used for feedback and code instructions.
AI Authorship:
- Asked AI about valid HTML. Then I fixed my body, header, and title tags.
- Asked AI how to do CSS for my website. Got instructions for padding, centering, etc.
How I made this:
-
My first step was to figure out exactly what I was going to put on the website. I figured a good starting point was some of my interests. I put down what I like, related to technology, writing, sports, and books. This would make up my 'interests' section later on.
-
My next step was to figure out basic fonts and setting up CSS. I created the CSS file, and researched how to bring Google fonts into my website. The fonts are downloaded through header links.
I chose "Nova Mono" for the header fonts, and "IBM Plex Sans" for the text. I feel that these fons represent me well. Not too sharp or agressive. Not too fancy or traditional. Futuristic, but not flashy.
Simultaneously, I finalized the final 3 pages of my website.
-
I added my background colors. I chose a blue theme, because it's my favorite color, and something about the feeling of blue ice is comforting. I decided to separate my sections into cards, with varying colors. This is where the usage of "div" classes started to become useful.
-
I finalized the padding of my sections, and handled varying screen sizes/devices. It took a bit of debugging, but I got there. And I ended off with cleaning up the font links, duplicate CSS tags, and invalid HTML (learned about how divs and unordered lists work).
-
I separated my sections by splitting files and adding an index.
File Content:
index.html - The homepage/about-me
interests.html - The interests section
projects.html - The projects section
site.css - The CSS styling for the website.
README.txt - This document. Instructions, information, etc.
Self-Hosting:
If you wish to see the website locally: 1. Just copy the repo 2. Click on the index.html file. This opens in your browser, and uses the site.css and art_asset.jpg for content.
Disclaimer:
This project isn't advertising or affiliated with Rick Riordan or Disney. It's fan-made.