Quizzer
Project Description
The Quiz Web App is designed to allow users to participate in a quiz, answer questions, and receive a score at the end. It follows the guidelines provided in the assignment to create a Single Page Application (SPA) using Next.js, React, and styled-components. The app fetches quiz questions from the 'https://quizapi.io/' API using a unique API key and guides the user through the quiz-taking process.
Main Motive
The main moto for this project was to work with vanilla css apart from my tailwind projects and using styled components inplace of utility classes of tailwind css.
Problems faced as a Tailwind user
A basic thing which i think many people face using vanilla CSS after tailwind is Box Sizing as of default its not border-box which just make padding go outside or something similar to that so we have to set it manually to border-box.
Screens
The app consists of three main screens: Home, Question, and Report. Each screen serves a specific purpose in the quiz-taking process.
Technologies Used
The project utilizes Next.js for server-rendered React applications, React for building user interfaces, and styled-components for styling React components. It showcases your practice with styled-components and your ability to build a single web app with state management.