FADL285 / Typeform-Judging-Scoreboard-Frontend

Fetch responses from Typeform and display it in a score board - it fetch workspace forms and set each form as card which has Teams (multiple_choice or picture_choice) and display the total rating score. ______ Backend Repo ⬇️⬇️ https://github.com/FADL285/Typeform-Judging-Scoreboard-Backend

Typeform - Judging Scoreboard - Front-End

Fetch responses from Typeform and display it in a score board - it fetch workspace forms and set each form as card which has Teams (multiple_choice or picture_choice) and display the total rating score.

What the application covers?

• Fetch Specific Workspace Forms <WORKSPACE_ID> required
• Bind each form name to a specific category.

  💡 NOTE: Workspace forms are fetched once and then cached on the server, make sure you create the forms before running the app on the server - don't worry, you can update the forms at any time.

• Fetch form responses and return each team score. map each judge to his responses "Judge name is "
• Fetch Form Variable if you need them

Typeform Qurstion Structure

Question	Type
choose a team	multiple_choice or picture_choice
rating question	rating

This is a demo team evaluation form, take a look at it.

Requirements to run it locally

• Node.js

Environment Setup

Copy .env.exmample to .env and update the environment variables with your values

  cp .env.example .env

.env Structure

VITE_APP_NAME="Your App Name"
VITE_BASE_URL="Your Backend Endpoint URL" # Required
VITE_AUTH_USER="Scoreboard Access Username" # Required
VITE_AUTH_PASS="Scoreboard Access Password" # Required
VITE_AUTH_IDENTIFIER="%M0_FAD1@Typeform_Scoreboard@FADL285%#X&^"  # Add a strong password here or keep it as it is 💁

Project Setup

npm install

Compile and Hot-Reload for Development

npm run dev

Compile and Minify for Production

npm run build

Lint with ESLint

npm run lint

Deploy

You can deploy the application on any hosting services platform

Free Hosting Platforms:

• Vercel
• Netlify

Authors

• @FADL285

License

ISC