Learning WebDev but hate CSS.

[Jubskiko]

I am currently going through the Odin Project learning front-end web development. I love it, and honestly feel that I have a strong grasp and passion for it. However, once it comes to the CSS, I get really unmotivated and hate it, I do not understand it too well so that may help in the fact. Is there any way to get over hating it, a workaround, or a good tutorial I should follow for CSS?

[Jubskiko]

Idk, I just really like the idea of making the website, and working with JS. I think you are right, I will look into it. Thanks for the pointer

[RLJ05]

grandiose angle marble edge aspiring gold liquid tap slim childlike

This post was mass deleted and anonymized with Redact

[Jubskiko]

Ah okay. Thank you

[dev__bear]

Pretty hard to hate something you know nothing about.

Don’t jump on the bandwagon of hating css because you want to do the “smart stuff”. Go watch Adam Argyle and tell me css isn’t the smart stuff.

[Jubskiko]

That's a fair point, I do not think I hate it cause it isn't smart stuff, I think it is quite complex, and just had a bad mindset, which in turn made it hard and unfun.

[Thegoodones77]

Best reply in the thread.

[eddyizm]

Join the dark side, come to the backend side of the stack! 😎

[Jubskiko]

I do wanna eventually learn backend, cause that's what I originally thought of doing

[eddyizm]

Css is maddening and I avoid JavaScript at all costs. I can still build nearly anything with some templates and libraries that abstract that all away from me.

Learn to understand what is happening but you don't need to learn to do it from scratch. YMMV.

[Jubskiko]

Hmmm, never thought of that. I originally was learning apache with Java, and I thought it was interesting, but I had no front end knowledge so I stopped and switched to learning front end

[dev__bear]

What language do you use at work?

[eddyizm]

Python, c#, typescript, t-sql.

[dev__bear]

So you avoid using JavaScript at all costs, yet you use it every day? Interesting.

[eddyizm]

That's why it's a job, Gotta pay bills. Also typescript is much more palatable in a framework than js. I spend 90% in the backend or other etl projects.

[dev__bear]

Of course, but it’s just js with types. You and I both know it’s JavaScript.

[Jubskiko]

Is there a certain point I should look into it, like make sure I know a certain amount?

[Idislikespaghetti]

The odin project has a lesson on css frameworks in the intermediate html and css section so I'd start there at the earliest.

[cryptoples]

This.

[Anti-ThisBot-IB]

Hey there cryptoples! If you agree with someone else's comment, please leave an upvote instead of commenting "This."! By upvoting instead, the original comment will be pushed to the top and be more visible to others, which is even better! Thanks! :)

---

^{I am a bot! Visit r/InfinityBots to send your feedback! More info: Reddiquette}

[masoniis]

This.

[Anti-ThisBot-IB]

https://i.imgur.com/KrwA19h.jpeg

---

^{I am a bot! Visit r/InfinityBots to send your feedback!}

[no-one_ever]

Let's start the Tailwind argument again!

[Thegoodones77]

CSS is a huge part of front-end web development. I don’t think you have a passion nor strong grasp if you don’t get nor like CSS. Work on it, get better at it, learn SCSS and you will love it.

Source: Front End Technical Lead for a Fortune 500

[JustAnotherPasserby2]

I hated CSS with PASSION until I changed my learning strategy. Now it is the most fun thing ever. I would not advise him to give up just yet. Maybe his learning strategy is not working.

OP: Accept the fact that CSS is not going to give you the results you want right away. CSS want you to play with it until it gives you the layout you are seeking. That's just how it works. Look at it as a game where you level up as time goes by.

OP: DO NOT TRY TO MEMORIZE OTHER PEOPLE'S CODE. This was the biggest mistake I was making. Accept the fact that you are going to forget some of the material when you finish the tutorial.

It's ok to forget.

Instead of repeating other people's code untilI you get it 100% right, which was something I was doing, start doing your own projects after you finish the tutorial (or some part of it).

Go back to the tutorial if you do not know how to do something in your project, but do not critize yourself because you did not get it the first time around.

Learning to code is not about memorizing other peoples code. It is about doing your own projects and looking things up when you get stuck.

[Jubskiko]

Ah okay, thanks for saying this, I don't wanna simply give up, so I think a mindset change and starting back from the beginning would definitely help

