Top 5 Scriban Playlist

Yes, I am still headfirst down the Scriban rabbit hole, grappling with queries, arrays, and little Scriban gems that make life easy. And so, to be fair to Akshay and Kamruz who must format this stuff, this post is brief and refreshingly free from overwrought code blocks.

As an aside, I think I have found the line between Scriban and when a view rendering might be better, more on that later - enough chit-chat. Here we go, headphones on, my current Scriban Top 5.

#1 Here we go Looby Loo

<iframe width="1140" height="642" src="https://www.youtube.com/embed/EHaoEKcuX0g" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Adding something to the first item in a loop. As an example, below adding the active class to a bootstrap element, useful for tabs, menus, carousels, modals, etc. {{if for.first == true}} active{{end}}

Also, from the same artist:

• `{{for.index}}` The current index of the for loop
• `{{for.rindex}}` The current index of the for loop starting from the end of the list
• `{{for.first}}` A boolean indicating whether this is the first step in the loop
• `{{for.last}}` A boolean indicating whether this is the last step in the loop
• `{{for.even}}` A boolean indicating whether this is an even row in the loop
• `{{for.odd}}` A boolean indicating whether this is an odd row in the loop

#2 Counting the Beat

<iframe width="1140" height="642" src="https://www.youtube.com/embed/fyclnTdrSOI" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Creating an array and removing duplicates. One fun discovery was the ability to create an array of unique items using the Scriban array functions, examples include array.sort and array.uniq, they can be chained:

{{sorted = categories | array.uniq | array.sort | array.insert_at 0 "All"}}

This sorts an array into A-Z unique items and inserts a new array item at the start.

https://github.com/lunet-o/scriban/blob/master/doc/builtins.md#array-functions

#3 FREEEEEE-EEEE (Nelson Mandela)

<iframe width="1140" height="642" src="https://www.youtube.com/embed/AgcTvoWjZJU" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Freeing the Front End Traditionally, Sitecore development has involved HTML mock-ups, shoehorned into views or worse Webforms, and forever locked up and consigned to the hamster wheel of source control – whattaya means you need an extra div?

Scriban lets you store those HTML constructs in the content tree where they are easily editable and exportable through Creative Exchange – no more needing FE devs to run a Sitecore stack – (though Docker does change the calculation on this one).

Bonus! Those nested nightmare rendering variants can be reduced to one or two items.

#4 Dream (Javascript) Weaver

<iframe width="1140" height="642" src="https://www.youtube.com/embed/jEn8nm80GCg" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Dynamic JavaScript-driven by Sitecore. Being able to easily pop item properties into presentation layer JavaScript, this is a total dream tool for front end UX construction, i.e.

size = $("#{{elementId}} .row").size();

$('#{{elementId}} .row:lt('+x+')').slideDown();

Bingo Dingo.

#5 Don’t You Forget About Me

<iframe width="1140" height="642" src="https://www.youtube.com/embed/CdqoNKCCt7A" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Yes, you can do some fun and clever stuff with Scriban, but down forget the content authors and those who may be using your creation for the first time.

To that end, putting some helpful text in is… well helpful, especially if your script isn’t returning anything and like me, you’ll be in Experience Editor asking “where did my rendering go?”

{{ if (o_pagemode.is_experience_editor_editing) }}A helpful editing message HERE{{end}}

On a final note, I am really pleased to see that members of my team who are undoubtedly much better developers than myself, have seen the potential of Scriban and piled in, they are now much better than me at this and that is the real reward for sharing new tech, get in there man!

Twitter @NZsitecore LinkedIn brucedavisgoff