diff --git a/civet.dev/.vitepress/components/Hero.vue b/civet.dev/.vitepress/components/Hero.vue index 9920ff1f..51134bee 100644 --- a/civet.dev/.vitepress/components/Hero.vue +++ b/civet.dev/.vitepress/components/Hero.vue @@ -7,6 +7,11 @@ const actions = [ text: 'Reference', link: '/reference', }, + { + theme: 'alt', + text: 'Cheatsheet', + link: '/cheatsheet', + }, { theme: 'alt', text: 'Civet playground', diff --git a/civet.dev/.vitepress/config.mjs b/civet.dev/.vitepress/config.mjs index 27e314f0..3771e741 100644 --- a/civet.dev/.vitepress/config.mjs +++ b/civet.dev/.vitepress/config.mjs @@ -27,6 +27,7 @@ export default async function vitePressConfig() { nav: [ { text: 'Getting started', link: '/getting-started' }, { text: 'Reference', link: '/reference' }, + { text: 'Cheatsheet', link: '/cheatsheet'}, { text: 'Comparison', link: '/comparison' }, { text: 'Integrations', link: '/integrations' }, { text: 'Config', link: '/config' }, diff --git a/civet.dev/cheatsheet.md b/civet.dev/cheatsheet.md new file mode 100644 index 00000000..4e0b75d6 --- /dev/null +++ b/civet.dev/cheatsheet.md @@ -0,0 +1,185 @@ +--- +title: Cheatsheet +aside: false +--- + +# {{ $frontmatter.title }} + +Here's a quick overview of the language. For more detailed information take a look at the [Reference](/reference). + + + +
+ +```ts +// Declarations +const x = 1 +let y: number = 2 +var z: string = "3" +x := 1 // const x = 1 +y .= 2 // let y = 2 + +// Destructuring +[ a, b ] := x +[ ..., last ] := x +[ first, ...rest ] := x +[ first, ..., last ] := x +[ first, ...middle, last] := x + +{ a, b } := c + +``` + +```ts +// Function application +f(x) +f(a, g(x)) +f(...args, cb) + +// Implicit application +f x // f(x) +f a, b, c // f(a, b, c) +f g x // f(g(x)) +f a, b c // f(a, b(c)) + +``` + +```ts +// Conditionals +x && y +x and y // x && y +x || y +x or y // x || y + +// relationals +x === y +x is y // x === y +x < y +x > y +// Chained relationals +x < y < z // x < y && y < z +``` + +```ts +// this +this +// shorthand +@ // this +@x // this.x + +// instance of and typeof shorthand +x instanceof y +x 11 + "it's big" + +unless paused + run() + +// loops +while x < 10 + f(x) + x++ + +for item of items + update item + +for key in object + log key + +for own key in object + log `my ${key}` +``` + +```ts +// Postfix loops/conditionals +f(x) if x +log name for name of names + +``` + +```ts +// Arrow Functions +inc := (x) => x + 1 +add := (a, b): T => a + b + +// Thin arrow -> is equivalent to `function` +f := (this: ctx, a, b) -> + ctx.log a, b if ctx.debug + +``` + +```ts +// Block shorthand +people.map .name // people.map($ => $.name) +numbers.filter & % 2 is 0 +// numbers.filter($ => $ % 2 === 0) + +// # Conditional declarations +throw error if { error } := result + +if [, dir, base] := /^(.*\/)?([^/]*)$/.exec file + console.log dir, base +``` + +```ts +// JSX +// Better binding + + + +// Closing is optional +
+