45 lines
1.4 KiB
Dart
45 lines
1.4 KiB
Dart
import 'package:jaspr/jaspr.dart';
|
|
|
|
import '../components/counter.dart';
|
|
|
|
// By using the @client annotation this component will be automatically compiled to javascript and mounted
|
|
// on the client. Therefore:
|
|
// - this file and any imported file must be compilable for both server and client environments.
|
|
// - this component and any child components will be built once on the server during pre-rendering and then
|
|
// again on the client during normal rendering.
|
|
@client
|
|
class Home extends StatefulComponent {
|
|
const Home({super.key});
|
|
|
|
@override
|
|
State<Home> createState() => HomeState();
|
|
}
|
|
|
|
class HomeState extends State<Home> {
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
// Run code depending on the rendering environment.
|
|
if (kIsWeb) {
|
|
print("Hello client");
|
|
// When using @client components there is no default `main()` function on the client where you would normally
|
|
// run any client-side initialization logic. Instead you can put it here, considering this component is only
|
|
// mounted once at the root of your client-side component tree.
|
|
} else {
|
|
print("Hello server");
|
|
}
|
|
}
|
|
|
|
@override
|
|
Iterable<Component> build(BuildContext context) sync* {
|
|
yield section([
|
|
img(src: 'images/logo.png', width: 80),
|
|
h1([text('Welcome')]),
|
|
p([text('You successfully create a new Jaspr site.')]),
|
|
div(styles: Styles.box(height: 100.px), []),
|
|
const Counter(),
|
|
]);
|
|
}
|
|
}
|