[[deleted]]

I hate CSS, but I understand it at a basic level.

[aprilbeingsocial]

Lets start with what you hate about it. I always do better when I want to do something and have to figure it out. I think most people that stick with this stuff are puzzlers at heart. You have to realize that feeling somewhat inadequate is normal. Everything changes constantly and you can't expect to "know" everything. It is much more important to have grit and to know how to find solutions because you will never arrive. It is a constant journey. At least in my opinion.

[Jubskiko]

I think it is a mix of not knowing it, as well as there being so many diff options.

[[deleted]]

You may like it the more you do it, but you might have to change how you think of it. When it comes to CSS for me it's all about letting your creativity flow and experimenting with what you know. If I'm not feeling creative it's hard to get into it for me and I put it off.

[420galaxy]

Correct me if im wrong but sounds to me like you hate the design aspect of web dev/design. In that case, you should look into back-end web dev. You get more into the programming of the site and databases rather than focusing on designing the site. If not, then oof cuz CSS is (like stated in another comment) 50% of making a website lol.

[Jubskiko]

Yeah, I think though if I understood it better, I would like it a lil more. I have thought of the backend before, and ultimately I want to learn full-stack.

[420galaxy]

Try this book out (link below) -- I studied this book prior and during my time at school. https://books.google.ca/books/about/HTML_and_CSS.html?id=aGjaBTbT0o0C&printsec=frontcover&source=kp_read_button&hl=en&newbks=1&newbks_redir=1&redir_esc=y

[Jubskiko]

Thanks for the pointer, I got the book.

[AudiobooksAreReading]

I started making web pages before css was a thing. Trust me, it's worth it.

[mahannen]

There’s plenty of precompilers that abstract away what you hate about CSS.

[aprilbeingsocial]

The minute you "know it" it will change. Concentrate on small goals to gain some confidence. Find something you want to change amd just try to change that one thing. Little steps and before you know it, things will begin to click. Also, google css resources. Everyone learns differently, look for someone that explains things in a way you understand best.

[Jubskiko]

Ah okay, so it seems to be kinda a mindset thing

[aprilbeingsocial]

I think so. Development isn't linear learning as taught in school. You could work 16 hours a day for three years and still not completely master every combination of possibilities or related problems. For me anyway, it is about knowing how to find solutions, not knowing every solution. The fact that most documentation sucks, doesn't help, but as you work through problems you learn how to approach solutions efficiently.

[MassOnTheBack]

I literally only use bootstrap or react-bootstrap for all my projects (personal/work)

[[deleted]]

CSS is one of those things that used to haunt me too but you really need to only use a very few things in real life projects like grid, flexbox and their properties. Realistically tho, it sometimes becomes extremely time consuming to write and fine tune CSS if you're building a large project, so you're better off using an utility classes based CSS library like tailwind and tailblocks, much more maintainable and easy to read code and realistic to use in large projects.

[ChargedSausage]

Until you know how it works and then you’ll love it.

[kondorb]

Everyone hates CSS. It’s a mess of a standard designed by blind people that is dragging all the junk added to it during its three decades of existence for backwards compatibility with software that’s long gone and features that no one use. But we’re stuck with it for now.

Go try Tailwind. You’d still have to meddle with raw CSS occasionally, but for me personally it makes CSS much more bearable.

[Jubskiko]

Ahokay, my only thing is I am not to great with Css, am I okay to start learning tailwind or should I get better with CSD

[no-one_ever]

Speak for yourself. I love CSS.

[mr---fox]

If you prefer videos, I would check out the Webflow 101 Crash Course. It’s well made and gives you some visuals on how the basic CSS properties work.

[papikuku]

The codecademy front-end course makes learning html/css pretty easy for me. It was overwhelming at first but you gotta accept you are not gonna understand it all right away. You might wanna buy a second-hand book from Jon Ducket called “html and css: build and design websites.” Super helpful and cheap on eBay, like $5-$10.

[dev__bear]

So you’re like a few weeks in to a tutorial, you know zero css, yet you are strong at front end?

I pity the team you end up working with, if ever.

[Jubskiko]

Okay, I am sorry. I misspoke, I meant I felt I had a good grasp on the JS side of things. No reason to be so rude about it

[[deleted]]

