DEV Community

kambala yashwanth
kambala yashwanth

Posted on

Help me building UI faster

I'm spending much time on UI part than writing functionality of components in reactjs .Is there a way to implement custom designed ui easily or any theme library.

Thanks

Top comments (9)

Collapse
 
dance2die profile image
Sung M. Kim • Edited

There are just too many too choose from.

I was going to list'em all here but will refer you to this article, Best UI Frameworks for your new React.js App. instead.

There is one not mentioned there, which is Atlaskit created by Atlassian (best known for JIRA).
I've never used Atlaskit but it seems not too overbearing or too flat like other Material based components.

I've used Ant-Design and wasn't so bad to work with.

And lastly, there is a React framework called React-admin (Material based), which lets you build administrative pages.

What you need to be aware of when using those components is that,

  1. harder to upgrade React (for new features) unless components are updated by the vendor
  2. learning curve for theme customization is long
  3. a11y (accessibility) is hard to do as you cannot inject a11y tag such as aria-label if components doesn't expose a way to inject.

For themes, checkout Creative Tim (sorry, never used it but only heard of it here and there.).

Collapse
 
yashwanth2804 profile image
kambala yashwanth

Thank you, whats your thoughts on github.com/ipselon/structor structor

Collapse
 
dance2die profile image
Sung M. Kim • Edited

Wow, it looks cool.
I probably won't be able to give you a feedback until I play around with it, though...

Collapse
 
danku profile image
Daniel McMahon

Depends on what your trying to do on the UI side of things? There are premade components you could always import into your project and use as needed - the one that comes to mind is: ant.design/

Collapse
 
sevenveils profile image
Heather H
Collapse
 
michael profile image
Michael Lee 🍕

Hey hey Kambala, could you share where most of the time is being sunk when working on the UI portion? Are you talking about designing, reading documentation of a library or just making design decisions that is keeping you from focusing on writing functionality?

Collapse
 
yashwanth2804 profile image
kambala yashwanth

I want somrthing like drag and drop things thanks

Collapse
 
louislow profile image
Louis Low • Edited

My recommendation is Yogurt low-level CSS framework. You can create a very unique reusable React.js web component with API callbacks. No need to bother the CSS.

Collapse
 
davidszabo97 profile image
DĂĄvid SzabĂł

ant design, bootstrap, semantic, bulma etc.
There are hundreds of these frameworks. But don't forget, they weight a lot.... You can quickly build up a several hundreds of kilobytes...