Join Eric Greene for an in-depth discussion in this video Overview, part of Getting Started with CSS for React Developers.
(soft music) - [Instructor] To get started here, what is CSS? I find a lot of developers don't even really understand really what CSS is. They know it has something to do with doing styling on a web page or something like that, but when you actually ask like a formal definition or try to relate it to other web programming technologies, they really have a hard time understanding what exactly it does. Well CSS first of all stands for Cascading Stylesheets.
For example HTML the Hypertext Markup Language just describes the semantic structure of the UI. What are the different meanings of the pieces in your UI structure? For example a paragraph tag for paragraph content or a form tag for form content. Well HTML focuses on the semantic meaning of the content, CSS focuses on the presentational description of the content. Now unfortunately, many UI developers never really develop essential CSS programming skills.
They don't really understand how the language works, how the different features of the language are used to actually do the presentational structure of a page, and so learning CSS is really really super important to really build full-blown UI applications. Now this series is going to focus in on CSS, but to be honest with you, to be able to use CSS, you have to first know HTML. If you don't understand how HTML works, and the thing about it is you can use HTML for a long time and not really understand exactly what's going on behind the scenes.
If you're not familiar with things like content categories and topics like that, you could easily write bad HTML, which of course cannot be styled by CSS, 'cause it just won't work. So in order to be good at CSS, you've got to be good at HTML first, so if you haven't taken the time to read the various specifications on HTML, or to formally study HTML as topic, you're highly encouraged to do so. Now, one of the things that holds developers back from really jumping in to learning CSS, is that a lot of developers don't design or create pretty pictures.
I can tell you over the course of my career, I can take other people's pretty pictures and implement them, but if you said Eric go and create your own pretty picture in Photoshop and then somehow translate that into an awesome looking web page, not going to happen. I just don't have that design capability. Nevertheless, CSS is not really about drawing pretty pictures. CSS is about having that technical knowledge to be able to take somebody else's pretty picture and be able to implement that presentational structure into your web page.
So as long as you're not making yourself be the Photoshop person that's going to go in there and figure out how to create the picture, as long as you're content with letting somebody else design that pretty picture for you, if you have technical knowledge of CSS, you can take that knowledge and use that to implement that pretty picture and build that web application or the UI application that uses that style and design. Now CSS covers the following presentation areas: selecting UI elements, styling elements, laying out those elements on a page, so you can have a nice structure to look at.
Being able to animate those elements, and then finally being able to apply those styles based upon some type of display media. Displaying it on a page, or a printer-friendly version of your site, or for example you want to set it up to show certain things on a mobile device, or maybe certain things on a tablet, or certain things on a desktop, all the various styles that make that happen. Now CSS is a huge and ever-expanding topic area. There are so many changes happening all the time on all the various fronts of CSS, you literally could probably just master CSS as a career choice, and just do CSS coding.
Nevertheless, it's important for all UI developers to have a basic understanding of the essentials to be able to actually be able to style and lay out a page and leverage some simple animations, and that's what the goal of this course series is.