Test your user's knowledge or increase your brand awareness in a fun way with attractive and engaging quizzes built with AngularJS.
- [Instructor] Hi, I'm Chris Converse, and this is a course that I've put together to help explore using AngularJS to create an attractive, fun, and engaging user interface for an interactive quiz. Now, adding a quiz to your website or publication can be a very effective way to build brand awareness, educate your audience, or simply to encourage users to share your content with others. In this course, we'll create our layout and animations with HTML and CSS. Then, we'll hook in the AngularJS framework to help us create a fully data-driven quiz, complete with the ability to keep a user's score and then generate a custom result screen.
We'll create an attractive and versatile progress bar that will also represent which answers are correct, will provide instant feedback when users answer questions, and after we calculate the results, we'll create customized sharing links so users can challenge their friends through email or on Twitter. And the exercise files for this course are available to all members and include a copy of the AngularJS framework as well as the graphics and some code snippets that will help us get our quiz up and running. So, with that, that's a lot of ground to cover, so download your files, and let's get started.
- Preparing the base layout
- Styling the layout
- Adding content to the containers
- Preparing the AngularJS scripts and JSON data
- Setting up the progress bar
- Generating questions and answers
- Setting active answered states
- Calculating users results
- Making the quiz responsive