Synonyms Glossary Application

A fullstack application for managing a glossary of words and their synonyms. Built with Flask (Python) backend and React (TypeScript) frontend.

Features

• User authentication (register, login, logout)
• Create, read, update, and delete glossary entries
• Search for words and their synonyms
• View word details with definitions and related synonyms

Project Structure

• backend/: Flask application with REST API
• frontend/: React TypeScript application with Material UI

Prerequisites

• Python 3.8+ with pip
• Node.js 14+ with npm
• Git (optional)

Setup and Installation

Quick Start

1. Clone or download this repository to your local machine
2. Navigate to the project directory: cd synonyms-glossary
3. Make the start script executable: chmod +x start.sh (if not already executable)
4. Run the start script: ./start.sh

This will:

• Build the React frontend
• Copy the build files to the Flask backend's static directory
• Set up a Python virtual environment and install dependencies
• Start the Flask server

Manual Setup

Backend Setup

1. Navigate to the backend directory: cd backend
2. Create a virtual environment: python3 -m venv .venv
3. Activate the virtual environment: source .venv/bin/activate (Linux/Mac) or .venv\Scripts\activate (Windows)
4. Install dependencies: pip install -r requirements.txt
5. Set environment variables:

   export FLASK_APP=run.py
   export FLASK_ENV=development
   export FLASK_DEBUG=true
   

6. Run the Flask application: flask run

Frontend Setup

1. Navigate to the frontend directory: cd frontend
2. Install dependencies: npm install
3. Start the development server: npm start

Development

Backend

• The backend is built with Flask and uses SQLAlchemy for database operations
• Authentication is handled with JWT tokens
• API endpoints follow RESTful conventions

Frontend

• The frontend is built with React and TypeScript
• Material UI is used for components and styling
• Axios is used for API calls
• React Router is used for client-side routing

Production Deployment

For production deployment:

1. Set appropriate environment variables for the backend:

   export FLASK_ENV=production
   export FLASK_DEBUG=false
   export SECRET_KEY=your-secret-key
   export JWT_SECRET_KEY=your-jwt-secret-key
   export DATABASE_URL=your-database-url
   

2. Build the frontend: cd frontend && npm run build

3. Copy the build files to the backend static directory

4. Run the Flask application with a production WSGI server like Gunicorn:

   gunicorn --bind 0.0.0.0:5000 run:app
   

License

MIT License