P

Plenty UI with Typescript

A better code on Typescript and improved UX.

P

Plenty UI with Typescript

A better code on Typescript and improved UX.

The problem Plenty UI with Typescript solves

While using the website some User Experience wasn't good that including the Dropdown Navigation for the Navbar that is improved by Tabs for each Navigation.
We all love Dark themes and it's great that Plenty got it covered but as a new user those settings are deep dig into the settings dropdown, which is replaced by the single toggle button.
The website of PlentiDefi had all the images on the website code itself I tried to make the website as light as possible by using the Open Source React-Icons library and using Tailwind CSS so that we don't have to manage the CSS files and use true power off React with reusable components and the project is created form the Scratch.
It is also made in such a way that it can be converted easily into an OpenSource Project.

Challenges I ran into

The most challenging part of the challenge was to understand the codebase of the PlentyDefi Project. As a beginner they were quite overwhelming and to be honest took my maximum time during the hackathon. Facing errors with typescript dependencies and understanding the versions of it used by PlentyDefi.
Secondly, when I cloned the PlentyDefi on my local machine it wasn't working at all so wasn't able to run the code on my local machine.
Then, after a lot of research and studying different libraries I was able to get a handful library that can solve all these problems.
The problem itself also was typescript as it made me practice with all the libraries that I was going to use with so many new additions to it. And some libraries also doesn't support the typescript.
The website is not yet completed but I got to learn a lot from this hackathon and will be grateful to work further on this website.

Discussion