Develop Glossary Builder Apps
Create a professional glossary application with this AI prompt, offering intuitive search, categorization, and cross-referencing features.
What This Prompt Does
- ●Provides a complete React + TypeScript codebase for a professional glossary application.
- ●Implements advanced features like fuzzy search, cross-referencing, and export capabilities.
- ●Ensures a user-friendly, mobile-responsive interface with glassmorphic design and smooth animations.
Tips for This Prompt
- ●Define clear objectives for the glossary, ensuring it aligns with the team's productivity goals and addresses terminology chaos effectively.
- ●Conduct a thorough analysis of the current terminology sources and user needs to tailor the glossary's features and data structure.
- ●Continuously gather feedback from users to refine and improve the glossary's functionality and user experience.
How to Use the Prompt
- ●Fill in the [SPECIFY THE INDUSTRY OR PURPOSE FOR THE GLOSSARY], [NUMBER OF PEOPLE WHO WILL USE THIS GLOSSARY], [BASIC/INTERMEDIATE/ADVANCED TERMINOLOGY COMPLEXITY], [MAIN SCENARIOS WHERE THE GLOSSARY WILL BE USED], and [CURRENT TERMINOLOGY SOURCE OR NONE IF STARTING FROM SCRATCH] placeholders with specific information about your industry, team size, complexity level, use cases, and data source.
- ●Example: "Industry: Healthcare, Team Size: 50, Complexity Level: Advanced, Use Cases: Onboarding and daily reference, Existing Data Source: Internal medical terminology database."
The Prompt
<context> You are working with a user who needs a professional glossary application to solve critical terminology chaos that's killing their team's productivity. Industry teams are drowning in inconsistent acronyms, new hires can't onboard effectively due to knowledge trapped in scattered systems, and existing static glossaries sit unused as PDFs. They need a living, searchable knowledge base that becomes the single source of truth - enterprise-grade functionality with an intuitive interface that people actually want to use daily. </context> <role> You are a world-class information architect and enterprise UX developer who has built documentation systems for Microsoft, Salesforce, and AWS. After witnessing countless teams struggle with knowledge silos and terminology chaos, you discovered that the secret to adoption isn't just functionality - it's creating interfaces so clean and intuitive that using them feels effortless. You obsessively study how users actually interact with glossaries and have developed a framework that combines Notion's clean aesthetic with Stripe's minimalism to create knowledge systems that teams genuinely love using. </role> <response_guidelines> ● Provide complete React + TypeScript code with all components fully implemented ● Structure code with clear separation of concerns and reusable components ● Apply modern UI patterns with glassmorphic design and smooth animations ● Include comprehensive search functionality with fuzzy matching and highlighting ● Implement practical features like cross-referencing, categorization, and export capabilities ● Use semantic HTML and accessibility best practices throughout ● Focus on mobile-first responsive design with intuitive navigation ● Include realistic sample data that demonstrates all features effectively ● Add performance optimizations like debounced search and loading states ● Provide complete working solution that can be immediately deployed </response_guidelines> <task_criteria> Build a complete professional glossary application with instant search, category filtering, cross-referencing between terms, and rich usage examples. Create a React + TypeScript application using Tailwind CSS for styling and localStorage for data persistence. Implement fuzzy search across terms, definitions, and tags with highlighted matches. Include alphabetical navigation, multi-select category filtering, individual term detail pages, and admin functionality for adding/editing terms. Apply glassmorphic UI design with smooth transitions and mobile responsiveness. Add export functionality for PDF/CSV, cross-referencing between related terms, and keyboard shortcuts for power users. Populate with 20+ realistic sample terms. Focus on creating a production-ready application with proper error handling, loading states, and accessibility features. Avoid incomplete implementations or placeholder code - provide fully functional components ready for immediate use. </task_criteria> <information_about_me> - Industry/Purpose: [SPECIFY THE INDUSTRY OR PURPOSE FOR THE GLOSSARY] - Team Size: [NUMBER OF PEOPLE WHO WILL USE THIS GLOSSARY] - Technical Complexity Level: [BASIC/INTERMEDIATE/ADVANCED TERMINOLOGY COMPLEXITY] - Primary Use Cases: [MAIN SCENARIOS WHERE THE GLOSSARY WILL BE USED] - Existing Data Source: [CURRENT TERMINOLOGY SOURCE OR NONE IF STARTING FROM SCRATCH] </information_about_me> <response_format> <project_structure>Complete file structure and component organization for the glossary application</project_structure> <core_components>Main React components including SearchBar, TermCard, CategoryFilter, AddTermForm, and TermDetail</core_components> <data_management>TypeScript interfaces, sample data structure, and localStorage implementation</data_management> <search_functionality>Fuzzy search implementation with highlighting and filtering capabilities</search_functionality> <ui_implementation>Tailwind CSS styling with glassmorphic design, animations, and responsive layout</ui_implementation> <advanced_features>Cross-referencing, export functionality, keyboard shortcuts, and admin features</advanced_features> <deployment_setup>Complete setup instructions and configuration for immediate use</deployment_setup> </response_format>
Related AI Prompts
Discover more high-performing prompts in Coding
Build Full-Stack Software Architectures
Generate production-grade full-stack applications with this AI prompt, including architecture adherence, type-safe code, testing, security, and deployment configurations.
Build Real Products
Build real products with this AI prompt, guiding you through discovery, planning, development, polish, and deployment with full transparency and control.
Build Scientific Calculators
Build advanced scientific calculators with this AI prompt, featuring arithmetic operations, trigonometric functions, memory storage, calculation history, and responsive design.
Build Secure Login Authentication Scripts
Generate secure login scripts with this AI prompt, featuring authentication logic, security hardening, rate limiting, CSRF protection, and iterative self-review processes.
Build Portfolio Websites
Create a stunning React portfolio with this AI prompt, featuring interactive design and seamless functionality.
Write Custom Automation Scripts
Automate daily tasks with this AI prompt, building custom scripts using Python, Bash, or JavaScript with security, scheduling, and error handling.