Shark: A Flutter server rendering framework

Photo by Craig Manners on Unsplash

Recently, I was developing a Flutter server rendering framework called shark.

If you don’t know what server rendering is and what is it for, you can read this

https://www.omnisci.com/technical-glossary/server-side-rendering

After a month, shark finally reached 1.0 stable 👌

Here is how to use it in 1 Minute.

Add dependency to your flutter application

flutter pub add shark

After install the dependency, you need to init the shark library first before any usage.

void main() {
    WidgetsFlutterBinding.ensureInitialized();
    await Shark.init(hostUrl: 'http://yourhost.com');
    
    runApp(MyApp());
  }

From above, hostUrl is the place you host your widget server, for your client to grab info from this server.

Now, you can use it on your widget.

late final SharkController _controller;
  
  /// init the shark controller
  @override
  void initState() {
    _controller = SharkController.fromUrl(path: '/container',)..get();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return SharkWidget(
      controller: _controller,
      clickEvent: (event) {
        print(event);
      },
   );
  }

Everything related to your widget is control by SharkController

Path is the url path for your current widget, different widget (page) should consider as different path.

Get is an async method to fetch widget from your server.

clickEvent is the click callback function, you can set it like on your server return json file

"click_event": "route://your_path"

To monitor the state of your widget state

_sharkController.stateStream.listen((state) {
  if (state == SharkWidgetState.success) {
    print(_sharkController.value);
  }
});

And the widget has only 3 state

/// Shark Widget request status
enum SharkWidgetState {
  success, error, loading, init
}

Here it is, now, you should see your widget now !

For more information, head to shark github page

GitHub - lau1944/shark: A Flutter server rendering framework

If you want a sample shark server rendering server.

GitHub - lau1944/shark-server: A shark framework server sample

Thank you for your reading !