Marvel Searcher

Welcome! 👋

This is a React web application that allows users to search and explore characters from the Marvel Universe.

Built with

• React
• Vite
• Styled Components
• Jotai
• Marvel API
• Vercel

Live Demo

Check out the live demo of the application:

• Production: Marvel Searcher
• Development: Dev Marvel Searcher

Getting Started

To run the project locally, follow these steps:

1. Clone the repository.

git clone https://github.com/fernandochaza/react-marvel-project.git

2. Install dependencies.

cd react-marvel-project
npm install

3. Create environment variables and add your Marvel API keys:

• Go to https://developer.marvel.com/.
• Click on "Get a Key" to sign up and get your personal keys.
• (!!!) Don't forget to edit "Your authorized referrers" in your Marvel Developer account.
  This is bellow your API keys. (If you will make request from a local environment, add "localhost" to the domains list)
• Go to the .env file in the project's root directory ans paste your public key in the VITE_PUBLIC_API_KEY variable.
• Create a file named .env.local in the root directory of the project and add the variable VITE_PRIVATE_API_KEY. Then, paste your private key into that variable.
• Make sure to keep your private key PRIVATE!

4. Start the development server.

npm run dev

Contributions are welcome!

I'm sure there are many opportunities for improvement and best practices to apply.

Please share your suggestions, comments, or contributions.

You can create an issue, send a pull request, or contact me directly at [email protected] or on LinkedIn.

* This project utilizes the official API provided by Marvel for fetching character data. http://marvel.com