1

I recently began coding in React. It is all good, except that i can not find the proper way to manage layouts and alignment in the UI. I am experienced in the UI5 framework where these things come out of the box, but here i can not find such thing-provider library.

I am also using the UI5-WebComponents for React lib, but there are only things like FlexBox and spacing.

Somehow I have avoided using CSS on a large scale, by relying on pre-defined layout components or controls. Is there something similar which I can use in React?

I will be grateful for any help

Boghyon Hoffmann
  • 17,103
  • 12
  • 72
  • 170
fmi21
  • 485
  • 3
  • 15
  • It is more a conceptual problem, whether recreating patterns like Master-Detail view is possible. – fmi21 Apr 30 '20 at 09:20

1 Answers1

1

This is a common adjustment when starting React. Here is what worked for me.

While in development I put styles in line as follows

<MyReactComponent style={{top:'50%',position:'absolute'}} >
...
</MyReactComponent>

Once I move to production I can take the styles and move them to .css file

.MyReactComponentStyles {
   position: absolute;
   top: 50%;
}

then pass the styles on to the component

<MyReactComponent className="MyReactComponentStyles" >
...
</MyReactComponent>
Michael Nelles
  • 5,426
  • 8
  • 41
  • 57
  • I have avoided using CSS on a larger scale by relying on predefined layouts, css classes. Is CSS a must when developing in React? – fmi21 Apr 30 '20 at 09:19
  • Depending on the nature of your project. For example I work a lot with material UI and there are some projects that do not require any customisation outside of what the framework provides. So `yes` you can avoid CSS. That being said all frameworks / libs are highly customisable and I find the use of CSS to be indispensable 90%+ of the time. – Michael Nelles Apr 30 '20 at 09:34
  • I just up voted the question you should have enough points to upvote the answer if you want thanks. – Michael Nelles May 04 '20 at 11:38