Installation
Get started with Jaspr and build your first website in Dart.
Follow the steps below to set up a new Jaspr project on your computer.
New Project
To get started simply activate the jaspr command line tool:
dart pub global activate jaspr_cli
Then create a new project like this:
jaspr create my_website
This will walk you through the setup wizard and create a new Jaspr project inside the my_website folder.
The cli will prompt you with a set of options to configure your project. You can read about what each option does below or just start with the recommended ones (simply press Enter each time).
If you are just starting out and are not sure what options to pick, just select the default one for each question (simply press Enter each time).
Choosing a set of options do not lock you into a specific configuration. Starting from one setup you can easily modify your code to behave as any other setup along the way.
After creation, run the development server using the following commands:
cd my_website
jaspr serve
This will spin up a development server at localhost:8080.
You can now start developing your website. 🎉
Observe that the browser automatically refreshes the page when you change something in your
code, like the Welcome text.
Project Options
When creating a new project, you will go through a set of questions to configure the project to your liking. The options set your rendering mode, hydration strategy, routing, flutter interoperability strategy and more.
You can choose from the following options:
- Rendering Mode:
Select one of the three rendering modes Jaspr supports. Read about the different modes here.
- Hydration (Conditional Option):
Select the hydration strategy (automatic or manual). Read about hydration here.
- Routing:
Whether to set up routing. Selecting Yes will setup a basic Routing with two routes ('/home' and '/about'). This gives you a convenient
starting point when you plan to develop a website with multiple pages.
- Multi-Page Routing (Conditional Option):
Whether to set up multi-page or single-page routing, also called server-side or client-side routing respectively. This defined how navigating between routes will behave. Either a "real" page load is performed when navigating to a new route (aka. the browser requests the new page using its url from the server). Or the routing happens purely on the client without any request to the server.
There are different advantages and disadvantages for both types. To help you decide you can find many articles about this topic.
Read more about routing here.
- Flutter Embedding:
Whether to setup an embedded Flutter application with your site. This will use Jasprs first-party integration for Flutter element embedding and create a simple Flutter counter app that synchronizes its state with your Jaspr site.
- Plugin Support:
Whether to enable support for Flutter web plugins. This will switch to Jasprs custom compiler pipeline (replacing build_web_compilers) which allows the use of most Flutter web plugins in your Jaspr site without any additional setup.
Flutter web plugins refers to any Flutter plugin from pub.dev that supports web and is not concerned with widgets or rendering. This includes packages like shared_preferences or firebase.