You are browsing as a guest. Sign up (or log in) to start making projects!

1h 9m 7s logged

Garden of Ivy

I decided to finally re-pick up web development, and, specifically, my portfolio / personal website! Turns out there’s a specific Stardance mission for it, so I decided why the heck not :>


Things I’ve Discovered

I’d like to say I’m decent at web development, but oh my have I learned quite a few neat tricks!

Firstly, the only reason I discovered these is because I am incredibly sutbborn and really wanted to solve very specific problems I had encountered due to my self-proclaimed aforementioned stubbornness.

  • [element] > [element] {: APPARENTLY, in CSS, you can use the Greater Than angle bracket to have formatting apply explicitly to a direct descendent rather than every sub-child of a particular element. For example, I have:
<div class="project cards">
   <a> <div class="card">
      <h1>Project 1</h1>
      <a>Link</a>
   </div> </a>
</div>

Originally, I had used .cards a to apply formatting, however this would also apply to BOTH the anchor in the card, as well as the ‘card’ itself, since every a element under .card would inherent the formatting. Instead, I could do .cards > a to mean explicitly the anchor element directly under the .cards div!

  • fetch in JavaScript is AMAZING! I was trying to use <embed src="nav.html"> to create a reusable nav bar instead of having to recreate and update it on every single page, but this would open the nav links inside an iframe-esque sub-window.

APPARENTLY, JS has a fetch method that allows one to ‘fetch’ (wow, aptly named) a specific link — in this case, nav.html — and .then querySelector an element, such as a #navigation div and update its innerHtml to the fetched nav!

Wow, that was a YAP! Anyways, it looks like this:

<div id="navigation></div>
fetch("nav.html")
   .then(response => response.text())
   .then(html => {
      document.querySelector("#navigation").innerHtml = html;
   )};

Anyways, that’s it for my devlog! Just trying to relearn HTML, CSS, and JavaScript it seems hehe. Trying to go for a cozy / garden vibe (as the name suggests smh), with that early 2000s / 2010s personal website vibe of being unique and very fun!!

Love y’all <3

0
6

Comments 0

No comments yet. Be the first!