All databases

Cursor rule

React Mobx Cursorrules Prompt File

Cursor rules for React development with MobX integration.

Prefer functional components with hooks

js
const preferFunctionalComponents = true;

MobX best practices

js
const mobxBestPractices = [
  "Use MobX-react-lite for optimal performance with functional components",
  "Implement stores for managing application state",
  "Utilize computed values for derived state",
  "Use actions for modifying observable state",
  "Implement proper error handling in asynchronous actions",
];

Folder structure

js
const folderStructure = `
src/
  components/
  stores/
  hooks/
  pages/
  utils/
`;

Additional instructions

js
const additionalInstructions = `
1. Use TypeScript for type safety with MobX
2. Implement strict mode for MobX for better debugging
3. Use observer HOC or useObserver hook for reactive components
4. Implement proper dependency injection for stores
5. Use reaction for side-effects based on observable changes
6. Utilize MobX DevTools for debugging
7. Follow MobX best practices for scalable state management
`;

More Frontend rules

Frequently asked questions

What is the React Mobx Cursorrules Prompt File Cursor rule?

Cursor rules for React development with MobX integration. It is a Frontend rule, stored as react-mobx-cursorrules-prompt-file.mdc.

How do I use the React Mobx Cursorrules Prompt File rule in Cursor?

Copy the rule from this page and save it as react-mobx-cursorrules-prompt-file.mdc in your project's .cursor/rules folder, or paste it into Cursor's project rules settings.