Na AP criada , preciso que relacionado com a ação que seleciono, haja noticias relativas á mesma
Generated Prompt
## APPLICATION OVERVIEW This project is a web application designed to provide users with relevant news articles based on the actions they select within the app. It aims to create a seamless and engaging experience where users can easily find news that pertains to their interests, enhancing their interaction with the application. ## CORE FEATURES 1. **Action Selection**: A user-friendly interface that allows users to select specific actions, triggering relevant news updates. 2. **News Feed**: A dynamically updated feed that displays articles related to the selected action, complete with titles, summaries, and links to full articles. 3. **Search Functionality**: Enables users to search for specific topics or actions to quickly find related news articles. 4. **Bookmarking System**: Users can bookmark articles for later reading, enhancing their experience and encouraging return visits. 5. **Responsive Design**: The application is fully responsive, providing an optimal viewing experience on both mobile and desktop devices. 6. **User Authentication**: Allows users to create accounts and save their preferences for a personalized experience. ## DESIGN SPECIFICATIONS - **Visual Style**: minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography - **Color Mode**: Light theme with dark text on light backgrounds - **Primary Color**: #1978E5 (accent for buttons, links, highlights) - **Typography**: Use Inter from Google Fonts for headings, Inter for body text and UI elements - **Border Radius**: 8px (moderately rounded) for buttons, cards, and inputs - **Layout**: The main layout should feature a top navigation bar, a central action selection area, a dynamic news feed below, and a sidebar for additional features like search and bookmarks. ## TECHNICAL REQUIREMENTS - **Framework**: React with TypeScript - **Styling**: Tailwind CSS - **UI Components**: shadcn/ui - **State Management**: Redux or Context API for managing user state and news data ## IMPLEMENTATION STEPS 1. Set up the React project with TypeScript and Tailwind CSS. 2. Create the main application structure, including components for the navigation bar, action selector, news feed, and sidebar. 3. Implement user authentication using a suitable library (e.g., Firebase Auth or Auth0). 4. Develop the action selection feature to trigger news updates based on user input. 5. Set up an API to fetch relevant news articles based on the selected action. 6. Implement the bookmarking system to allow users to save articles. 7. Ensure responsive design using Tailwind CSS utilities for various screen sizes. 8. Test the application thoroughly to ensure all features function as expected. ## USER EXPERIENCE Users will interact with the application by selecting an action from a clearly laid-out menu. Once an action is selected, the news feed will automatically update to display relevant articles. Users can utilize the search functionality to filter news, bookmark articles for future reference, and navigate through the app seamlessly. The minimalist design ensures that users can focus on content without distractions, while responsive elements adapt to their device, providing a consistent experience.
Loved by thousands of makers from
From early prototypes to real products, they started here.







































Generate optimized prompts for your vibe coding projects
Generate prompt
Enter a brief description of the app you want to build and get an optimized prompt
Review and use your prompt
Review (and edit if necessary) the generated prompt, then copy it or open it directly in your chosen platform
Get inspired with new ideas
Get AI-generated suggestions to expand your product with features that will surprise your users
Frequently Asked Questions
Everything you need to know about creating better prompts for your Lovable projects
Still have questions?
Can't find what you're looking for? We're here to help!
