I love react, but i hate CSS. What am i?

I am familiar with MERN stack and I prefer working on something related with app logic instead of backend configuration, UI styling etc. Can i call myself a full stack dev or just react dev with familiarity of MERN stack? Or do i really need to learn CSS? Wondering if i could land a react.js related job without knowing CSS.

3 Likes

CSS is way easier than React and there’s a lot less to it. Learn the box model, the difference between displays (block, inline, inline-block, relative, absolute), and read up on choosing fonts, colors, UI stuff, and you’ll be decent at CSS. Clone a couple websites for practice.

2 Likes

CSS

15 Likes

Blockquote Clone a couple websites for practice.

On that note… if I decide to clone something, what should be the approach? can you walk me through it?

That’s totally me with CSS and Chrome, let’s not add firefox or safari. Let alone ie…

I consider CSS the worst part of my job.

1 Like

keep trying and fail less each time. Take notes of properties you are not familiar with and read up on them on css-tricks.com. It takes time…

Congrats. :joy: What CSS framework make you less hate CSS?

If I ever find one, I’ll let you know. (I don’t get to make that kind of decision though, so I don’t spend time experimenting with them.)

1 Like

I very much disagree with this. CSS is completely fundamental to the web while React is a single Javascript library, and the hard parts of CSS are certainly not picking fonts and colors, which is usually not the choice of the developer anyway.

Modern web apps use HTML, CSS, and Javascript together and a good developer should have a good handle on all 3. This is especially important if you are building a project which needs to match the designers wireframe pixel for pixel.

Exactly what title to call yourself really isn’t that important (maybe try “Web Developer”) but you do need to know CSS to build websites and web applications, and you can’t really get around that.

6 Likes

Echoing what @RadDog25 already said, CSS (https://developer.mozilla.org/en-US/docs/Web/CSS/Reference) is way more complicated than React (https://reactjs.org/docs/react-api.html). No comparison.

Any chance you could be more specific about what you dislike or find difficult to learn about CSS?

I don’t think its really that difficult. It just a matter of preference. I prefer to work on app logic instead of ui styling. But then, could i land a job knowing react alone without a good grasp on css?

1 Like

Uh… Well React is supposed to be for building UI so it’s a bit weird to avoid styling. There are plenty of front-end/full stack developers who hate CSS, but I’m not sure there are any who don’t know it. People expect flexibility, especially if you mention full stack. Working exclusively with React for app logic really narrows your niche down.

And if you were a senior developer who hated CSS, you’d probably pass it down to a recent hire.

Well, with purely programming language, i can manage it. But css always end up to be difficult for me.
And one of the first reason is that every courses, basicaly if not project in it, suck balls. They’re to simple versus what you have to do in real project/situation. And they miss a lot of css commands like min-/max-, what is the best display to use in this or this situations, what is the best practice with .css files… you’re more on your own.
But that’s right, programming language are more difficult but courses are better.

I had a strong distaste for it too, but it is something you have to learn how to live with.
A few things that I learnt that made it slightly easier to live with for me

  1. Flex box

  2. Sass

  3. Key Frame Animations

Certain things are much easier done with css than trying to style directly from within react which would become increasingly counterproductive , generally I find that a good working knowledge of css will amplify your react skills.

Its funny, because I too found myself getting incredibly frustrated with it.

I dont know whether its because I come from a traditional Computer Science background, and just thought it was easy pickings!! But everytime I tried to do anything in it, two other things would move/change/not look right. Or whether it is because I have worked as a web designer and have a lot of experience in just making things in Photoshop without having to think it through.

Unfortunately it is fairly vital in a web dev job, and I have had to try and get used to it. CSS Secrets is a decent book that I use for reference sometimes. If you really hate it that much, but enjoy programming then surely a career away from JavaScript in general is the way forward?

Sorry guys, I’m not in the CSS bashing, “I hate CSS” camp. SMH. :slight_smile:

The most exciting/fun part for me is taking the Photoshop design I did (which the client approved) and converting that to a real HTML/CSS template and seeing that design become “alive.” – having transitions, behaviors, mouse-over effects, videos playing, seeing the drop down and sliding menus working, and seeing it transform depending on browser widths and looking good on any Win8 tablet, iPhone, Android, Kindle, and iPad device.

Only after I get the layout/look working do I work next on the backend/frontend code that replaces all the dummy text and graphics with live content coming from the database. – then it’s just smooth sailing from there on… maybe even a little bit BORING even. I mean, how many ways are there to read records from a database and display the content on a page? It’s the same CRUD operations, just varying parameters and logic conditions.

But with design, I put on some music or play a Netflix movie, and can spend a long amount of time playing with how light/lighter the shadow should be, or do I want 2px or 3px rounded corner radiuses, or do I use a 0.5s or 0.8s transition for the fade-in, or do I use a 0.9 or 0.85 alpha transparency, play with different shades of the same color – almost barely perceptible. And FONTS – spend hours on Adobe Typekit picking the right sets. Playing with letter-spacing and line-heights to make it look really good. – really obsessing with details. Then a few days later, I’d look at my work and find something bugging me, not looking right, and change my mind again. Little tweaks here and there.

Designing in CSS is “evolutionary”… if you’re satisfied with a working site and a “correct” CSS at your 1st try and stop at that, then the page will reflect that. It will look like a coder/developer made it.

The only way to become good at CSS is to make lots and lots of ugly websites and learn from it. It’s like learning how to draw or paint – it really takes practice. You don’t produce good output on your first or second or tenth attempt.

PS: I don’t have an ART or DESIGN degree. My BS is engineering. But even in engineering, there’s some art/design/style needed when designing for example a PCB layout. Little details matter like track widths, spacing, equal impedance, where to position/orient the different components, etc. Again, you’re not happy and you don’t accept the first working design that you come up with. You iterate and evolve it.

5 Likes

“I love react, but i hate CSS. What am i?”

A sane human being. CSS is a garbage fire. It’s a plague on humanity. It’s worse than Javascript, and I don’t say that lightly.

Web devs have to learn it anyway. (We also have to learn Javascript.)

React is a front-end technology, and if you’re working on the front end, CSS is just a fact of life. A framework can take care of most of it, but there’s always going to be that one place where the framework doesn’t do what you need done. You need to be able to get in there and do it yourself; you can’t expect to have a dedicated CSS guy on call.

The way I learned CSS was starting a personal project where I had very particular ideas about the look and feel. (They were not good ideas. But they were particular.) I spent an enormous amount of time on StackOverflow and Google, figuring out how to get things just so. It’s that focus on “just so” that will push you to learn. Don’t compromise on details, because CSS is all about details. Hammering away until you understand why that div is one stinkin’ pixel too tall is what develops the skills you need.

I will add that it’s gotten a lot better in the last couple of years. Between new layout tools like grid and flexbox, and cross-browser issues becoming the exception rather than the rule, CSS is not nearly as painful as it once was. It still has fundamental flaws (specificity, from Hell’s heart I stab at thee), but the number of things that will make you tear your hair out is much reduced.

2 Likes

I agree, CSS is pretty much trash. In reality it’s not that bad, it’s just totally inadequate for the way we’re using it. If you’re laying out a simple document with type and a few images, CSS is decent. It was never intended to be a UI layout engine.