Quizz app - Solo project (Scrimba)

This was the solo project at the end of the React class on Scrimba.
For information about the content of the class please see here.

Install

Download the repo to your local, we were using React 18 and Vite.
Please check out the dependencies and versions in the package.json file.
The app will run on your local host.

Introduction

In this project we elaborated the app with chatGPT (both 3.5 and 4, as a plus user on openai).
The aim was to learn using chatGPT as an assistant for coding. Also we had the design of the app in Figma, which of course helps a lot to start with (link to my Figma here).

We started by feeding chatGPT 4 with a prompt describing the context of the app and attaching a screenshot of the introduction screen from Figma:
Promt: "I am starting a new project in react, which is a quiz app. I need first help to design the app. Also I am using react 18 and Vite. I am attaching a picture of the start screen for the app. Can you generate both the code (App.jsx, Intro.jsx) and the styling (style.css) for it? Also keep in mind that this is just for starting the quiz game, then another component will be shown to the user with the actual quiz questions. I will give you another picture to build the question component."

From there on we developed the app first with chatGPT 4, and when we used all our free requests, we switched to chatGPT 3.5.

In our opinion, the most difficult part was the implementation of the answer options colours: lavender colour when answers are selected by user, and as soon as the user press the 'check answers' button, the correct answers will be shown in green, and the wrong answers in red (see screenshot below).

We reckon that this is one way of creating the app, and probably does not represent 'the' solution. But the app is fully functional as is.
If you have feedback, please create a pull request 😊

Starting screen:

Example of questions and answers with final score:

Conclusion

The experience with using chatGPT 4 and 3.5 for developing this app was very interesting. We believe that with more practice this process will get considerably faster. Especially for apps which are not overwhelmingly complicated. We also think that one has to have knowledge beforehand about how the app should be structured and how the components will interact with the main app. Finally we believe that this way of developing is very suitable for people who are still learning, but want to be able to create apps 👍