hacklab/strudel
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

replace tutorial with workshop

Browse source 
+ move parts of tutorial to more
+ move more before Pattern Functions
This commit is contained in:
Felix Roos 2023-06-07 21:22:01 +02:00
parent 02d793e9e0
commit 105193a452
10 changed files with 87 additions and 195 deletions
Download patch file Download diff file Expand all files Collapse all files

30
website/src/pages/learn/code.mdx
View file

@ -6,31 +6,31 @@ layout: ../../layouts/MainLayout.astro
import { MiniRepl } from '../../docs/MiniRepl';
import { JsDoc } from '../../docs/JsDoc';
# Strudel Code
# Coding Syntax
Now that we have played some notes using different sounds, let's take a step back and look how we actually achieved this using _code_.
Let's take a step back and understand how the syntax in Strudel works.
Let's look at this simple example again. What do we notice?
Take a look at this simple example:
<MiniRepl client:idle tune={`freq("220 275 330 440").s("sine")`} />
<MiniRepl client:idle tune={`note("c a f e").s("piano")`} />
- We have a word `freq` which is followed by some brackets `()` with some words/letters/numbers inside, surrounded by quotes `"220 275 330 440"` (corresponding to the pitches a3, c#4, e4, a4).
- Then we have a dot `.` followed by another similar piece of code `s("sine")`.
- We can also see these texts are _highlighted_ using colours: word `freq` is purple, the brackets `()` are grey, and the content inside the `""` are green.
- We have a word `note` which is followed by some brackets `()` with some words/letters/numbers inside, surrounded by quotes `"c a f e"`
- Then we have a dot `.` followed by another similar piece of code `s("piano")`.
- We can also see these texts are _highlighted_ using colours: word `note` is purple, the brackets `()` are grey, and the content inside the `""` are green. (The colors could be different if you've changed the default theme)
What happens if we try to 'break' this pattern in different ways?
<MiniRepl client:idle tune={`freq(220 275 330 440).s(sine)`} />
<MiniRepl client:idle tune={`note(c a f e).s(piano)`} />
<MiniRepl client:idle tune={`freq("220 275 330 440")s("sine")`} />
<MiniRepl client:idle tune={`note("c a f e")s("piano")`} />
<MiniRepl client:idle tune={`freq["220 275 330 440"].s{"sine"}`} />
<MiniRepl client:idle tune={`note["c a f e"].s{"piano"}`} />
Ok, none of these seem to work...
<MiniRepl client:idle tune={`s("sine").freq("220 275 330 440")`} />
<MiniRepl client:idle tune={`s("piano").note("c a f e")`} />
This one does work, but now we can't hear the four different events and frequencies anymore.
This one does work, but now we only hear the first note...
So what is going on here?
@ -69,14 +69,12 @@ You can also use the keyboard shortcut `cmd-/` to toggle comments on and off.
# Strings
Ok, so what about the content inside the quotes (e.g. `"a3 c#4 e4 a4"`)?
Ok, so what about the content inside the quotes (e.g. `"c a f e"`)?
In JavaScript, as in most programming languages, this content is referred to as being a [_string_](<https://en.wikipedia.org/wiki/String_(computer_science)>).
A string is simply a sequence of individual characters.
In TidalCycles, double quoted strings are used to write _patterns_ using the mini-notation, and you may hear the phrase _pattern string_ from time to time.
If you want to create a regular string and not a pattern, you can use single quotes, e.g. `'C minor'` will not be parsed as Mini Notation.
The good news is, that this covers 99% of the JavaScript syntax needed for Strudel!
Let's now look at the way we can express [Rhythms](/learn/mini-notation)...
The good news is, that this covers most of the JavaScript syntax needed for Strudel!
<br />

4
website/src/pages/learn/factories.mdx
View file

@ -1,12 +1,12 @@
---
title: Pattern Constructors
title: Creating Patterns
layout: ../../layouts/MainLayout.astro
---
import { MiniRepl } from '../../docs/MiniRepl';
import { JsDoc } from '../../docs/JsDoc';
# Pattern Constructors
# Creating Patterns
The following functions will return a pattern.
These are the equivalents used by the Mini Notation:

14
website/src/pages/learn/mini-notation.mdx
View file

@ -8,11 +8,17 @@ import { JsDoc } from '../../docs/JsDoc';
# Mini-notation
Similar to [Haskell Tidal Cycles](https://tidalcycles.org/docs/), Strudel has an "embedded mini-notation" (also called a [domain-specific language, or DSL](https://en.wikipedia.org/wiki/Domain-specific_language)) that is designed for writing rhythmic patterns using little amounts of text.
If you've seen any Tidal code before, you may have noticed the mini-notation and wondered what it's all about.
It's one of the main features of Tidal, and although it might look like a strange way to notate music and other patterns, you will soon see how powerful it can be.
Just like [Tidal Cycles](https://tidalcycles.org/), Strudel uses a so called "Mini-Notation", which is a custom language that is designed for writing rhythmic patterns using little amounts of text.
Before diving deeper into the details, here is a flavour of how the mini-notation looks like:
## Note
This page just explains the entirety of the Mini-Notation syntax.
If you are just getting started with Strudel, you can learn the basics of the Mini-Notation in a more practical manner in the [workshop](http://localhost:3000/workshop/first-sounds).
After that, you can come back here if you want to understand every little detail.
## Example
Before diving deeper into the details, here is a flavour of how the Mini-Notation looks like:
<MiniRepl
client:idle