The last section went through the process of setting up the database engine through an example store plugin as well as demonstrating some of the Stackpress command lines used to manage the database. Before we begin, make sure your code generally syncs up with the project panel below.

If you are all caught up, then you can proceed to the next section.

Adding a React context provider enables the toolkit to be usable in the frontend. Context providers need to be included per view. Let's first setup the Provider in the plugins/app/views/home.tsx file like the following code.

What was done here was first moved the original logic to the component. Next the component was refactored to wrap the component around the component supplied by Stackpress. The reason why it is done this way is because you can't use context states in the same component where the context provider is defined. This is a React thing. With the in place, a context provider hook can now be used in lieu of passing the response directly to the component.

So far this project demonstrates how a pluggable project structure that can be used to build a web application with the following objectives achieved.

If your final files and project code look like the following, then...