FREELessons: 19Length: 1.1 hours
Semantic UI is a CSS framework with a unique, programmer-friendly concept. With Semantic UI, you describe what each part of your interface is for, and the framework will use that information to decide how it looks. Classes are simple and readable, and they use a very natural syntax.
In this course, you'll learn how to use Semantic UI in your web app projects. You'll see how easy it is to create a great interface with Semantic, how to use its many unique components, and how to use themes to modify every part of the default look and feel. Not only that, but you'll get to see how Semantic is integrated in three different front-end environments: Angular, React, and vanilla JavaScript.
1.Introduction
1.1Introduction00:52
1.1
Introduction
00:52
2.Get Started with Semantic UI
2.1What Is Semantic UI?04:11
2.1
What Is Semantic UI?
04:11
2.2Theming in Semantic UI06:42
2.2
Theming in Semantic UI
06:42
2.3Semantic Collections04:36
2.3
Semantic Collections
04:36
2.4Semantic Elements03:22
2.4
Semantic Elements
03:22
2.5Semantic Views and Modules04:01
2.5
Semantic Views and Modules
04:01
3.Semantic Ui and Vanilla JavaScript
3.1Set Up the JavaScript Project05:37
3.1
Set Up the JavaScript Project
05:37
3.2Set Up the Header With a Menu and Hero Area03:36
3.2
Set Up the Header With a Menu and Hero Area
03:36
3.3Add Some Sections03:32
3.3
Add Some Sections
03:32
3.4About and Contact Sections03:37
3.4
About and Contact Sections
03:37
4.Semantic Ui for React
4.1Set Up the React Project04:16
4.1
Set Up the React Project
04:16
4.2The `Menu` Component03:25
4.2
The `Menu` Component
03:25
4.3The `Submenu` Component03:09
4.3
The `Submenu` Component
03:09
4.4Create a File Listing02:34
4.4
Create a File Listing
02:34
4.5Set Up the Angular 2 Project02:06
4.5
Set Up the Angular 2 Project
02:06
4.6Set Up the Menu03:25
4.6
Set Up the Menu
03:25
5.Semantic Ui and Angular
5.1Set Up a Hero Area05:11
5.1
Set Up a Hero Area
05:11
5.2Set Up the Campaign Information03:00
5.2
Set Up the Campaign Information
03:00
6.Conclusion
6.1Conclusion00:47
6.1
Conclusion
00:47
