Okay, so check it, been messing around with this “khabib house” thing I saw online. Basically, tryna build a simple little site, nothing too fancy, just a place to, ya know, share some thoughts.
First thing I did? Fired up VS Code. Gotta have that dark mode, right? Then I started a new project folder. Named it “khabib-house” ’cause, why not? Seemed catchy. Inside, I made three files: , , and . The basics, ya feel?
HTML Time: In , I started with the boilerplate stuff. You know, <!DOCTYPE html>, <html>, <head>, all that jazz. Linked the and files. Then, in the <body>, I put in a simple <h2> that said “Khabib’s Thoughts”. Underneath that, I added a <p> with some placeholder text – you know, “Lorem ipsum dolor sit amet…” Yeah, that stuff.
CSS Styling: Next, hopped over to . Wanted to make it look decent, but not over the top. So, I set the background color to a light grey, changed the font to something readable like Arial, and added some padding around the elements. Gave the <h2> a bit of margin-bottom to space it out from the paragraph. Kept it simple and clean, y’know?
JavaScript Fun: Okay, so was where I wanted to add some interactivity. I added a simple alert. Just a popup that says “Welcome to Khabib’s House!”. Nothing groundbreaking, but it was a start.
But here’s where I started playing around a bit more. I tried adding a button that, when clicked, would change the text in the <p> tag. Found some sample code online, tweaked it a bit, and got it working. Felt pretty good about that. It looked something like this:
- Got the button element.
- Added an event listener to the button.
- In the event listener, I found the paragraph element.
- Changed the
textContentof the paragraph to something new.
It was a pain in the butt trying to remember all the stuff from my web dev class, but I managed to get it going. Had to Google a bunch of stuff, naturally. Stack Overflow is a lifesaver, I’m telling you!
Next Steps: So, what’s next? Well, I wanna add some more dynamic content. Maybe a way to post my own “thoughts” that show up on the page. And definitely need to make it look better. I’m thinking of adding some images and maybe even trying out a simple framework like Bootstrap to handle the styling. But for now, it’s a start. A super basic, but functional, “khabib house”. Eagle time!
