new

Announcing the biggest new release since launch

Learn more
Feature

Modern front end tools

Every modern web application needs a proper front end stack. Ruby on Rails uses Webpack as the default (starting with Rails 6). It allows you to add and set up modern packages in your app quickly and easy. Sjabloon comes by default with PostCss, Tailwind Css and Stimulus JS fully set up and ready to go.

close minimise maximise
import { Application } from "stimulus" import Rails from "rails-ujs" import Turbolinks from "turbolinks" import { definitionsFromContext } from "stimulus/webpack-helpers" const application = Application.start() const context = require.context("controllers", true, /.js$/) application.load(definitionsFromContext(context)) Rails.start() Turbolinks.start() import "../stylesheets/application.css"

Webpack

Webpack is the way forward to add great and modern Javascript tools. That's why Sprockets is removed by default in Sjaloon.

PostCSS

PostCss is the (next big) thing for Css. It chains a bunch of (Javascript) plugins together allowing you to do nearly infinite things with your Css. Sjabloon does not use SASS/SCSS, but gives you the same options (using plugins) you love about these post-processors: variables, nesting, and more.

Tailwind CSS

Tailwind is an amazing set of Css utilites with an easy to remember naming convention and a great build tool and plug-ins system. It's build on top of PostCss, so you can create stunning UI real fast that is easy to change and build.

Stimulus JS

Often many (technical) makers dive deep into the latest and greatest Javascript framework. While these certainly have their place, more often than not is this overkill for early versions of your product. Stimulus is a modest framework that provides just enough to write clean and maintainable (sprinkles of) Javascript. Check out the UI components for some examples of Stimulus at work.

Want to use something different?

While I highly recommend this stack to be the most efficient for building amazing looking UI that are versatile and quick to build, it's easy to switch to Vue, React or “JSAmazing2019”.