Neocities’ mission is to “make the web fun again by giving you back control of how you express yourself online.” Their user-friendly platform for creating and hosting web content provides a crucial first step for aspiring designers and programmers. Neocities hosts millions of simple HTML sites, so we thought we would demonstrate how easy it is to use Fauna with a single page application deployed to Neocities.
With a secure database that scales from the smallest experiments on the free plan, to powering global brands on the web, the door is open for both beginning and experienced developers to build zero-maintenance apps that can seamlessly transition from “Hello, World!” to worldwide popularity.
Fauna’s object-level security and user authentication allow you to connect to the cloud database
directly from your browser app. Since mobile clients call the same API, no backend changes are required when you add native app support. With pay-as-you-go pricing, you’re only ever charged for actual usage with no upfront investment. Your small experiments can run for free and when one becomes popular, Fauna will scale up (and down) for you, remaining fast under pressure. You don’t even need to manually add nodes or other capacity. It’s automatic and continuous.
Getting Started with Fauna and Neocities
In future blog posts, we’ll extend the security model by adding support for inviting others to collaborate on your lists. By doing so, we’ll demonstrate Fauna’s native fine-grained access control.
To run your own copy of the app:
- Click Create a Database.
- Enter the name todomvc-fauna-spa in the text box.
- Click Create Database again.
3. Set up two database keys, one for with the server role which is used for setting up the schema, and one with the client role which is used by the browser code for creating new users:
- Click ** / ** in the upper left side of the screen.
- Click Manage Keys and Create a Key.
- Name your key, assign it a server role, and choose the todomvc-fauna-spa database.
- Click Create Key.
- Your key’s secret will be displayed. Immediately copy it to schema.js
- Then repeat the process, assigning this second key the client role and copying the key’s secret into Login.js.
4. Clone the project’s repo here
git clone https://github.com/fauna/todomvc-fauna-spa.git
5. Then install the dependencies:
6. Run schema.js locally:
7. Build the app bundle for uploading:
npm run build
neocities push .
neocities command will prompt you to login to your Neocities account and then to upload your site.
Then you’re ready to browse to your new app, sign up, and start tracking your to-dos, all of which are securely stored in a strongly consistent, globally replicated, multi-cloud database: Fauna!
We encourage you to tinker with the app! Just make sure to run
npm run build after any code changes before updating your Neocities site. If you want to preview your changes, just run
npm start for a local server.
We’ll talk more about security in the next few blog posts. The FaunaDsecurity model is designed for connecting to the database directly from mobile apps and web browsers. All user authentication and fine-grained, object-level access control can be managed by Fauna. In some circumstances, this can actually be more secure than relying on middleware for authentication authorization. A native security model is especially useful for applications that directly use the cloud database, and it can also enhance existing security mechanisms through defense-in-depth, where access control can be enforced at all layers of the stack.