2023-05-15
How I created this website 🧙♂️, and how I used AI 🤖 to bring it to life.
Written by heliumpng
In this debut blog post, I’ll be sharing the story behind the creation of this website, including the inspiration that led me to build it and the innovative use of AI that made it a reality.
Fun and Learning: I wanted to expand my knowledge by delving into new technologies such as Astro, and also to refresh my skills in HTML and CSS. It was an enjoyable way to challenge myself while also learning something new.
Learning in Public: One of my goals for this website is to share my current learning journey with the public. By writing blog posts about my experiences, I hope to inspire others to learn alongside me and benefit from the knowledge that I gain.
I used Astro to build this website. Astro is a new static site generator that allows you to build websites using JavaScript and Markdown. It’s a great tool for building static websites because it’s fast, easy to use, and has a lot of features that make it stand out from other static site generators.
I first got to know about Astro from this video by Fireship. I was inspired by the video and decided to try it out for myself.
I used astro blog tutorial to build this website. I followed the tutorial and made some changes to the code to make it my own. I also added many some new features that I thought would be useful for my website both design-wise and functionality-wise and I’m still adding more features to it. (there is no end to it)
I got the domain name for $0 for my website from .TECH Domain which I got from GitHub Student Developer Pack. I also got to learn more about DNS records and how to use them to point my domain name to my website.
Whenever I get stuck with CSS. I used ChatGPT for the help it is like my personal tutor who is always there for me whenever I need some help
I creatd the favicon for the site in DALL-E where I promoted and got this beautiful favicon for my site. If you can’t see that is me with my coffee cup in front of my laptop with my cat on my lap.
Website design is inspired by Missing Semster (kind of), It is totally diffrent now but it was inspired by it.
For the footer part I took the inspiration from nexxel’s website.
I learned a lot about Astro and how to use it to build websites. I also learned a lot about HTML and CSS, which I hadn’t used in a while. I also learned how to use AI to create images and how to use it to create favicons for my website. I also learned how to use ChatGPT to help me with CSS ;). I also learned how to use Vercel to host my website.
I’m still working on this website and adding new features to it. I’m also planning to write more blog posts about my experiences with Astro and other technologies that I’m learning.
Mastodon Mastodon