Styling in React

     Styling in React is as simple as CSS, which is basically all it is. You can create separate CSS files to hold your CSS, or you can use in-line styling. You can even put your CSS in your JavaScript files, which can sometimes be an excellent way to further isolate your code into components. My portfolio is a relatively small project, so I opted to put my styles in a separate CSS file, but I found some nice ways to organize it.

    My CSS here is organized by component, with the class name being the name of the component. I indent each different element that will be affected to ensure similar things are with similar things. Outside of the organization, the CSS isn't anything too special. Inline styles are not recommended in general, since they can make your code more difficult to read. All of this CSS makes my front page look like this:

    If you want to check out the code, it's here.

Comments

Popular posts from this blog

Reviewing WPF and MVVM

Using WebRTC to build a videophone in React and TypeScript

Learning Flutter