The Web Framework for Dart Developers
Jaspr is a free and open source framework for building websites in Dart.
Create fast and dynamic web experiences with ease in a familiar language and ecosystem.
Everything is a Component
Jaspr Components are the fundamental building blocks of any Jaspr website and look very similar to Flutter widgets. However, Jaspr renders actual HTML and CSS from your components, resulting in great SEO and fast loading times.
app.dart
button.dart
1import 'package:jaspr/jaspr.dart';
2import 'button.dart';
3
4class App extends StatelessComponent {
5 const App({super.key});
6
7 @override
8 Iterable<Component> build(BuildContext context) sync* {
9 // Hover me!
10 yield h2([text('Everything is a Component')]);
11 yield p([text('Jaspr Components are the fundamental building blocks ...')]);
12
13 yield div(classes: 'actions', [
14 Button(
15 primary: true,
16 label: 'Try out in Playground',
17 icon: 'rocket',
18 ),
19 Button(
20 label: 'Read the Docs',
21 icon: 'book-text',
22 ),
23 ]);
24 }
25}
1name: my_awesome_website
2description: A new Jaspr site.
3
4environment:
5 sdk: ">=3.0.0 <4.0.0"
6
7dependencies:
8 jaspr: ^0.16.0
9 jaspr_router: ^0.2.3
10
11dev_dependencies:
12 jaspr_builders: ^0.16.0
13 jaspr_web_compilers: ^4.1.0
14 jaspr_lints: ^0.2.1
15
16jaspr:
17 mode: static
The productivity of Dart
brought to the Web
counter.dart
1Iterable<Component> build(BuildContext context) sync* {
2 yield button(
3 onClick: () {
4 setState(() => count++);
5 },
6 [ text('Clicked $count times'), ]
7 );
8}
Familiar Concepts
Apply your Flutter skills to build websites. Reuse already learned concepts like BuildContext, setState and much more.
$
jaspr serve
[CLI] Running jaspr in static rendering mode.
[CLI] Starting web compiler...
[BUILDER] Connecting to the build daemon...
[BUILDER] About to build [web]...
[CLI] Building web assets...
[BUILDER] Running build...
[BUILDER] Running build completed.
[CLI] Done building web assets.
[CLI] Starting server...
[SERVER] [INFO] Server hot reload is enabled.
[SERVER] [INFO] Running server in debug mode
[SERVER] Serving at http://localhost:8080
Jaspr CLI
Create, serve and build your site using simple cli commands.
1name: my_awesome_website
2
3dependencies:
4 cloud_firestore: ^5.6.2
5 dart_mappable: ^4.3.0
6 http: ^1.3.0
7 intl: ^0.19.0
8 jaspr: ^0.17.0
9 logging: ^1.3.0
10 riverpod: ^2.6.1
11 shared_preferences: ^2.4.0
Packages and Plugins
Import any Dart package from pub.dev or even use Flutter web plugins through Jasprs custom compiler pipeline.
app.dart
1class App extends StatelessComponent {
2 const App({super.key});
3
4 Iterable<Component> build(BuildContext context) sync* {
5 yield div([
6 ...
Linter and Code Completions
Jaspr comes with its own lints and code completions to boost your productivity during development.
Comes with
Everything You Need
Routing
Simple yet powerful routing system that works for all modes.
Data Fetching
Fetch data on the server during pre-rendering and sync data to the client.
SEO
Optimize for search engines with pre-rendering and meta tags.
State Management
Use your favorite state management solution, like Riverpod or Provider.
Flutter Embedding
Embed Flutter widgets seamlessly in your Jaspr website.
Custom Backends
Integrate Jaspr with any Dart backend, like Shelf, Serverpod or Dart Frog.
Styling
Write styles in Dart, integrate with Tailwind or use any CSS based styling solution.
Testing
Write tests for your components and pages with Jasprs testing library.
Trusted by
Dart Experts
“Jaspr is an amazing usage of Dart's web stack and a compliment to Flutter web. It's a great place to start if you want to use HTML and CSS with Dart.”
Kevin Moore
Product Manager for Dart and Flutter at Google
“Jaspr is a great way to build websites with Dart, and with its Serverpod integration you also get access to a full ORM to talk with your database.”
Viktor Lidholt
Founder of Serverpod
“I chose Jaspr to build a landing page for my business because Flutter has poor SEO performance. What impressed me the most is the ability to do everything in Dart instead of JavaScript. The support for hydration, server-side rendering, and built-in Tailwind integration blew me away. I've been using Jaspr since version 0.10.0, and it keeps getting better with every release. The community Kilian built around it is super passionate, and I can't wait for it to become the de-facto standard for building web experiences with Dart.”
Dinko Marinac
Flutter Freelancer and Consultant
“I've been using Jaspr with Tailwind CSS to build sites like course.temiajiboye.com, temiajiboye.com, and flutteryeg.com, and I've been really impressed. The SSR support and component-based approach makes it feel like Flutter for the web, but with the flexibility of Dart. It's smooth, efficient, and just makes sense. If you're into Dart and want to build modern web apps, definitely give Jaspr a try!”
Temi Ajiboye
Mobile Developer
Join the Community
Sponsor Jaspr
Jaspr is free and open source. Sponsorships allow me to spend more time developing the framework and keep the project sustainable in the years to come. I'm super thankful for all support.
Current Sponsors
Are you interested in a larger sponsoring including a prominent logo placement on this website? Contact me at kilian@schultek.dev.