ItsRoy69 / Rick-and-Morty

Home Page:https://ricksmorty.vercel.app

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Alt text

Rick and Morty Characters

This application allows users to explore characters from the show and view detailed information about each character.

Technologies Used 💻

ReactJs NodeJS ExpressCSS3 JavaScript HTML5

API

Rick and Morty API

Rick and Morty App

Welcome to the Rick and Morty app! This application allows users to explore characters from the show and view detailed information about each character.

Getting Started

Follow the steps below to run the application locally:

Prerequisites

Make sure you have Node.js installed on your machine.

Installation

  1. Clone this repository to your local machine.
git clone https://github.com/ItsRoy69/Rick-and-Morty
  1. Navigate to the project directory.
cd Rick-and-Morty
  1. Navigate to frontend directory of the a web app.
cd client
  1. Install dependencies.
npm install
  1. Navigate to backend directory of the a web app.
cd server
  1. Install dependencies.
npm install

Running the App

  1. Start the backend server.
npm start

This will launch the Node.js backend server that fetches data from the Rick and Morty API.

  1. Start the frontend application.
npm run dev

Visit https://ricksmorty.vercel.app in your browser to explore the Rick and Morty app.

Visit https://rick-and-morty-al6l.onrender.com/api/characters in your browser to explore the server side of the Rick and Morty app.

Features

1. Character List

  • A component displays a list of characters fetched from the Rick and Morty API.
  • Each character card shows the name, image, and species.

2. Character Detail

  • Clicking on a character in the list navigates to a detail page.
  • The detail page fetches additional information about the character from the API.
  • Displays the character's name, image, species, status, origin, and location.

3. Navigation

  • Users can easily navigate between the character list and detail pages.

About

https://ricksmorty.vercel.app


Languages

Language:JavaScript 63.6%Language:CSS 30.1%Language:HTML 6.3%