Toolverse
All skills
Frontend

server-actions

by davepoon

This skill should be used when the user asks about \

Installation

Pick a client and clone the repository into its skills directory.

Installation

Quick info

Author
davepoon
Category
Frontend
GitHub repo

About this skill

This skill should be used when the user asks about \

How to use

  1. Zainstaluj skill server-actions w swoim projekcie Next.js. Skill zawiera szablony i dokumentację do pracy z Server Actions w App Router.

  2. Utwórz plik akcji (np. app/actions.ts) i dodaj dyrektywę 'use server' na górze pliku. Zdefiniuj funkcje asynchroniczne, które będą obsługiwać mutacje danych — na przykład createPost, deletePost czy submitContact. Każda funkcja otrzyma FormData z formularza.

  3. W komponencie (Server lub Client Component) zaimportuj akcję i przekaż ją do atrybutu action w tagu form. Formularz automatycznie wyśle dane do akcji na serwerze bez konieczności pisania fetch czy API route.

  4. Wewnątrz akcji wyodrębnij dane z FormData za pomocą get(), waliduj je i wykonaj operacje bazodanowe (create, update, delete). Po zakończeniu możesz użyć revalidatePath lub revalidateTag do odświeżenia cache'u.

  5. Dla bardziej zaawansowanej obsługi formularzy użyj hooków useFormState i useFormStatus — pozwalają one śledzić stan submisji i wyświetlać feedback użytkownikowi w czasie rzeczywistym.

  6. Testuj akcje poprzez normalne submisje formularzy w aplikacji. Skill zawiera przykłady contact form i post creation, które możesz dostosować do swoich potrzeb.

Related skills

landing-page-guide-v2

by bear2u

Create distinctive, high-converting landing pages that combine proven conversion elements with exceptional design quality. Build beautiful, memorable landing pages using Next.js 14+ and ShadCN UI that avoid generic AI aesthetics while following the 11 essential elements

Frontend
3486

better-icons

by better-auth

Use when working with icons in any project. Provides CLI for searching 200+ icon libraries (Iconify) and retrieving SVGs. Commands: `better-icons search u003cqueryu003e` to find icons, `better-icons get u003cidu003e` to get SVG. Also available as MCP server for AI agents.

Frontend
2037

react

by lobehub

React component development guide. Use when working with React components (.tsx files), creating UI, using @lobehub/ui components, implementing routing, or building frontend features. Triggers on React component creation, modification, layout implementation, or navigation tasks.

Frontend
2058

browser-use

by browser-use

Automates browser interactions for web testing, form filling, screenshots, and data extraction. Use when the user needs to navigate websites, interact with web pages, fill forms, take screenshots, or extract information from web pages.

Frontend
23107

2d-games

by davila7

2D game development principles. Sprites, tilemaps, physics, camera.

Frontend
2674

apple-reminders

by openclaw

Manage Apple Reminders via the `remindctl` CLI on macOS (list, add, edit, complete, delete). Supports lists, date filters, and JSON/plain output.

Frontend
2085