Part 1: Introduction to Curi
In this set of tutorials, we will be building a single page application from scratch using Curi. The application will be a website for a book store. Users will be able to browse through books and "purchase" ones that they want.
What is Curi?#
Before we get started, let's quickly define what Curi is and is not.
- Curi is an asynchronous single page application router.
- Being a single page application router means that with Curi, you can navigate to pages within your application without sending requests to the server.
- Being asynchronous means that you can load data (and code) prior to rendering a new page instead of rendering loading screens while you wait for data to be fetched.
- Curi is response based. Whenever navigation happens, Curi will create a new response object by matching itsroutes to the new location. The response will then be emitted so that the application can re-render using the new response.
- Curi is not framework specific. It does not matter to Curi how you render your application; Curi is only concerned with navigation and route matching. That said, there are a couple official framework specific packages (e.g.
@curi/vue) that provide integration with Curi, but these are not required for you to be able to use Curi.
These tutorials aim to be quite easy to pick up without a lot of prior knowledge required. However, there are a couple things you should keep in mind.
- If you plan to follow along locally, you need to have Node/NPM installed.
- Again, if you plan to follow along locally, you should be comfortable with basic terminal (command line) usage. Nothing crazy, just commands like
- You should be familiar with either React or Vue. These aren't the only frameworks that you can use with Curi, but they are the only ones that this tutorial is (currently) written for.