Back to projects
Sep 2024
2 min read

PokéNux - RESTful API Pokedex

🧬 Sleek and responsive Pokédex built with Nuxt.js, styled using Tailwind, and powered by PokéAPI and the Pokémon TCG Dex. It provides an intuitive interface for exploring Pokémon details and a comprehensive database of Pokémon TCG Dex.

coverImage


✨ Features

  • Comprehensive Pokédex: Browse detailed information about Pokémon, including stats, abilities, and evolution chains.
  • TCG Card Database: Explore a vast collection of Pokémon TCG cards, complete with stats, rarities, and set details.
  • Responsive Design: Enjoy a seamless experience on any device, thanks to Tailwind CSS.
  • SEO Optimized: Built with Nuxt.js, ensuring excellent search engine visibility.
  • PWA Support: Ready to be installed as a Progressive Web App for offline access and enhanced user experience.

🛠️ Tech Stack

  • Nuxt.js - A progressive Vue.js framework.
  • Tailwind - A utility-first CSS framework for rapid UI development.
  • PokéAPI - RESTful API for Pokémon information.
  • Pokémon TCG Dex - Comprehensive Pokémon Trading Card Game database.
  • TypeScript - A superset of JavaScript that adds static typing.

🚀 Getting Started

1. Clone the repository

  git clone https://github.com/KurutoDenzeru/PokeNux.git
  cd PokeNux

2. Install dependencies

# With npm
yarn install
# or
npm install
# or
bun install

3. Run the development server

npm run dev
# or
yarn dev
# or
bun run dev

Open http://localhost:3000 to view the app.


📦 Build for Production

  npm run build
  npm start

⚙️ Configuration

The application’s behavior can be customized via the nuxt.config.ts file. Key configurations include:

  • Modules: @nuxtjs/tailwindcss, nuxt-vitalizer, @nuxtjs/sitemap.
  • CSS: Global styles are defined in ~/assets/css/main.css.
  • Content Security Policy: Configured in nitro.routeRules to enhance security.
  • Site Metadata: Defined under the site property for SEO purposes.

Contributing

Contributions are always welcome!

See Contributing.md for ways to get started.