CssToReact: Convert Plain CSS Into React CSS


Convert Plain CSS Into React CSS
Convert Plain CSS Into React CSS


This simple little tool is intended to help translate plain CSS into the React in-line style specific JSON representation. Making it easy to copy and paste into an inline React component. This Online Tool Is Specially Made By Nakshatra Ranjan Saha (OCEAN OF ANYTHING)

What is it?

Allows you to paste plain CSS into a <textarea>, it will automatically transform that into something you can copy right into a React component inline style.

See it in action: CSS To React

The story behind it...

So you're working on a React app. It's up and running in you're favorite browser but you notice an issue with some layout. You think, ok, this should be easy to fix. You open up the developer tools, hack on some CSS within the browser till you get it looking just the way you want it to. Maybe it's several CSS properties you added or tweaked so you copy each of them into the clipboard so you can transfer them back to your application.

Then you realize, these styles aren't coming from a CSS style sheet, they're in-line styles right in you're React component.

Now you're like, FINE, I'll manually translate this to React-style-inline-CSS. This is fine if you do it once, but maybe you missed removing a dash and mis-cased a letter or maybe you forgot a comma, or left a semicolon in the converted style translation… Never happened to you? Oh, you are so amazing if only I was as cool as you. For myself and probably another 1 or 2 of you out there I hacked together a little tool that automates this translation. Maybe this should be a plugin to my text editor where I can right click and say "Paste as React Style" instead, but for now it's a single simple little web page that will automate the translation for you.

So I Made This Online Tool For You. You Can Go To CSS To React And Convert Your Normal Css To React Style JSON Format Css. Just

  • Paste

  • Copy

  • Paste

  • That's So Easy As Fuck


This Online Tool CSS To React Is Made By Nakshatra Ranjan Saha (OCEAN OF ANYTHING)

Post a Comment