A new way to share beautiful-looking code

We are super excited to announce the launch of a couple of new features on ScrollStack, which are sure to help up your tech content creation experience!

We at ScrollStack Engineering are aware of how important it is to have sophisticated syntax highlighting and external embed support for code snippets for meaningful programming content creation. While we built a low-barrier content creation platform for the general public on ScrollStack, we were itching to create content tools for us, i.e, people from the tech community.

Introducing the Code block! 😎

Notice the newly added "</>" button to the block options fly-out?

The Code block button in the block options fly-out.

Based on an excellent open-source highlight.js library, the new ScrollStack Code block auto-detects programming language and applies appropriate syntax highlighting to it. This new block supports a wide range of programming languages and also beautifully renders it. Awesome, no? We think so too! ☺️

Here are some real examples of how the code block can be used in your ScrollStack posts.

Python
#!/usr/bin/env python3
import antigravity

def main():
    antigravity.fly()

if __name__ == '__main__':
    main()
Javascript
// Tail Call optimization
function fib(n, a=1, b=0) {
  if (n === 0) {
    return b;
  } else {
    return fib(n-1, b, a+b);
  }
}

// ES6 Tail Call optimization
const fib = (n, a = 1, b = 0) => (n === 0) ? b : fib(n - 1, a + b, a);


fib(10); // 55
CSS
a:link, a:visited, a:hover, a:active {
background-color: green;
color: white;
padding: 10px 25px;
text-align: center;
text-decoration: none;
display: inline-block;
}
TypeScript
interface User {
  name: string;
  id: number;
}

class UserAccount {
  name: string;
  id: number;

  constructor(name: string, id: number) {
    this.name = name;
    this.id = id;
  }
}

const user: User = new UserAccount("Murphy", 1);

Inline Code mark

Inserting inline code is simple and intuitive. The text marked with backtick ' characters is treated as inline code.

Quick tip: If the code marked word has <underscore> at the beginning and end, hit backspace/delete after you complete typing the word.
For example, to mark the word __init__, one has to type <backtick>__init__<backspace/delete><backtick>

External embed support

Github GIST

FYI, if you haven't reserved your subdomain on ScrollStack yet, you can do it here. And for more on what ScollStack is, and why we created it, you can read what our cofounders wrote here.

This feature release is a big win for us in ScrollStack Engineering, because it aligns with our team principle of always coding for open-source and contributing to the Tech community as much as we can. ❤️️


If your thoughts align with us and you are interested in becoming a part of our team here at ScrollStack Engineering, we'd love to hear from you. Below is a quick link of all the currently open positions at in our team. You can write to us at jobs at scrollstack dot com if you think you'll be a good fit for any of the listed profiles.

- Shekhar

Write a comment ...

Stck.me Engineering

Mobile-first, Multi-lingual, Global Payment platform