Skip to content

This is a small wiki about Marvel and DC superheroes in which you can find information about their abilities, connections, strengths and more. Developed as a project to practise React Redux concepts at ITACADEMY bootcamp.

Notifications You must be signed in to change notification settings

JordiLara/ITACADEMY-7.0-React-Redux-Context-API

Repository files navigation

Superhero Web Finder! 📋

Description: 🚀

Enter into an extense superhero wiki finder!

Get in! Use the searcher and navigate to explore the superhero universe with just one click! This app connects you to a vast database of over 700 superheroes from DC and Marvel. Search for your favorite, discover their strengths and weaknesses, and learn more about them. Almost everything you need to know about your heroes is here!


Demo.mp4

Screenshoot-1 Screenshoot-2

How it works: ⚙️

  • Log in with the demo user and password provided.
  • There are 12 superheroes hardcoded, but you can search for more, using the search bar and different filters.
  • There is a page to register but it's only working for testing purposes.
  • Enjoy!
  • An API key must be needed to request more superhero info (check 'Getting Started').

Getting Started: 🔧

1. Clone the Repository:

- Go to Github: https://github.com/
- Clone this repo: https://github.com/JordiLara/ITACADEMY-7.0-React-Redux-Context-API.git

2. Install Dependencies:

- npm istall or npm i

3. Run the Development Server:

- npm run dev
- navigate and open the provided ip

3. Get your own API KEY:

- Go to the API: https://superheroapi.com/.
- Click the button 'Log with Github' to get your API key.
- Create an .env at the root of the project and add: VITE_SUPERHERO_API_KEY=<YOUR API KEY HERE>.

Technologies Used: 🛠️

  • ReactJS: A JavaScript library for building user interfaces.
  • Vite: A build tool for frontend development.
  • TypeScript: A typed superset of JavaScript.
  • TailwindCSS: A utility-first CSS framework.
  • node.js: evented I/O for the backend.
  • Redux: A predictable state container for JavaScript applications.

Contributing: 🖇️

This is a repo created to learn, but feel free to fork this repository, make changes, and create pull requests for any improvements or enhancements. Please adhere to the project's coding style and best practices.

This application is developed as a project to practise React Redux concepts.

About

This is a small wiki about Marvel and DC superheroes in which you can find information about their abilities, connections, strengths and more. Developed as a project to practise React Redux concepts at ITACADEMY bootcamp.

Topics

Resources

Stars

Watchers

Forks