How to Build a Quiz App using a Strapi API with Angular

This tutorial is a guide on how to create a quiz app. The app will use Strapi as a backend server and Angular in the frontend.


This is a companion discussion topic for the original entry at https://strapi.io/blog/build-a-quiz-app-using-a-strapi-api-with-angular

Hi! I downloaded the source code on git and when we launch the application, the final result (score) does not work.

I’m looking at your screenshot and there’s a difference between your choice and the correct response. Look at the last screenshot of the article and compare it to yours. Your Strapi content types may not be set up right. For example, you selected D for question 1 , but your Strapi app is expecting Bamako . Maybe read through the Creating Content Types section a second time because there seems to be a difference in how you made the Question content type on the Strapi app.

Found your issue. When adding answers to questions on Strapi, use the choice letter, not the actual text answer. For example, if D. Bamako is your answer, put D as your answer in Strapi, not Bamako.

This was not made clear in the tutorial. That was my fault. I’m hopefully doing a revision of this for Strapi v4. I’ll be sure to add sample data so readers can have examples of how to add data/content.

Here’s a screenshot of one question I added in the tutorial. Note that the text answer is Roots. But in the answer field, I did not put Roots. I put A (the choice).

Help please, I am running

$ strapi generate:api quiz name:string description:text

and i get

You need to run strapi generate in a Strapi project. Make sure you are in the right directory

I had that (…strapi generate…) problem also. Could workaround by NOT using

npx create-strapi-app 

, but instead:

strapi new yourProjectName and had tried to change the package.json engines part because of I use node v16 and then executed another yarn install --ignore-engines from inside the newly created strapi project

Then your model and the routes etc. and then strapi build and strapi start

Currently I am stuck at the angular part, still trying… Tried also downloading the sources from GitHub, but it looks there strapi code is missing, it`s just ng this and ng that in the scripts

Where can I find the working app that includes the strapi project source code also?

I am finding it difficult to generate the strapi app. After generating it not loading the localhost