Pokedex App - (Javascript Web Application)


Created a small web application using HTML, CSS, and JavaScript that loads data from the public Pokémon API and allows users to browse and view detailed information about different Pokémon. The app was designed with clean UI, accessibility, and responsive functionality in mind.

Tech Stack:

  • Frontend: HTML5, CSS3, JavaScript (ES6)

  • API: Pokémon API (external REST API)

  • Tools & Practices: ESLint (code quality), Prettier (formatting), Git/GitHub (version control), GitHub Pages (deployment)

  • UI Enhancements: Bootstrap (styling, responsiveness), modals for detail views

User Stories:

  • As a user, I want to view a list of Pokémon so I can browse available options.

  • As a user, I want to see details of a selected Pokémon (image, name, stats, type) on demand.

  • As a user, I want the app to load data dynamically from an external API so I always get up-to-date information.

  • As a user, I want the app to have a clean, responsive interface so it’s easy to use across devices.

Key Features:

  • Fetches Pokémon data from an external API using fetch().

  • Displays a scrollable list of Pokémon with interactive buttons.

  • Modal view to display detailed information about a selected Pokémon.

  • Error handling and loading states for better UX.

  • Responsive design for desktop and mobile.

  • Cross-browser compatibility (Chrome, Firefox, Safari, Edge, IE11).

Highlights & Deliverables:

  • Applied modular code structure with IIFE (Immediately Invoked Function Expression) to avoid polluting the global scope.

  • Added ESLint rules to ensure clean, error-free code.

  • Enhanced styling with Bootstrap and custom CSS for usability and visual appeal.

  • Deployed app to GitHub Pages for public access.

Previous
Previous

Project Five - MyFlix App - API

Next
Next

Project Seven - To-Do List App (jQuery)