You still wanted more after LX Issue didn't you?
From the same team who brought you such hits as LX News 📰, LX Search 🔍 and the infamous LX Riddle ❓ Liberty-X, a team in the 6th iteration of the Founders & Coders academy, brings you Custom Image Rating (React Component).
Our unchanged lineup is formed of members Justen Barget, Rachel Black, Huw Davies and Ruth Uwemedimo. 👭👬
This week we will aim to make a React component that we hope to publish via npm. The component will be a customisable rating system that can be used in a variety of situations. Where the fraction ("x out of y" or "x/y") is represented by "x" number of custom pictures.
We will be using React to create the component and using the "props" to set the outcome of the image. eg. {max-rating: 5, rating: 4, image: http://img-src}
If you would like to download the repo, you will need to type these commands into your terminal:
npm install
npm run dev:build
npm run dev:start
You will then have a bundle.js
file, and the page will be available at localhost:8080/bundle.
Please use the exact spellings:
Prop name | Prop Type | Description |
---|---|---|
image |
string | A string of the image's URL |
maxRating |
number | The scale of the rating i.e. if you are rating something 3 out of 10, this value would be 10! |
rating |
number | The rating on the scale i.e. if you are rating something 3 out of 10, this value would be 3! |
animation |
boolean | false If you don't want animation, true if you do! |