In Dragon Warrior, your goal is to defeat the dragon that is stopping people from leaving the town. To win the game: 1. Fight smaller monsters in the cave. 2. Earn XP and gold. 3. Buy stronger weapons from the store. 4. Buy health when you need it. 5. Fight the dragon when you are strong enough. 6.Defeat the dragon to win the game.
Voila!
My first ever website is complete.
https://dragonwarriorgame.netlify.app/
How to play:
In Dragon Warrior, your goal is to defeat the dragon stopping people from leaving the town.
You start with:
XP: 0
Health: 100
Gold: 50
Weapon: Stick
Use the three buttons on the screen to choose what to do.
Begin in the Town Square, where you can visit the store, enter the cave, or fight the dragon.
In the store, you can buy health and stronger weapons using gold. Weapons get stronger in this order: Stick, Dagger, Claw Hammer, Sword.
In the cave, you can fight smaller monsters like slimes and fanged beasts to earn XP and gold. XP makes you stronger, and gold helps you buy health and weapons.
During a fight, you can attack, dodge, or run. Sometimes your weapon can also break, so keep an eye on your inventory.
To win, train in the cave, earn XP and gold, buy stronger weapons, restore your health, and defeat the dragon.
This project was a big step in my coding journey. I had previously documented a lot of HTML and CSS while following videos, but this time I followed website-based instructions and focused more on JavaScript, functions, and basic game logic.
Overall, I really enjoyed building my first project.
Thank you to everyone who checks it out :)
LOL THIS ONE IS GONNA BE A BIG CHUNK. (This will also help y’all with the personal engagement piece when you rate this project.)
I was away on Day 2, so I couldn’t really code. For Days 3 and 4, I focused on getting my HTML and CSS fundamentals down before I write another journal. AND BEFORE I TALK ABOUT WHAT I LEARNED, I want to talk about my experience.
Back in middle school, I did a little bit of Python, and it’s been fun seeing how HTML and CSS use human-like words instead of looking like random bits and symbols. You want to change the background color? Just go into styles.css and change the color. That’s it. Easy. Sauce.
While I’m still learning, I’ve already started brainstorming a few projects I want to make to test my knowledge:
I’m thinking of creating a personal portfolio site. Just a simple “Hello, this is my first website, here’s my journey” type of thing.
During my first project, when I worked with the Slack bot, I became really interested in APIs. From what I’ve seen, JavaScript works really well with them, so I think it would be fun to make something like a weather tracker or a top news dashboard. I want something that uses JavaScript to fetch information and bring it onto my screen.
Calculator app (a lot of people make this lol).
Tic-Tac-Toe. One of those classic beginner projects.
Anyways, here’s the big dump for y’all to show the new terms and concepts I’ve learned over the past two days.
When you use <a href="link.com">, it is generally expected that the link opens in the same tab. However, this can be changed.
Using target="_blank" forces the webpage to open in a new tab.
There’s also the concept of Relative URLs vs. Absolute URLs. A relative URL points to another file within your project, such as about.html. An absolute URL includes the full web address, such as https://example.com, which tells the browser to navigate to a website.
<head> is for information and settings that the browser uses behind the scenes.
<body> is the part of the webpage that users actually see.
You can use mailto: in a link, and it will open the user’s default email application to send an email.
I learned how to make a table:
tr = table rowtd = table data (a table cell)(I learned the hard way that it’s usually easier to organize layouts using div containers.)
Speaking of div, it’s basically a container for your code. Let’s say you’re making a dropdown menu—you can place all the related code inside a single div to keep everything organized.
I also learned about lists:
ul = unordered listol = ordered listli = list itemDescription lists:
dl = description listdt = description termdd = description definitionBlock elements stay on their own line and take up available width, while inline elements flow with the content around them.
iframe is used to display another webpage inside your webpage, although some websites prevent themselves from being embedded.
For symbols, one method is to use HTML entities. For example:
♥ = ♥
I also learned about HTML forms:
There are two common methods for sending data:
POST = sends data without showing it in the URL.GET = the default method if none is specified. It sends data through the URL, making it visible in browser history and the address bar.
It’s been going well so far. I’m following the W3Schools guide to learn everything. So far soo good, I’ve learned a couple of things already such as:
<h1>, <h2>, <h3>, <h4> are types of headings that decrease in size as you go on.
<p> is used for paragraphs.
<hr> is for a straight line across the site.
One issue with using <p> is that you cannot add spaces or switch to another line, so there are 2 alternatives:
Using <br>, which breaks the line.
Or using <pre>, which allows the text to behave in the same way as you write your code in.
<strong> and <b> bold the text.
<em> makes the text italic.
<mark> highlights the text from within.
<del> creates a strikethrough.
<sub> adds a subscript.
<sup> adds a superscript.
Within each element you can add style="" and change aspects of the code such as the colour/background colour.
To refer to a link you can use:
<a href="link">text</a>
There are no closing tags when using <img>, <br>, or <hr>.
Uhh yea, that’s the first day in and out :)
