Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap
In this tutorial you will learn how to apply CSS Styles in React JS. There are several approaches to applying CSS you should be aware of when you learn ReactJS. We will look at examples of some of the most popular approaches for CSS in React.
Subscribe https://bit.ly/3nGHmNn
This lesson is part of a Learn React tutorial series playlist:
https://youtube.com/playlist?list=PL0Zuz27SZ-6PrE9srvEn8nbhOOyxnWXfp
Source Code for this tutorial:
https://github.com/gitdagray/react_styling_components
CSS Styles in React JS | Learn ReactJS
(00:00) Intro
(0:05) Various Ways to Add CSS Styles in React JS
(1:36) Examples of Inline Styles inserted into JSX
(4:19) Project Clean-up
(5:05) Applying CSS Styles to our React JS Project
(6:37) CSS Stylesheets must be imported
ES7 React JS Snippets Extension for VS Code:
https://marketplace.visualstudio.com/items?itemName=dsznajder.es7-react-js-snippets
React Dev Tools Extension for Chrome:
https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi
Styled Components: https://styled-components.com/
References:
ReactJS Official site: https://reactjs.org/
React Wikipedia: https://en.wikipedia.org/wiki/React_(JavaScript_library)
React Jobs: https://www.ziprecruiter.com/candidate/search?search=react&location=
Follow Me:
Twitter: https://twitter.com/yesdavidgray
LinkedIn: https://www.linkedin.com/in/davidagray/
Blog: https://yesdavidgray.com
Reddit: https://www.reddit.com/user/DaveOnEleven
Was this tutorial about CSS Styles in React JS helpful? If so, please share. Let me know your thoughts in the comments.
#react #css #styles