Frontend#solidjs#basic
Solidjs Basic
Cursor rules for Solid.js development with basic setup.
Use it with Cursor, or export as AGENTS.md / CLAUDE.md for other AI coding agents — pick a format below.
// Solid.js Basic Setup .cursorrules
// Prefer functional components
const preferFunctionalComponents = true;
// Solid.js best practices
const solidjsBestPractices = [
"Use createSignal() for reactive state",
"Utilize createEffect() for side effects",
"Implement createMemo() for derived values",
"Use createResource() for data fetching",
"Implement Show and For components for conditional and list rendering",
"Utilize createStore() for complex state management",
];
// Folder structure
const folderStructure = `
src/
components/
pages/
utils/
App.jsx
index.jsx
public/
index.html
`;
// Additional instructions
const additionalInstructions = `
1. Use JSX for component templates
2. Implement proper error boundaries
3. Utilize Solid Router for routing when applicable
4. Use Solid's built-in optimization features
5. Implement lazy-loading for improved performance
6. Follow Solid.js naming conventions and best practices
7. Use server-side rendering (SSR) when needed
`;How to use: save the file at your project root (e.g.
.cursorrules or AGENTS.md) and your AI editor picks it up automatically.Related rules
Frontend→
Next.js
Next.js with TypeScript and Tailwind UI best practices
#nextjs
Frontend→
Next.js App Router
Cursor rules for Next.js development with App Router integration.
#nextjs#app#router
Frontend→
Next.js Material UI Tailwind Cssmpt
Cursor rules for Next.js development with Material UI and Tailwind CSS integration.
#nextjs#material#ui#tailwind