React와 Chakra UI, Ai를 활용한 설문조사를 활용한 설문조사 - 2 수정
어제 작업한 결과물에서 설문지에 대한 답을 클릭했을 때 점수를 도출해 내는 과정을 추가 작업하였습니다.마찬가지로 모든 항목을 선택 후 점수보기를 클릭해야 최종 점수가 나오고,점수보기를 클릭 했을 때 선택하지 않은 항목이 있을 경우 해당 질문으로 이동 후 선택 가능하고마지막 선택하지 않은 항목까지 다 선택했을 경우 제일 하단으로 스크롤 이동으로 사용자 편의를 더했습니다. "use client";import { Box, Button, Flex, Heading, IconButton, Progress, Stack, Text, VStack,} from "@chakra-ui/react";import { motion, AnimatePresence } from "framer-motion";impor..
React와 Chakra UI, Ai를 활용한 설문조사를 활용한 설문조사 - 2
1. 설문 답변을 클릭 시 스크롤 이벤트 발생2. 설문 답변에 따라 progress bar 움직임3. 마지막 질문의 답변을 클릭하면 제출하기 버튼 활성화4. 제출하기 버튼을 클릭 했을 때 답변하지 않은 질문이 있을 경우, alert 창으로 답변하지 않았다고 뜸5. 답변하지 않은 질문으로 이동6. 답변하지 않은 질문이 여러 개 일 때 순차적으로 이동7. 마지막으로 답변한 곳에 제출하기 버튼 활성화"use client";import { Box, Button, Flex, Heading, Progress, Stack, Text, VStack,} from "@chakra-ui/react";import Link from "next/link";import { useEffect, useRef, useSt..
React와 Chakra UI, Ai를 활용한 설문조사
1. 설문 답변을 클릭 시 다음 질문으로 이동2. 설문 답변에 따라 progress bar 움직임3. 마지막 질문의 답변을 클릭하면 제출하기 버튼 활성화4. 제출하기 버튼을 클릭 했을 때 답변하지 않은 질문이 있을 경우, alert 창으로 답변하지 않았다고 뜸5. 답변하지 않은 질문으로 이동6. 답변하지 않은 질문이 여러 개 일 때 순차적으로 이동7. 마지막으로 답변한 곳에 제출하기 버튼 활성화 "use client";import { Box, Button, Flex, Heading, IconButton, Progress, Stack, Text, VStack,} from "@chakra-ui/react";import { motion, AnimatePresence } from "framer-..
