GraphQL & React js Rick & Morty with color theme switcher

This application gives some information about the Rick and Morty cartoon, such us charaters, locations and episodes

Table of contents

• About App
• Built with
• Useful resources
• Getting Started
  • System Requirements
  • Installation
  • Bugs
  • Contributing
• Author
• Licence

About App

This application gives some information about about the Rick and Morty cartoon:

• See all charaters on the homepage
• See all episodes on the sidebar
• Click on a charaters, locations and episodes to see more detailed information on a separate page
• Click through to the charaters, locations and episodes on the detail page
• Toggle the color scheme between light and dark mode
• Button scroll to top after the scrool
• Error page/messages
• LocalStorage save of the set light or dark mode theme

Built with

• Semantic HTML5 markup
• CSS custom properties
• Flexbox
• Css Grid
• React - JS library
• React Router - For routes
• GraphQL - Data
• Apollo client - Client
• Styled Components - For styles
• React Spinners

Useful resources

• React Router - Docs
• Styled Components - Docs
• GraphQL - Docs
• Apollo GraphQL - Docs
• Rick and Morty API - GraphQL - Docs

Getting Started

In order to view this project locally, you need to make sure you clone this repository and install it's dependencies.

System Requirements

• [git][https://git-scm.com/] 2.34 or greater
• [node][https://nodejs.org/en/] 17.5 or greater
• [npm][https://nodejs.org/en/] 8.3.0 or greater

To check which versions you have installed you can run these commands:

git --version
node --version
npm --version

If requirements above are not installed in your computer, you'll need to install them. By clicking on them you can go to their website, which can lead you the way.

Installation

• Clone the repository

  git clone https://github.com/travolgi/gql-react-rick-morty.git

• Navigate to repository folder

  cd gql-react-rick-morty

• Install npm packages

  npm install

• To run the app in the development mode run in the project directory:

  npm start

Bugs

Please feel free to create an issue if you see a bug or something unexpected in the app.

Contributing

• Fork the Project
• Create your Feature Branch (git checkout -b feature/yourFeature)
• Commit your Changes (git commit -m 'Brief explanation of feature')
• Push to the Branch (git push origin feature/yourFeature)
• Open a Pull Request

Author

• Website - travolgi

Licence

MIT licence

React is MIT licence