Giter VIP home page Giter VIP logo

react-adopt-me's Introduction

ADOPT ME BRO!

This project implements a website that consume an API and using React & Redux shows information about pets for adopting.

Screenshots

screenshot-1

screenshot-2

screenshot-3

Features

  • List of pets with filters.
  • Page of detailed information for each pet.

Built With

  • Javascript
  • React & Redux
  • Hooks
  • CSS modules
  • Netlify
  • API from Pet Finder

Live Demo

Click -> ADOPT ME BRO!

How to Install

  • Install Node JS in your system. To install Node JS, you can read the documentation.
  • Clone it using git clone command and move to the project directory.
  • Run in your terminal npm install.
  • Create an account (it is for free) in PET FINDER, confirm your e-mail and sign in.
  • Go to Pet Finder Developer Settings, create a new application for localhost (try to include the port of your preference) and copy your api key and api secret into key.js file (which is in the src/helpers directory).
  • Run in your terminal npm start and wait for your browser.

Tests

  • This project uses React Testing Library for testing classes.
  • All files are in src/test directory.
  • OPTIONAL: Put your public and secret keys before to test, it will help to add testing for consuming the Pet Finder API.
  • In order to run the tests, in terminal, type: npm test

Potential Features

  • Full screen mode.
  • Search by city using an extra API for searching (by the moment there are only 6 cities).
  • Show a photo album and videos in pet details.

Author

๐Ÿ‘ค Sergio Zambrano

๐Ÿค Contributing

Contributions, issues and feature requests are welcome!. Feel free to check the issues page.

Show your support

Give a โญ๏ธ if you like this project!

Credits

๐Ÿ“ License

This project is MIT licensed.

react-adopt-me's People

Contributors

sergiomauz avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

Forkers

irsha-farwin25

react-adopt-me's Issues

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.