nanostores VS payload

use a shared state manager like nanostores

I retrieved access to files the directory of words using the Astro.glob() function super easily (too bad I couldn't talk about how powerful this function is; how glad I am it existed out-the-box in Astro and how much ease it brought into the flow of getting this search engine up and running) and plugged the returned array of word objects into a $dictionary state (maybe I should call this a store) powered by nanostore (another beautiful stuff right there)

In its docs, Astro recommends nanostores, but I’ve used effector in the past. And LOVED IT. So I’ve used it for this project as well.

Nanostores explanation

vidstack is very light on technical details but starts with a concise intro and a screenshot, as well as relevant links: https://github.com/vidstack/player

payload is well-structured in general: https://github.com/payloadcms/payload

nanostores starts out with an intro and telling code examples, followed by lots of technical details: https://github.com/nanostores/nanostores

Nanostores and Reatom are also great, fast atomic libs

Astro handles multi-framework components (React, Vue, etc) and they recommend using the nanostores library for shared state.

Checkout Nanostore it's what Astro.build recommends for sharing state across different ui libraries.

All of these are valid ways of fixing the state management issue, but it's clear that we need to find a common solution that works for all the UI libraries. This is where nanostores comes into play! The description they provide on their GitHub page is simply perfect:

Payload, a CMS powered by Next.js, or Sveltia CMS, a Decap CMS alternative using Svelte, are examples of CMS that I recommend to avoid until they become framework agnostic.

Learn how to implement a custom tagging system in Payload CMS using the array field and a custom React component! This video walks you through building a dynamic tag input where users can add, remove, and manage tags directly within the Payload admin panel.

This post details a proof-of-concept integration of Firebase Authentication with Payload CMS, focusing on the client-side implementation using Next.js. The goal is to allow users to authenticate via Firebase's various sign-in methods and then use the resulting Firebase ID token to securely access data and functionality within a Payload CMS instance. This is a work in progress, and I welcome feedback and suggestions for improvement.

Check out https://swissknife.cc/!

I made a super fast image compressor that can handle up to 40 images at once, though it can do far more if needed. I'm currently limiting it to 40 images to explore the limits. It supports JPEG and PNG formats, making it perfect for social media and web use. Built entirely with Next.js and Payload (a headless CMS https://payloadcms.com/). This is just one of many tools we'll be adding to SwissKnife.cc.It's free to use, and your feedback is welcome. If you're interested or want a specific tool added, let me know!

Give it a try and share your thoughts!

Payload Official Auth Example

One of the most critical features for enterprise solutions is real-time data updates—whether for dashboards, notifications, or live collaboration. While Payload CMS doesn’t natively support WebSockets (yet), I put together a solution to enable real-time updates today!

Quick overview, Cheat Sheet, for The access control functions following Payload CMS 3 structure, which allows defining rules for read, create, update, and delete operations using dynamic conditions.

Check out Payload - fully OSS, modeled after the … few good parts of WP

https://payloadcms.com

Payload is the open-source, fullstack Next.js framework, giving you instant backend superpowers. Get a full TypeScript backend and admin panel instantly. Use Payload as a headless CMS or for building powerful applications.