We will start by creating a React app using create-react-app. If you want to test the app on CodeSandbox, just make sure to open it on a separate tab. Here's a link to the repository where you can find the code: Īnd here's a link to CodeSandbox. You can create it beforehand, or as part of the login process when we add authentication to the to-do app, by registering instead of logging in.

This tutorial assumes a basic knowledge of React.

solid-ui-react: Library of UI components that make it easier to interact with the data.

solid-client: Library to read and write data in Solid Pods.

This tutorial will help you become familiar with some of the tools available to write Solid applications. This has many advantages for developers as well, because competition is then based on the quality of an app, as opposed to how much user data you control.Īnd for frontend developers there's the added bonus of not having to worry about setting up a database if you want to save user data. Users can decide which apps to use based on which ones suit their needs better, and they have full control of their data. The user controls where that data is, and with which people or apps they want to share it with. The data lives in one place and the app reads and write to that place. With Solid, the data and the app are decoupled. Likewise, if the teacher decides to quit Facebook, she needs to move the students to another app along with the data. Let me illustrate this with an example: if my German teacher decides to create a Facebook group to share class materials, I need to have a Facebook account to access it. This has various consequences for privacy that we're all aware of, but it also endangers the principle of universality of the web: the web must be accessible to everyone. So what do I mean by decentralized? Currently, all our data is centralized in a few web platforms: Facebook, Google, and others. But what is Solid – not to be confused with SOLID? Well, it's a set of conventions and tools used to build decentralized apps.

In this tutorial you will learn how to create a basic Solid to-do app.

Todolist app reactjs