Skip to content

Pokemon Explorer is an interactive web application that allows you to dive into the fascinating world of Pokémon using a free, open-source API. Powered by the official PokéAPI, this project dynamically retrieves Pokémon data and presents it with a sleek, modern, and responsive design built with HTML, CSS, JavaScript, and Bootstrap 5. Bocaletto Luca

License

Notifications You must be signed in to change notification settings

bocaletto-luca/Pokemon-Explorer

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

9 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Pokemon Explorer - WEBAPP - Database Character and Dates

Author: Bocaletto Luca

HTML5
CSS3
JavaScript
Bootstrap

Pokemon Explorer is an interactive web application that allows you to dive into the fascinating world of Pokémon using a free, open-source API. Powered by the official PokéAPI, this project dynamically retrieves Pokémon data and presents it with a sleek, modern, and responsive design built with HTML, CSS, JavaScript, and Bootstrap 5.

Features

  • Responsive Design: Enjoy a seamless experience on any device, whether you're on desktop, tablet, or mobile.
  • Technology Badges: Display the official badges for HTML5, CSS3, JavaScript, and Bootstrap.
  • Pokémon Filtering: Easily filter Pokémon by various criteria (e.g., type, or show all) to find your favorites.
  • Pagination: Efficiently navigate through multiple pages of Pokémon data.
  • Dynamic Modal: Click on any Pokémon card to launch a modal window that reveals detailed information, including:
    • Name
    • Primary Type
    • Abilities
    • Base Stats
    • Height and Weight
    • Sprite Image
    • Additional notable details

Technologies Used

  • HTML5
  • CSS3
  • JavaScript
  • Bootstrap 5

Getting Started

Prerequisites

This project runs directly in any modern web browser without any additional dependencies. For development purposes, using a code editor with live preview capabilities (such as Visual Studio Code with the Live Server extension) is highly recommended.

Installation

  1. Clone the repository git clone https://github.com/bocaletto-luca/Pokemon-Database.git cd pokemon-explorer

  2. Launch the Application

  • Open the index.html file in your web browser.
  • Alternatively, use a live-reload server from your code editor to view changes in real time.

How It Works

  • Data Fetching: The application uses the Fetch API to retrieve Pokémon data from the PokéAPI, processing the JSON response to dynamically generate cards for each Pokémon.
  • Filtering & Pagination: Users can filter Pokémon based on certain criteria and navigate through the pages of results using a simple, intuitive pagination system.
  • Dynamic Modal Display: Clicking on a Pokémon card opens a modal window that provides an in-depth look at the Pokémon's attributes and statistics.

Contributing

Contributions are always welcome! If you'd like to enhance the project or add new features, please follow these steps:

  1. Fork the repository.
  2. Create a new branch for your feature or fix:

Enjoy WEBAPP - By Bocaletto Luca

About

Pokemon Explorer is an interactive web application that allows you to dive into the fascinating world of Pokémon using a free, open-source API. Powered by the official PokéAPI, this project dynamically retrieves Pokémon data and presents it with a sleek, modern, and responsive design built with HTML, CSS, JavaScript, and Bootstrap 5. Bocaletto Luca

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published