Three React Components (character customizer, calendar display, and streak display)

Avbrutt Lagt ut 2 år siden Betales ved levering
Avbrutt Betales ved levering

We need someone to create two components for our React application. Attached labeled mockups illustrate the following descriptions.

Character Customization of Pixel Avatars:

This component will have a customization menu and character preview. In the customization menu, the player can switch between different categories (ex: sword, hair etc.) and select different customizations (ex: sword type, hair color and style etc.). In the character preview, they can see what their avatar looks like with the selected item. If applicable, clicking any item should also display its name and description in a field below (ex: swords do have names and descriptions, hair has no additional name/description).

Items can be locked or unlocked. If an item is unlocked, clicking it should equip it. If it is locked, clicking it should not equip it. In addition to name and description, locked items should display cost and level to unlock. The next unlock-able item should have a buy button that is enabled if the player can afford the cost. Clicking this buy button should unlock and equip the item.

We will provide images, names, descriptions, etc. for each item and category.

All component wide data should be stored and handled with redux. The various items/customization categories should be dynamically loaded from a list in the reducer (so we can expand the customizations in the future). Lastly, the customized avatar should be its own component (so we can use it elsewhere in our product). Otherwise, the structure is up to you, but I've attached a diagram with an example of a component structure I think would work well.

Calendar Display:

The calendar display has two parts/milestones, the calendar and the streak visual. This component should be built to accept the following input: a list of objects, each composed of a datetime value and multiple integer values. The calendar on the left should look as pictured in the mockup, with the color of the dots corresponding to at least one of the integer values collected from the input object. Specifically, the dots should be grey if the integer value is 0 or undefined, and blue for any non-zero value, becoming darker blue the higher the respective value. Hovering over any bubble in either of the calendar or streak parts displays a tooltip with additional information. We're not done fully designing the streak visual, but we'll discuss this milestone further once we're finished.

Nettsidedesign HTML React.js

Prosjekt-ID: #30990344

Om prosjektet

10 bud Eksternt prosjekt Aktiv 2 år siden

10 frilansere byr i gjennomsnitt $490 for denne jobben

AwaisChaudhry

Hi there! I have read what you exactly need and I have great experience with React.js, HTML and Website Design. However I would like to ask you a few questions. I do work smart and do not rest until I get the job done. Mer

$750 USD på 16 dager
(29 Omtaler)
7.1
vovakovalkov80

Hello I have many experiences in React.js. I'm very interested in your project and will deliver you good result. Let's discuss further via chat. Thanks

$300 USD på 5 dager
(9 Omtaler)
5.0
valeriiadev

I've read your project details and thought that I'm a proper person for this work. I would apprise you that I have extensive expertise in front-end and back-end development for dynamic web projects. I am a honest, exce Mer

$250 USD på 7 dager
(10 Omtaler)
5.0
poslovmaksym

Hello? I read your job posting carefully and understood what you want. I am very interest in this project. I am full stack developer and have rich experience with react.js, website design html, node.js. I can provide y Mer

$500 USD på 7 dager
(7 Omtaler)
3.6
maksimmatveev98

Hi, there. I have read your description carefully and I understand what you want. I have rich experience in React. I have developed several sites using it. Character Customization and Calendar Display pages; I can mana Mer

$1000 USD på 20 dager
(3 Omtaler)
2.7
kiki809912

Hi I am good web developer I have much experience in react. So I can create components you need. Please contact me and discuss more. Thank you.

$500 USD på 7 dager
(1 anmeldelse)
2.6
maximbannikov1

Hi, Are you looking for a React Expert? I have great experience in React.js including Material UI design and Tailwind CSS. Also I am familiar to Redux state managment. As a full stack developer, not only frontend, but Mer

$500 USD på 7 dager
(1 anmeldelse)
1.0
ArtemStakheev

Hi, Experience is the golden factor in this project where you find in me at least 6+ years of working experience over all the factors in your project. Using Higher-Order Components, I have built character, shop and ca Mer

$300 USD på 7 dager
(1 anmeldelse)
0.6
pppppilot93

Hi, I am a React JS TOP in the world. Thank you.

$500 USD på 7 dager
(0 Omtaler)
0.0