https://github.com/kelechi-onwuka/thinkflip

Responsive flashcard app built with HTML, CSS & JS. Built to support focused, effective studying.
https://github.com/kelechi-onwuka/thinkflip

beginner-project css educational flashcards html javascript personal-project responsive-design webapp webdevelopment

Last synced: about 2 months ago
JSON representation

Responsive flashcard app built with HTML, CSS & JS. Built to support focused, effective studying.

• Host: GitHub
• URL: https://github.com/kelechi-onwuka/thinkflip
• Owner: Kelechi-Onwuka
• License: mit
• Created: 2025-04-01T02:17:27.000Z (about 1 year ago)
• Default Branch: main
• Last Pushed: 2025-04-02T21:13:15.000Z (about 1 year ago)
• Last Synced: 2025-04-02T21:22:28.656Z (about 1 year ago)
• Topics: beginner-project, css, educational, flashcards, html, javascript, personal-project, responsive-design, webapp, webdevelopment
• Language: CSS
• Homepage: https://kelechi-onwuka.github.io/ThinkFlip/
• Size: 217 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# ThinkFlip

A responsive flashcard web app built with HTML, CSS, and JavaScript. Users can create, flip, and manage flashcards to study more effectively.

Originally built for friends preparing for exams, ThinkFlip is designed for anyone looking for a quick, no-signup study tool. Now includes persistent flashcard saving using local storage.

![ThinkFlip Screenshot](screenshot.png)

## Features

- Add custom questions and answers

- Flip cards to test memory

- Edit or delete flashcards

- Undo recent deletions

- View flashcard history

- Study tips that rotate automatically

- **Flashcards are saved automatically (via browser local storage)**

- **"Welcome Back" message for returning users**

- Mobile-friendly layout

## Mobile Usage

*Mobile-friendly, but best used on a laptop or desktop.*

## How to Use

1. Open the `index.html` file in a web browser

2. Enter a question and answer

3. Click "Add Flashcard"

4. Use **Flip**, **Next**, and **Previous** to navigate

> A live version is also available here:  

> **[https://kelechi-onwuka.github.io/ThinkFlip](https://kelechi-onwuka.github.io/ThinkFlip)**

## Tech Stack

- HTML

- CSS (Responsive design with Flexbox & Grid)

- JavaScript (DOM manipulation + localStorage)

## Planned Features

- User authentication (sign up / login)

- Flashcard syncing across devices using a database

---

### Contact

Made with ❤️ by **Kelechi Onwuka**

---

## License

MIT License