What is Strudel.js?

Strudel (/ˈstruːd(ə)l/) is a lightweight component framework. Main target for Strudel are interactive websites - classical approach to HTML generated by back-end that requires some interactions. Strudel is not optimised to build web applications, as there are plenty frameworks that solves apps problems nicely (React, Angular, Vue). On the other hand Strudel biggest goal is to provide great way of writing interactive bits on pages like tabs, accordions and carousels in server-side rendered websites - it’s achieved through ECMAScript 2015 and declarative syntax of decorators.

Getting started

Strudel is component framework so code is organised into components and components are center piece of front-end development.. To create a component you need to simply create a class and bind it to existing DOM using @Component decorator as in example below.

<div class="greeter"></div>
class Greeter {
init() {
this.$element.html('Hello world!');

Such a component will be instantiated for every occurrence of element with .greeter class that will be present on the page. More about components in Components section.

Yet another framework?

As there was mentioned in the Getting started Strudel goal is not to compete with React, Angular or Vue. If you are looking for Virtual DOM powered, Reactive framework for building complex apps Strudel is not for you.

Strudel is not a competition for Angular, React or Vue

However if you need a library for taking care of DOM and Event handling in ECMAScript 2015 flavoured sauce that will help you organise your front-end code in your back-end rendered website then you should definitely take a look at Strudel.

Why not Typescript?

Typescript is a great superset of the Javascript language which support decorators out of the box. Adding types however feels a little bit too much for Strudel, as biggest target audience should are developers switching directly from jQuery, so adding Typescript on top of Webpack and Babel would be too much.

Next steps

Strudel is still currently under heavy development so if you have a great idea for the missing API I would like to contribute into the development of the framework, feel free to navigate to Community subpage. Before version 1.0 expect much more new features.