DEV Community

loading...
Cover image for A list of CSS resources for beginners

A list of CSS resources for beginners

Devin Ford πŸ’»πŸš€ on June 22, 2020

About two months ago I decided to lay out a list of things I needed to do, things I believed I needed to accomplish to start becoming a self taught...
pic
Editor guide
Collapse
oluwatonomise profile image
Joshua Folorunsho Omoniyi

@devindford you really might not have the slightest idea of what you've done or how you've impacted a life and save millions...
Feel like giving you a thank you hug 😭.
Thanks a million, God bless you real good. Will love more post from you and am following you, hope you don't mind helping where am stocked.
Thanks again

Collapse
devindford profile image
Devin Ford πŸ’»πŸš€ Author

So very happy to hear this!! I’m so glad it will be of help, and I will certainly do more in the future!

Always remember you got this!! The hard work will pay off!!

Collapse
cjglen profile image
cjglen

Really helpful, will look into these as I am self learning currently.

I've gone through html, css and a small bit of bootstrap, got to javascript and really don't feel like I know enough. Things like this are really useful, so thank you :)

Collapse
devindford profile image
Devin Ford πŸ’»πŸš€ Author

You’re welcome! That is exactly what happened to me, I got excited and ahead of myself and missed out on super important foundational things. It happens to a lot of people form the feedback I’ve seen.

Even if I can save one person from a headache I think it a win!

Collapse
jwp profile image
John Peters

I had exactly the same Css problem you described, total frustration on simple matters.
Then I discovered the HTML 5 Grid. I now use it everywhere for complete control. The only other style rules needed are margins and padding.

Collapse
devindford profile image
Devin Ford πŸ’»πŸš€ Author

It really is a great resource, I use it a ton now!

Collapse
fannyvieira profile image
Fanny

I would like to add this amazing resource: internetingishard.com/

Collapse
devindford profile image
Devin Ford πŸ’»πŸš€ Author

I appreciate the addition to the list!

Collapse
torresroberto profile image
Rob

Not all heroes wear capes

Collapse
osmang670 profile image
osmang670

Some wears under garments.😢

Collapse
devindford profile image
Devin Ford πŸ’»πŸš€ Author

Captain underpants for example πŸ˜‚
captain underpants

Collapse
kelobsc profile image
KeloBsc

I too got the same experience just this weekend exactly I decided to go back to CSS to redo the basics as I was getting stark all the time and I didn't like it as always with my background if this is the case chances are the basics are not right. Thanks @davindford.

Collapse
devindford profile image
Devin Ford πŸ’»πŸš€ Author

I think it happens to a lot of people, you want to succeed and you want to do it quickly. Sometimes going back to the basics isn’t a bad thing! You got this!!

Collapse
sandorturanszky profile image
SandorTuranszky

I was 29 when I made that exact move. Now I am 41 and looking back I can only say that I am very happy that I made that decision back then.

Software development is very exciting and will open up an incredible amount of opportunities for you. Good luck!!!

Collapse
devindford profile image
Devin Ford πŸ’»πŸš€ Author

Thank you so much!! Really helps to hear about others making that change over!

Collapse
izzy profile image
Izzy-J

This to me is a "cheat sheet!"
Absolutely amazing. Thanks for sharing Devin. I only just began an online bootcamp for web development and CSS tricks + Flex box froggy have been quite some resource!
I'm totally new to web development and programming as I just took a turn like you and I think these resources you've shared would go a long way in aiding my growth. Thanks again.

Collapse
devindford profile image
Devin Ford πŸ’»πŸš€ Author

Glad you find them useful! To be honest I’m not too far into the journey myself, but I know how much I struggled and these resources helped me the most!

Collapse
godwin_france profile image
One fulani boy

what cheat sheet do you use for CSS ?

Collapse
guivr profile image
Guilherme Rizzo

Great collection, Devin! Thank you. Maybe this could be helpful as well:

Beautiful box-shadow examples - A curated collection of 83 free beautiful box-shadow 🎨
getcssscan.com/css-box-shadow-exam...

Collapse
xchloepricex profile image
Ana Beatriz

Thanks helped me a lot, this The Responsively App had never heard of, a great find;

Collapse
devindford profile image
Devin Ford πŸ’»πŸš€ Author

Easily my most used resource when doing dev work! They’ve made an incredible app!

Collapse
shakhbulatgaz profile image
Shakhbulat Gazgireev

Great timing, I've been relearning CSS as well and nearly finished with FreeCodeCamp course. Thanks a lot!

Collapse
devindford profile image
Devin Ford πŸ’»πŸš€ Author

Glad it came at a good time!

Congrats on finishing the FCC course, one of my absolute favorite resources

Collapse
jackdomleo7 profile image
Jack Domleo

Very nice! You know you're becoming a developer when you realise that you don't actually know something, this is where you know that there is so much more to a language. Useful article! πŸ’ͺ

Collapse
devindford profile image
Devin Ford πŸ’»πŸš€ Author

Always appreciate your feedback! I completely agree, slowly feeling more like a dev every day!

Collapse
z2lai profile image
z2lai

Solid list, the bonus one was the best! Are you currently working on a personal project, or are you working as a freelancer?

Collapse
devindford profile image
Devin Ford πŸ’»πŸš€ Author

Bit of both, I’m doing my second freelance site and my portfolio I’m always updating it.

Glad you enjoyed the resources!

Collapse
abbeymaniak profile image
Collapse
devindford profile image
Collapse
cheralathann profile image
Cheralathan

I would like to add this. An extensive CSS reference with all the important properties and info to learn CSS by Sara Soueidan

tympanus.net/codrops/css_reference/

Collapse
devindford profile image
Devin Ford πŸ’»πŸš€ Author

Please feel free to add it! Glad it will be helping many 😊

Collapse
maebashiiceoctopus profile image
Alejandra Acosta

Hey tnx!!!!
im new at front-end and i find this very useful β˜€οΈ

Collapse
devindford profile image
Devin Ford πŸ’»πŸš€ Author

Glad you find it helpful!! 😊

Collapse
tracycss profile image
Jane Tracy πŸ‘©πŸ½β€πŸ’»

Amazing list πŸ™ŒπŸ½

Collapse
devindford profile image
Devin Ford πŸ’»πŸš€ Author

Thank you, just hope it’s helpful to as many as possible!

Collapse
adamj_web_dev profile image
Adam Johnson

I’m going down the self taught route and I’m really enjoying CSS. Thank you for this great article.

Collapse
arung86 profile image
Arun Kumar G

@devindford one tool I can add to the list is "Free Visual guide to CSS " - cssreference.io/

Collapse
osmang670 profile image
osmang670

Dude!what a timing!I was about to be overconfident and jump to javascript like css is no big deal.I hope you give more post like this in future.

Collapse
devindford profile image
Devin Ford πŸ’»πŸš€ Author

I will certainly try! Yes there is no reward for finishing quickly!

You got this!! Hope these help!

Collapse
godwin_france profile image
One fulani boy

How long did it take you to go this route, giving your list a try. Need to breakout out of CSS. Avoiding depending on Bootstrap.