The usage of Valorant API in React JS

Overview

Valorant API React Project

📖 Information

With the usage of Valorant API from https://valorant-api.com/ , thie project is made of different kinds of information about Valorant Game
Here is the explanation of the project
- General information about the game in the home page
- General information about agents with their characteristic features
- General information about gears which agents can wear
- General information about maps
- General information about weapons which agents can buy before starting the game
- Adding language feaetures to convert all information to selected language through i18next
- Adding toggle button to change the theme of the webiste (dark mode, light mode)

🔨 Run the App

1 ) Download your project from this link https://github.com/Rapter1990/ValorantApiReactProject

2 ) Go to the project's home directory : cd ValorantApiReactProject

3 ) Install all libraries used in the project through this command npm install

4 ) Run the project though this command npm start

Screenshots

Click here to show the screenshots of project

Figure 1

Figure 2

Figure 3

Figure 4

Figure 5

Figure 6

Figure 7

You might also like...

Easy to use, responsive and customizable carousel component for React Projects.

React.js Responsive Minimal Carousel

82 Dec 23, 2022

Lightweight carousel component for react

217 Dec 30, 2022

Rerousel is the simplest and the lightest infinite carousel package made for React.

Rerousel is the simplest and the lightest infinite carousel package made for React. Simple Set up your carousel in the blink of an eye. You only have

108 Dec 23, 2022

Touch and drag slider carousel component for React

react-touch-drag-slider Touch and drag slider carousel component for React Touch friendly on mobile Responsive to viewport resizing Supports mouse dra

184 Dec 22, 2022

Items Carousel Built with react-motion and styled-components

react-items-carousel Installation $ npm install react-items-carousel --save Demos Example import React, { useState } from 'react'; import ItemsCarous

204 Dec 24, 2022

A react carousel/slider like component for sequentially displaying slides or sets of slides

react-whirligig demo repo A carousel/slider-like component for sequentially displaying slides or sets of slides. Basic Usage const Slider = ({ slideIn

24 Aug 3, 2022

Animate Banner React Component

rc-banner-anim React BannerAnim Component Browser Support IE 10+ ✔ Chrome 31.0+ ✔ Firefox 31.0+ ✔ Opera 30.0+ ✔ Safari 7.0+ ✔ Development npm install

168 Oct 20, 2022

React simple infinite carousel with lazy loading and responsive support

react-leaf-carousel React simple infinite carousel with lazy loading and responsive support. Installation npm install react-leaf-carousel Example impo

115 Dec 12, 2022

Minimal carousel component for React.

re-carousel Minimal carousel component for React. demo: https://amio.github.io/re-carousel/ Usage import Carousel from 're-carousel' then: Carousel a

261 Dec 23, 2022

Comments

fixed issue with multiple API calls in pages

Up until now, accessing each page would call the API an infinite number of times. This was due to the useEffect containing the function from the context in the dependency array. This is shown here

This PR solves that issue.

opened by lanxeon 0