Certainly! Here's an updated and more attractive README file with added emojis:
Welcome to the Flashcard Generator website! 📚 This platform has been developed with the purpose of creating and customizing flashcards for various educational, professional, or personal uses.
-
Card Creation: On the "Create FlashCard" page, users can craft personalized flashcards by creating distinct "MainGroups" and "TermGroups." The "MainGroup" section allows users to name the group, upload images, and add descriptions. The "TermGroup" section permits the input of term details, image selection, and dynamic addition of term groups using the "Add Term" button. The "Create Card" button generates a flashcard incorporating all provided data.
-
Display of Cards: Transition to the "My FlashCards" page to encounter a summarized card view, showcasing main group particulars. This includes the group name, description, and the count of associated flashcards. Clicking the "View Cards" button allows users to access a detailed term group view. Created flashcards can also be removed if they are no longer needed.
-
View, Export, and Sharing: Users can view and interact with each flashcard, utilizing the "Share," "Download," and "Print" buttons. Thanks to the react-pdf library, downloading and printing have been made possible by converting the flashcard blob into a PDF.
-
Responsive Design: The project is designed to work seamlessly across various devices and screen sizes, including desktop computers, tablets, and smartphones.
-
Clean and Efficient UI / UX: The user interface has been tailored according to pre-determined criteria. We've ensured a clean UI and incorporated some out-of-the-box approaches to enhance User Experience, including alert messages and frame motion animations at every step of flashcard creation, exportation, or deletion.
- React
- Tailwind CSS
- Redux Toolkit
- React-Hook-Form
- React-pdf
- Formik
- Yup
- React Icons
-
Clone the project
git clone https://github.com/dpvasani/FlashCardGenerator.git
-
Go to the project directory
cd FlashCardGenerator-Almabetter -
Install dependencies
npm install
-
Start the server
npm run start