An open API service indexing awesome lists of open source software.

https://github.com/lostovayne/pokemons-app-usando-view-transition

Proyecto usando Astro para consumir la PokeApi con finalidad de crear una paginacion , ViewTransitions entre Pokemones y mรกs
https://github.com/lostovayne/pokemons-app-usando-view-transition

astro pagination tailwind typescript view-transitions

Last synced: 8 months ago
JSON representation

Proyecto usando Astro para consumir la PokeApi con finalidad de crear una paginacion , ViewTransitions entre Pokemones y mรกs

Awesome Lists containing this project

README

          

## ๐Ÿš€ Getting Started

Astro project from `Fernando Herrera's` course, in this project we see topics related to pagination, static elements, view transitions, menus, responsive as well as ways to manage data from an API

## Project Structure

Inside of your Astro project, you'll see the following folders and files:

```text
/
โ”œโ”€โ”€ public/
โ”œโ”€โ”€ src/
โ”‚ โ””โ”€โ”€ pages/
โ”‚ โ””โ”€โ”€ index.astro
| โ””โ”€โ”€ [name].astro
โ”œโ”€โ”€ env.d.ts
โ”œโ”€โ”€ tsconfig.json
โ”œโ”€โ”€ vite.config.ts
โ”œโ”€โ”€ astro.config.mjs
โ”œโ”€โ”€ tailwind.config.mjs
โ”œโ”€โ”€ package-lock.json
โ””โ”€โ”€ package.json
```

## ๐Ÿงž Commands

All commands are run from the root of the project, from a terminal:

| Command | Action |
| :------------------------ | :----------------------------------------------- |
| `npm install` | Installs dependencies |
| `npm run dev` | Starts local dev server at `localhost:4321` |
| `npm run build` | Build your production site to `./dist/` |
| `npm run preview` | Preview your build locally, before deploying |
| `npm run astro ...` | Run CLI commands like `astro add`, `astro check` |
| `npm run astro -- --help` | Get help using the Astro CLI |

## Demonstrations

![imagen](./resources/imagen.png)