Create a single-page SPA using React and Tailwind CSS. The SPA should function as a platform to promote and facilitate the publication of government grant-funded research in non-profit, open-access journals.
Key features to implement:
1. **Research Project Identification**: A way for users (researchers) to input or identify their government grant-funded research projects. This could involve fields for grant number, funding agency, project title, abstract, and keywords.
2. **Open Access Journal Database**: A searchable database of non-profit, open-access journals. Users should be able to filter journals by discipline, impact factor (if available, but emphasize non-profit/OA status), editorial policies, and submission process.
3. **Submission Guidance**: Tools or links to guide researchers on how to submit their work to these journals. This could include links to journal submission portals, manuscript preparation guidelines, and best practices for open-access publishing.
4. **User Profiles**: Basic user profiles for researchers to track their submissions, publications, and journal discoveries. Allow institutions to have organizational profiles.
5. **Dashboard (for funders/institutions)**: A simplified dashboard for funding agencies or institutions to track how their funded research is being published, with a focus on adherence to open-access policies.
**Technical Requirements**:
- **Framework**: React
- **Styling**: Tailwind CSS for rapid UI development.
- **State Management**: Context API or Zustand (keep it simple for MVP).
- **Routing**: React Router DOM.
- **Data Fetching**: Use `fetch` API or Axios. Mock data for initial development or consider a simple backend setup if time permits for more dynamic features.
- **UI Components**: Design clean, modern, and intuitive UI components. Focus on readability and ease of navigation.
**Page Structure (Single Page Application)**:
- **Header**: Application title, navigation links (Home, Journal Search, My Research, About).
- **Home/Landing Page**: Overview of the platform's mission, benefits, and a prominent call to action (e.g., 'Find Open Access Journals' or 'Submit Your Research').
- **Journal Search Page**: Interactive search and filter interface for the journal database. Display journal results in a card or list format.
- **Journal Detail Page (Modal/Overlay)**: When a journal is selected, show its details (name, description, scope, OA policy, submission link, non-profit status verification).
- **My Research Page**: User-specific area to manage their research projects and track submission status (initially manual input).
- **About Page**: Explain the problem, the platform's solution, and the importance of open access.
**Data Mockup (Example)**:
```json
[
{
"id": 1,
"title": "Journal of Sustainable Science",
"description": "Publishes research on environmental sustainability.",
"discipline": "Environmental Science",
"oa_policy": "Fully Open Access, CC-BY license.",
"non_profit": true,
"submission_url": "https://journals.example.com/jss/submit",
"website": "https://journals.example.com/jss"
},
{
"id": 2,
"title": "Global Health Innovations",
"description": "Focuses on public health advancements in developing nations.",
"discipline": "Public Health",
"oa_policy": "Open Access with article processing charges (APCs) waived for researchers from low-income countries.",
"non_profit": true,
"submission_url": "https://ghinnovations.org/submit",
"website": "https://ghinnovations.org"
}
]
```
**Focus on building a functional front-end MVP. Prioritize clear information display and user flow over complex backend integrations for this initial build.**