Add Emotion to Your Web Apps With CSS-in-JS

Add emotion to your web apps with CSS-in-JS

January is National Creativity Month, and what better way to showcase your creativity than by giving your web apps some style? Want to learn how? We show you in our new course: Learn CSS-in-JS.

In this course, you will learn how to add CSS styles to your web app using JavaScript syntax. If you already have a strong background in web development and you want to find some new tricks – then this is it! Jiwon Shin, one of the curriculum developers behind our new course, explains that the benefits of using CSS-in-JSS include:

  • No more switching between JavaScript and CSS to write styling
  • Automatic alignment of CSS with critical path
  • No collisions with class names and IDs – each class name and ID is guaranteed to be unique
  • Automatic vendor prefix
  • Reducing code and file size since compiling CSS includes only necessary statements

Plus, as you discover a new way to implement CSS, you’ll also learn how to use the Emotion library, which has gained ground in the technology industry and is currently used by companies like Reddit and Patreon.

Who is the course right for?

Learn CSS-in-JS is suitable for students who have mastered the basics of web development (including HTML, CSS and JavaScript), along with React, and who want to expand their web design skills. Plus, if you’re looking for work as a front-end or full-stack developer, gaining hands-on experience with CSS-in-JS and Emotion can help give you a head start in your job search.

What will you learn from the new course?

In Learn CSS-in-JSS, you use the styling technique to build a React web application, following a tutorial as you go. At the end of the course you will be able to:

  • Explain the pros and cons of using CSS-in-JSS.
  • Identify different CSS-in-JSS libraries.
  • Use Emotion in an existing React app.
  • Apply styles to a React app using the CSS-in-JSS syntax.

Ready to learn a new way to use CSS? Check out Learn CSS-in-JS!

Web development courses and tutorials | Code Academy

Web development is the practice of developing websites and web apps that live on the Internet. Whether you are interested in front-end, back-end or going full stack, the content of our web development domain will help you get there.


Leave a Reply

Your email address will not be published. Required fields are marked *