I built a simple trivia with React from Vite that reads from an external JS file.

Here is the main code for the game:

import { useState } from "react";
import "./App.css";
import { questions } from "./assets/newquestions";

const App = () => {
  const [answer, setAnswer] = useState("");
  const [count, setCount] = useState(0);

  const styler = (choice) => {
    if (answer) {
      if (choice === questions[count].answer) {
        return { backgroundColor: "#00FF00", color: "#000000" };
      } else {
        return { backgroundColor: "#FF0000", color: "#000000" };
      }
    }
  };

  return (
    <>
      <h1>
        {count}) {questions[count].question}
      </h1>
      <div className="card">
        <button
          style={styler("A")}
          onClick={() => setAnswer("A")}
          disabled={answer !== ""}
        >
          <h2>A) {questions[count].A}</h2>
        </button>
        <button
          style={styler("B")}
          onClick={() => setAnswer("B")}
          disabled={answer !== ""}
        >
          <h2>B) {questions[count].B}</h2>
        </button>
      </div>
      <div className="card">
        <button
          style={styler("C")}
          onClick={() => setAnswer("C")}
          disabled={answer !== ""}
        >
          <h2>C) {questions[count].C}</h2>
        </button>
        <button
          style={styler("D")}
          onClick={() => setAnswer("D")}
          disabled={answer !== ""}
        >
          <h2>D) {questions[count].D}</h2>
        </button>
      </div>
      {answer ? (
        <button
          onClick={() => {
            setAnswer("");
            setCount(count + 1);
          }}
        >
          Next Question
        </button>
      ) : null}
    </>
  );
};

export default App;

Here is an small snippet of the question code:

export const questions = [
  {
    difficulty: "0",
    question: "Are you ready to start?",
    A: "Yes",
    B: "No",
    C: "No",
    D: "No",
    answer: "A",
  },
  {
    difficulty: "1",
    question: "Which artist painted the Mona Lisa?",
    A: "Picasso",
    B: "Leonardo Da Vinci",
    C: "Andy Warhol",
    D: "Aaron Van Kampen",
    answer: "B",
  },
...
```