Who's That Pokémon - JS Vanilla 🃏✨

Welcome! 👋
This repository contains the source code for my "Who's That Pokémon" game, built using Vanilla JavaScript, CSS3, and AJAX requests to the PokeAPI. The game is a card-based recreation of the classic "Who's That Pokémon?" from the original Pokémon TV series.

The game was developed 100% on the Frontend as part of the Web Development in Client-Side Environment course in the Advanced Vocational Training in Web Application Development (Grado Superior de Desarrollo de Aplicaciones Web). It was created using JavaScript functions, LocalStorage for data persistence, and CSS Grid and Flexbox for styling. 🎮🌟

---

About Me 💻

I'm a Junior Backend Developer with a passion for web development, especially in creating engaging and interactive frontend experiences. While my main focus is backend development, I enjoy working with JavaScript, CSS, and UI/UX design for frontend challenges. This project allowed me to explore and deepen my skills in these areas!

I first fell in love with programming during my studies in the Higher Vocational Training in Web Application Development (Grado Superior de Desarrollo de Aplicaciones Web), and I've continued developing my skills ever since. This game is a fun example of how I apply what I've learned to create interactive experiences! ✨

---

Project Highlights 🌐

The Who's That Pokémon game was developed with HTML, CSS, and JavaScript. It includes the following key features:

• 🃏 Card-based Gameplay: Players guess the Pokémon's name based on its silhouette. The game validates the answer and tracks progress.
• ⚡ AJAX Requests: Real-time data fetched from PokeAPI to retrieve Pokémon information dynamically.
• 💾 LocalStorage Persistence: Saves player scores, progress, and game state to LocalStorage, ensuring continuity even after page refreshes.
• 🎨 CSS3 Layout: The game is styled using CSS Grid and Flexbox, ensuring a responsive and attractive design for both desktop and mobile users.

---

Game Rules 🎮

The goal of the game is to guess the name of the Pokémon displayed in the silhouette on the card. Once you type the name and hit "Enter", the game will validate if the answer is correct or not. If correct, the Pokémon will be revealed and added to your completed Pokémon count. If not, you can try again, but if the silhouette fades without revealing the Pokémon, it means the game has randomly chosen to stop showing that particular Pokémon.

You can also track your performance by the following metrics:

• Completed Pokémon: The number of correct guesses you made.
• Missing Pokémon: The number of incorrect guesses or skipped Pokémon.
• Time: The total time spent (in milliseconds) to finish the game. The faster, the better!
• Difficulty: Choose from 5 levels of difficulty, each with an increasing number of Pokémon cards to guess.

Here are the levels:

• Level 1: 4 Pokémon cards to guess
• Level 2: 8 Pokémon cards to guess
• Level 3: 12 Pokémon cards to guess
• Level 4: 16 Pokémon cards to guess
• Level 5: 20 Pokémon cards to guess

---

Why I Love Frontend Development ❤️

Frontend development offers an exciting blend of creativity and logic. It allows me to bring ideas to life in a way that's interactive and engaging for users. Here's a little JavaScript snippet to celebrate my passion for frontend coding:

function showLove() {
    console.log("I <3 creating interactive and fun frontend experiences! 🎮💻");
}
showLove();

---

Let's Connect 🌐

If you'd like to connect, discuss web design, or share tips, feel free to reach out!

• 💼 LinkedIn
• 🌟 My GitHub