fuzzy/frontend-assistant icon
public
Published on 5/20/2025
Frontend Assistant

Microfrontends: Turborepo + Vite + Module federation + React + Typescript + Tailwindcss + Shadcn UI

Rules
Prompts
Models
Context
ollama qwen3:30b-a3b-q8_0 model icon

qwen3:30b-a3b-q8_0

ollama

65kinput·32koutput
ollama qwen2.5-coder:7b model icon

qwen2.5-coder:7b

ollama

ollama qwen2.5-coder:1.5b model icon

qwen2.5-coder:1.5b

ollama

ollama gemma3:27b-it-q8_0 model icon

gemma3:27b-it-q8_0

ollama

65kinput·32koutput
ollama snowflake-arctic-embed model icon

snowflake-arctic-embed

ollama

ollama nomic-embed-text model icon

nomic-embed-text

ollama

- Follow Turborepo for scaling monorepos and build system.
- Use pnpm for package management.
- Use Vite for build tool.
- Use Vitest for unit testing.
- Follow Reactjs & typescript patterns
- Use Tailwind CSS v4 for styling.
- Use Shadcn UI for components.
- Use TanStack Query (react-query) for frontend data fetching.
- Use React Hook Form for form handling.
- Use Zod for validation.
- Use Zustand and React Context for state management
- Follow eslint-plugin-react and prettier guide for code formatting.
- Use PascalCase when creating new React files. UserCard, not user-card.
- Use named exports when creating new react components.
- DO NOT TEACH ME HOW TO SET UP THE PROJECT, JUMP STRAIGHT TO WRITING
  COMPONENTS AND CODE.
You are an experienced data scientist who specializes in Python-based
data science and machine learning. You use the following tools:
- Python 3 as the primary programming language
- PyTorch for deep learning and neural networks
- NumPy for numerical computing and array operations
- Pandas for data manipulation and analysis
- Jupyter for interactive development and visualization
- Conda for environment and package management
- Matplotlib for data visualization and plotting
Reacthttps://react.dev/reference/
Turborepohttps://turbo.build/repo/docs
Vitehttps://vite.dev/guide/
Vitesthttps://vitest.dev/guide/
Tailwindcsshttps://tailwindcss.com/docs
Shadcn UIhttps://ui.shadcn.com/docs/installation
React hook formhttps://react-hook-form.com/docs
Zodhttps://zod.dev/
Zustandhttps://zustand.docs.pmnd.rs/getting-started/introduction
React Queryhttps://tanstack.com/query/latest/docs/framework/react/overview
Ag-Gridhttps://www.ag-grid.com/react-data-grid/getting-started/
Module federationhttps://module-federation.io/guide/start/index.html
torch.nn Docshttps://pytorch.org/docs/stable/nn.html
Pandashttps://pandas.pydata.org/docs/
NumPyhttps://numpy.org/doc/stable/

Prompts

Learn more
Data Pipeline Development
Create robust and scalable data processing pipelines
Generate a data processing pipeline with these requirements:

Input:
- Data loading from multiple sources (CSV, SQL, APIs)
- Input validation and schema checks
- Error logging for data quality issues

Processing:
- Standardized cleaning (missing values, outliers, types)
- Memory-efficient operations for large datasets
- Numerical transformations using NumPy
- Feature engineering and aggregations

Quality & Monitoring:
- Data quality checks at key stages
- Validation visualizations with Matplotlib
- Performance monitoring

Structure:
- Modular, documented code with error handling
- Configuration management
- Reproducible in Jupyter notebooks
- Example usage and tests

The user has provided the following information:
Exploratory Data Analysis
Initial data exploration and key insights
Create an exploratory data analysis workflow that includes:

Data Overview:
- Basic statistics (mean, median, std, quartiles)
- Missing values and data types
- Unique value distributions

Visualizations:
- Numerical: histograms, box plots
- Categorical: bar charts, frequency plots
- Relationships: correlation matrices
- Temporal patterns (if applicable)

Quality Assessment:
- Outlier detection
- Data inconsistencies
- Value range validation

Insights & Documentation:
- Key findings summary
- Data quality issues
- Variable relationships
- Next steps recommendations
- Reproducible Jupyter notebook

The user has provided the following information:

Context

Learn more
@code
Reference specific functions or classes from throughout your project
@docs
Reference the contents from any documentation site
@diff
Reference all of the changes you've made to your current branch
@terminal
Reference the last command you ran in your IDE's terminal and its output
@problems
Get Problems from the current file
@folder
Uses the same retrieval mechanism as @Codebase, but only on a single folder
@codebase
Reference the most relevant snippets from your codebase

No Data configured

MCP Servers

Learn more

Exa

npx -y exa-mcp-server

Postgres

docker run -i --rm mcp/postgres ${{ secrets.fuzzy/frontend-assistant/docker/mcp-postgres/POSTGRES_CONNECTION_STRING }}

Playwright

npx -y @executeautomation/playwright-mcp-server

Memory

npx -y @modelcontextprotocol/server-memory

Browser MCP

npx -y @browsermcp/mcp@latest

Sequential Thinking

docker run --rm -i mcp/sequentialthinking

Repomix

npx -y repomix --mcp

Tavily Search

npx -y tavily-mcp@latest

GitHub

npx -y @modelcontextprotocol/server-github

Github

docker run -i --rm -e GITHUB_PERSONAL_ACCESS_TOKEN mcp/github