/Flashcard-Generator

Supercharge your studying with our Flashcard Generator web app! Effortlessly create flashcards, keep them organized for easy access, and share them with others. You can even add images and include multiple terms on each card. Plus, you have complete control over the length of your descriptions! Utilizing dynamic forms and toolkits.

Primary LanguageJavaScript

This is a Flashcard Generator Capstone Project.

This mostly comprises 3 pages.

Flashcard Page to Create

Flashcards I Have Page

Flashcard Details Page

  • Problem Statement for the Flashcard Details Page:To design a Flashcard Generator Web Application with primarily 3 pages,

  • The first page was for creating a flashcard, which had two forms: one for the name and description of the flashcard and the ability to add images; the second form was for creating a dynamic form using FORMIK, which has individual card names and descriptions. The Flashcard will be produced when you click the Create Button.

  • Formik & Redux Toolkit is used for Global State Management and also supports form validations.

  • On the second page, all of the user-created cards were revealed. By default, the user can only see 6 cards; however, after selecting the See All button, all of the remaining cards are shown.

  • After choosing View Cards, the user is sent to the flashcard information page, where they may view all the cards on that flashcard and pick which cards to display in the center sections by clicking the menu on the left side.

  • The Share, Download, and Print buttons are located on the right side. By clicking the Share button, a Modal opens, allowing the user to copy the link there. By pressing the Copy to Clipboard button, the link is copied to the clipboard, allowing the user to paste it anywhere.

  • The user may post the produced flashcard to their social media accounts using the bottom-side modal on platforms including Facebook, Instagram, Whatsapp, Twitter, and Mail.

GitHub : https://github.com/dpvasani/Flashcard-Generator

Live Demo : https://flashcard-generator56.netlify.app/