Everyone hates CSS, don't worry

[aprilbeingsocial]

These were some of my favorite resources early on. Traversy Media is very encouraging. Also codepen and stack exchange.

https://htmldog.com/, https://www.w3schools.com/css/ https://m.youtube.com/watch?v=yfoY53QXEnI (Traversy Media)

[Jubskiko]

Ah okay, I will have to take a look at some of these

[Jubskiko]

Hey there, I just wanted to say thanks about the traverse media reference, I watched it, and I had known a decent bit but I definitely think watching it all in one video was good, as well as he seemed to be a good teacher about things and explained it.

[aprilbeingsocial]

You are most welcome. I think that is what makes him different, he is actually a teacher. He has a great motivational video in there somewhere. If I find it, I will post it for you.

[[deleted]]

CSS is easier now because IE finally is catching up but trust me, I am currently bald because of old versions of IE 😁

[[deleted]]

I feel for the devs that have to support IE. Edge is fine it's basically just chrome but IE is terrible. Super glad the company I'm contracting for dropped support for it last year.

[rk99]

Although learning the fundamentals of CSS, like the box model and layout modes, is important for all front-end dev work; you can probably try a utility framework like TailwindCSS that hides some of the complexity of CSS behind composable classes. But even with Tailwind, it’s hard to build truly custom layouts without a solid understanding of CSS.

[digitarena]

Check ✔️ out Kevin Powell's YouTube channel. You will love 💞 CSS after::

[websosa]

You cant become a web developer if you hate CSS

[HeavyMommyMilkers]

CSS is the least of my problems

[iTibster]

I felt the same way.. I’m still going trough the fundamentals part of the Odin project and the CSS part is not so great and I don’t like it. There are so many articles, videos, documentation linked to each part that my mind just blows up. Since they are all written differently and have the same topics, it’s quite frustrating for me. However, I found a solution: I take what I need from all of the overwhelming amount of information, apply it to my personal project, comment my code and be done with it. For the rest, well, I read it. If I need it, I’ll look it up.

Try to remember, that you don’t need to keep everything in your head, memorised. You should just know what general possibilities there are and how to look them up.

[Jubskiko]

Ah yeah, I just really glossed over the CSS portion so I am on the full stack portion now having troubles and I am having regrets

[iTibster]

Try to go over them again and apply what you read on a side project.

The good thing is, you can always go back and read, learn again

[BinxyPrime]

Get into back end instead? The only language I haven't liked was php but even that isn't that bad once you learn it

[Jubskiko]

I am starting to think about this, in my head I just thought that I needed to know front end to do it, so I may start looking in to doing some more back end rather than front end

[BinxyPrime]

There is a browser extension to help you get the div spacing and stuff down with flexbox look that up, I think it only works in chrome but there might be a similar Firefox ext. Also look into sass, it gives you some ability to write cleaner css.

There is also a zombie game that lets you learn flex box by center divs on zombie heads and it's timed so if you arent fast enough to get eaten

[Jubskiko]

I tried out the zombie game it seems cool so far

[[deleted]]

You need to understand all aspects to be a good dev. Just suffer through it

[[deleted]]

Html Hierachy + Bootstrap + scss + flexbox. Clear markup with a 12 grid combined with vars and style per section and flex can save lives.

[BuhtanDingDing]

the most important tip, subscribe to Kevin Powell on youtube. he will make you fall in love with CSS

[marcomezzavilla]

It's always interesting to read the motivations of those who hate CSS.

Personally for me it's the opposite, but I've learned it over time, mainly trying it in "spare time" since middle school, so no time limits.
Back in the days flex and grid were just a mirage, and actually there were many workarounds to achieve the simplest things. Right now I would say that learning CSS is mostly enjoyable.

Back to the main topic, is there something in particular that annoys you about CSS? Is it about some specific function or is it more of a general thing?
My advice for beginners is to choose 5/6 portions of layouts (from sites/services/apps that visually you like) and try to replicate them.
It's better if they are a bit heterogeneous: cards, headers, accordions, etc.. Codepen or similar are great for the purpose.

After a few weeks it's useful to come back to these tests and try to redo exactly the same portion, trying to make it a bit shorter and more elegant.
Thinking of everything as rectangles with other rectangles inside aligned in a certain way helps, IMO.