Personalized English Vocabulary Learning App Built with React Native & NestJS
Last updated May 10, 2026
48
Stars
13
Forks
1
Issues
0
Stars/day
Attention Score
5
Topics
Language breakdown
No language data available.
โธ Files
click to expand
README
WordSage ๐๐ฑ
WordSage is a personalized English vocabulary learning app built with React Native and NestJS, designed to help users enhance their vocabulary in an engaging and effective way. The application covers over 1500 words, including their meanings, synonyms, antonyms, and example sentences. It also offers interactive quizzes to reinforce learning and track progress over time.
๐ Features
- โจ Personalized Learning: WordSage customizes the learning experience based on each user's skill level and progress, ensuring efficient learning.
- ๐ Vast Vocabulary: Access a comprehensive database of words, including their meanings, synonyms, antonyms, and example sentences with voice pronunciations.
- ๐ง Interactive Quizzes: Engage in quizzes that are interactive, reinforcing your learning and allowing you to track your progress over time.
- ๐ค User Profiles: Create user profiles to monitor your learning journey.
- ๐ฅ๏ธ Admin Panel: The intuitive admin panel, built with React, enables easy management of app content and user data.
- ๐ฑ Cross-Platform: The app is built with React Native, allowing it to run on both Android and iOS devices.
๐ ๏ธ Tech Stack
- โ๏ธ Frontend: React Native, Redux Toolkit
- ๐งฑ Backend: NestJS
- ๐พ Database: MongoDB
- ๐จ Admin Panel: React, Vite, and Tailwind CSS
โ๏ธ Installation
๐ Prerequisites
- ๐ฆ Node.js (Developed with v16)
- ๐๏ธ MongoDB or MongoDB Atlas
- ๐ฑ Expo Go app (for Android)
Note: Newer versions of Node.js may not be compatible with the dependencies used in the frontend. If you encounter any issues, consider using NVM to manage multiple versions of Node.js on your machine.
๐ Steps
- Clone the repository:
git clone https://github.com/nz-m/WordSage.git
- Install dependencies:
frontend, backend, and admin-panel
npm install
- Create
.envfiles:
backend and admin-panel directories following the format in the .env.example file.
- Setup backend URL in frontend:
frontend directory, locate the baseUrl.js file in the constants folder and change the value of the APIBASEURL variable to the URL of the backend server.
- Start the backend server:
npm start
Access http://127.0.0.1:4000/docs to view the API documentation. 6. Start the admin panel
npm start
- Access the admin panel at
http://127.0.0.1:5173/and add learning contents:
backend directory in the resources folder with appropriate file names.
- Start the app (frontend):
npm start
Scan the QR code using the Expo Go app to run the app on your mobile device.
๐ท Screenshots

๐ค Contributing
Contributions are welcome. See CONTRIBUTING.md for more details.
๐ฌ Feedback
If you have any feedback, please reach out to me at neaz6160@gmail.com
๐ License
This project is licensed under the MIT License.
๐ More in this category