LearnThat
Learning a language is a long and grueling process that takes years of consistent practice and dedication. LearnThat is the perfect Google Chrome Extension to help you make that journey just a little bit easier. When reading your language of choice on your laptop but coming across a word you don’t know, simply double-tap to highlight it and pull up the definition. However, instead of being just a more accessible dictionary, LearnThat will also store the words you don’t know in memory and allow you to access all these words later for you to review!
MVP
- Double-click on a word (highlight it) to pull up its definition and save it to a vocabulary list
- Click to hear word pronunciation
- Keep track of how many times each word is double-tapped, and display a short quiz of the most double-tapped words often
- Sort different vocabulary words into folders
- Display the “Word You Struggled the Most With” based on data from the past x days
Stretch Goals
- Keep track of the context that you last saw the word in
- Feature to write your own definition of a word (for slang)
- Display stats of the most saved words, total words searched up
- Allow user to manually type in a word to save (for audio)
- Generate a random daily word in target language for them to practice
- Quiz game feature to practice words (like Quizlet Matching)
Tech Stack
- React
- Firebase
- Translation API (tbd)
- Google Chrome Extension
Things to Install
Tutorials
Timeline
Week 1:
- Decide on roles
- Confirm app MVP and discuss any other features to be added
- Download software, set up environment and Git, watch tutorials
Week 2:
- Learn how to create UI for Google Chrome extensions, research existing extensions for inspo
- Create wireframes and get feedback
- User authentication with Firebase
Week 3:
- Get a definition popup when text is highlighlighted
- Decide on a translation API and start getting definitions
- Finalize front-end design after getting input
- Start coding the front-end
Week 4:
- Code the front-end of pop-up code display
- Code Home Page
- Keep working on getting a definition pop-up when text is highlighted
- Add API functionality to the definition pop-up
Week 5:
- Code the Login page
- Code Settings page
- Store the number of times a word is looked up
- Make the saved words show up in the webpage
Week 6:
- Integrate the front-end and back-end
- Ensure that everything connects properly
Week 7:
- Code the Vocabulary Page to display history of words
- Display the most frequently searched word of the past 7 days
- Calculate the most frequently searched word of the past 7 days
Week 8:
- Add animations to the front-end for extra style points
- begin working on presentation
Week 9:
- Finish presentation and being practicing
- Brainstorm fun ideas for presentation
Week 10:
- Prepare for presentation and live demo!
Competition/Inspiration
Github CheatSheet!
Master cheatsheet: https://www.atlassian.com/dam/jcr:8132028b-024f-4b6b-953e-e68fcce0c5fa/atlassian-git-cheatsheet.pdf
| Some basic ones: |
Command |
Description |
| cd "LearnThat" |
Change directories to our repository |
| git branch |
Lists branches for you |
| git branch "branch name" |
Makes a new branch |
| git checkout "branch name" |
Switch to branch |
| git checkout -b "branch name" |
Same as the 2 previous commands together |
| git add . |
Finds all changed files |
| git commit -m "Testing123" |
Commit with message |
| git push origin "branch" |
Push to branch |
| git pull origin "branch" |
Pull updates from a specific branch |
Developers
- Oudom Pach
- Ranvir Patel
- Jakob Kuhnen
- Chuanjie Duanmu
Project Manager
Industry Mentor