{"id":24152092,"url":"https://github.com/diedemiguel/lists-server-actions","last_synced_at":"2025-03-01T19:16:38.571Z","repository":{"id":263431886,"uuid":"886275390","full_name":"dieDeMiguel/lists-server-actions","owner":"dieDeMiguel","description":"Exploring better design patterns in NextJS","archived":false,"fork":false,"pushed_at":"2024-11-25T08:55:06.000Z","size":365,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-12T10:14:58.059Z","etag":null,"topics":["lists","nextjs15","server","server-functions","usetransition"],"latest_commit_sha":null,"homepage":"https://lists-server-actions.vercel.app/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/dieDeMiguel.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-11-10T16:42:13.000Z","updated_at":"2024-11-25T08:55:10.000Z","dependencies_parsed_at":"2024-11-18T15:13:59.272Z","dependency_job_id":"945b548c-73cf-4b98-a353-685bac9cb3a3","html_url":"https://github.com/dieDeMiguel/lists-server-actions","commit_stats":null,"previous_names":["diedemiguel/lists-server-actions"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dieDeMiguel%2Flists-server-actions","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dieDeMiguel%2Flists-server-actions/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dieDeMiguel%2Flists-server-actions/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dieDeMiguel%2Flists-server-actions/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dieDeMiguel","download_url":"https://codeload.github.com/dieDeMiguel/lists-server-actions/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241411544,"owners_count":19958753,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["lists","nextjs15","server","server-functions","usetransition"],"created_at":"2025-01-12T10:14:59.224Z","updated_at":"2025-03-01T19:16:38.550Z","avatar_url":"https://github.com/dieDeMiguel.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# List + Server Actions NextJS 15\n\n## Exploring best practices using NextJS 15, Server Functions and Server Components\n\n### Main Features\n\n- **Pagination**: Content is paginated to enhance user experience, allowing users to navigate through data efficiently.\n- **Tailored \"Next and Previous\" Buttons**: Users can seamlessly navigate between paginated tables with buttons that are appropriately enabled or disabled based on the current page.\n- **Search**: Users can search through the tabulated data while preserving pagination behavior, ensuring a smooth and intuitive search experience.\n- **Loading States**: The `useTransition` hook is utilized to provide the best possible user experience by displaying loading states during data fetching and transitions.\n- **Server-Side Rendering (SSR)**: The component architecture is designed to leverage SSR, providing an optimized and fast user experience by rendering content on the server.\n\n### Installation:\n\n- We'll use pnpm\n\n  ```sh\n  pnpm install\n  ```\n\n- Setup your environment variables\n\n  ```bash\n  cp .env.example .env.development.local\n  ```\n\n- Then, open the `.env.development.local` file and fill in the required environment variables.\n\n\n- You'll need all the `POSTGRES_*` variables from the Vercel dashboard to access the Vercel Postgres API. The Vercel Postgres API is used to store the current backgrounds and their status.\n\n\n- You can get all the Vercel variables by using the Vercel CLI by running `vercel link`\n\n- Initialize your DB\n\n  ```\n  psql \"\u003cYOUR POSTGRES_URL\u003e\" -f src/db/schema.psql\n  ```\n\n- Run the development server\n\n  ```\n  pnpm dev\n  ```\n\nYou're all set : ) Happy Coding\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdiedemiguel%2Flists-server-actions","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdiedemiguel%2Flists-server-actions","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdiedemiguel%2Flists-server-actions/lists"}