Ecosyste.ms: Awesome

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

Awesome Lists | Featured Topics | Projects

https://github.com/meltrust/pokeflix

A totally responsive web app that connects to an API to retrieve and save data from the **Pokemon** collection. Made with plain Javascript and served with Webpack. You can retrieve a list of Pokemons, submit comments and likes. All actions are saved and persisted in the API. Pagination is being added at a later update.
https://github.com/meltrust/pokeflix

api-rest javascript webpack

Last synced: 25 days ago
JSON representation

Host: GitHub
URL: https://github.com/meltrust/pokeflix
Owner: Meltrust
License: mit
Created: 2021-10-12T14:48:29.000Z (over 3 years ago)
Default Branch: develop
Last Pushed: 2021-11-30T20:16:08.000Z (about 3 years ago)
Last Synced: 2024-10-18T06:52:50.994Z (3 months ago)
Topics: api-rest, javascript, webpack
Language: JavaScript
Homepage:
Size: 2.69 MB
Stars: 3
Watchers: 2
Forks: 1
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

        [![Contributors][contributors-shield]][contributors-url]

[![Forks][forks-shield]][forks-url]

[![Stargazers][stars-shield]][stars-url]

[![Issues][issues-shield]][issues-url]






  

    

  

  
Pokeflix


  
Javascript, Webpack, get from and save to API --> pokeflix


  



    Explore the docs »

    


    


    -

    Report a Bug

    -

    Request a Feature

    -

  


## Table of Contents

- [About](#about)

  - [Desktop view](#desktop-view)

    - [Homepage](#homepage)

    - [Pokemon info and comments popup](#pokemon-info-and-comments-popup)

  - [Small devices view](#small-devices-view)

    - [Homepage phone](#homepage-phone)

    - [Pokemon info and comments popup phone](#pokemon-info-and-comments-popup-phone)

  - [Tablets view](#tablets-view)

    - [Homepage tablets](#homepage-tablets)

    - [Pokemon info and comments popup tablets](#pokemon-info-and-comments-popup-tablets)

  - [Demo](#demo)

  - [Made with](#made-with)

  - [Future updates and roadmap](#future-updates-and-roadmap)

  - [Getting started](#getting-started)

 

- [Authors](#authors)

- [Contributing](#contributing)

- [Show your support](#show-your-support)

- [Acknowledgments](#acknowledgments)

- [License](#license)



  

## About

A totally responsive web app that connects to an API to retrieve and save data from the **Pokemon** collection. Made with plain Javascript and served with Webpack. You can retrieve a list of Pokemons, submit comments and likes. All actions are saved and persisted in the API.  Pagination is being added at a later update.




  

## Desktop view  

  

### Homepage

  

![screenshot](./assets/readme-imgs/app_screenshot.png)

  




  

### Pokemon info and comments popup

  

![screenshot](./assets/readme-imgs/pokeflix-popup.png)  

  






  

## Small devices view

  

### Homepage phone

  



     



  

### Pokemon info and comments popup phone

  



     








  

## Tablets view

  

### Homepage tablets

  



     



  

### Pokemon info and comments popup tablets

  



     



  



## Demo

https://meltrust.github.io/pokeflix/

## Made with

- Plain Javascript ✔️

- Webpack ✔️

- CSS3 ✔️

- HTML5 ✔️

- Api calls with Curl and Postman ✔️

## Future Updates and Roadmap

- More general styling.

- More Pokemons.

- Pagination.

- Auth.

## Getting Started

To get a local copy up and running follow these simple example steps:

1. Under the repository name, click the Clone or download green button.

  




![clone](https://user-images.githubusercontent.com/53324035/73660989-4451aa80-4667-11ea-8a89-176f89d6548a.png)




  

2. Copy the URL given by clicking the clipboard button

3. Open a terminal window in your local machine and change the current directory to the one you want the clone directory to be made.

4. Type  git clone and the paste the URL you previusly copied to the clipboard

5. Change the current directory to the newly created folder

6. In your terminal, `npm install` to install the dependencies.

7. Now run `npm start` and the app should appear on your browser.

## Authors

👤 **Miguel Tapia**

- Github: [@meltrust](https://github.com/meltrust)

- Linkedin: [linkedin](https://www.linkedin.com/in/meltrust/)

- Or talk to me directly at: [email protected]

👤 **Amal Hersi**

- GitHub: [Amal Hersi](https://github.com/Amalcxc)

- Twitter: [@Amalcx4](https://twitter.com/home?lang=en)

- LinkedIn: [Amal Hersi](https://www.linkedin.com/in/amal-hersi-a29583205/)

## Contributing

🤝 Contributions, issues and feature requests are welcome!

Feel free to check the [issues page](issues/).

## Show your support

Give a ⭐️ if you like this project!

## Acknowledgments

- Hat tip to anyone whose code was used

- Inspiration

- etc

## License

📝 This project is [MIT](lic.url) licensed.

[contributors-shield]: https://img.shields.io/github/contributors/Meltrust/pokeflix.svg?style=flat-square

[contributors-url]: https://github.com/Meltrust/pokeflix/graphs/contributors

[forks-shield]: https://img.shields.io/github/forks/Meltrust/pokeflix

[forks-url]: https://github.com/Meltrust/pokeflix/network/members

[stars-shield]: https://img.shields.io/github/stars/Meltrust/pokeflix

[stars-url]: https://github.com/Meltrust/pokeflix/stargazers

[issues-shield]: https://img.shields.io/github/issues/Meltrust/pokeflix.svg?style=flat-square

[issues-url]: https://github.com/Meltrust/pokeflix/issues