diff --git a/src/content/chapter0_basics/lesson01_hello_world/code.gleam b/src/content/chapter0_basics/lesson01_hello_world/code.gleam index 67cc6b4..30530b2 100644 --- a/src/content/chapter0_basics/lesson01_hello_world/code.gleam +++ b/src/content/chapter0_basics/lesson01_hello_world/code.gleam @@ -1,7 +1,5 @@ -// Import a Gleam module from the standard library import gleam/io pub fn main() { - // Print to the console io.println("Hello, Joe!") } diff --git a/src/content/chapter0_basics/lesson01_hello_world/en.html b/src/content/chapter0_basics/lesson01_hello_world/en.html index a7dfc25..b555160 100644 --- a/src/content/chapter0_basics/lesson01_hello_world/en.html +++ b/src/content/chapter0_basics/lesson01_hello_world/en.html @@ -1,16 +1,12 @@ -

Here is a program that prints out the text "Hello, Joe!".

- It does this by using the println function which has been - imported from the - gleam/io - module, which is part of the Gleam standard library. + Here is a tiny program that prints out the text "Hello, Joe!". We'll explain + how it works shortly.

- In a normal Gleam program this program would be run using the command + In a normal Gleam project this program would be run using the command gleam run on the command line, but here in this tour the program - is automatically compiled and run as the code is edited. + is compiled and run inside your web browser, allowing you to try Gleam without + installing anything on your computer.

Try changing the text being printed to Hello, Mike! and see what diff --git a/src/content/chapter0_basics/lesson02_modules/code.gleam b/src/content/chapter0_basics/lesson02_modules/code.gleam new file mode 100644 index 0000000..e258c33 --- /dev/null +++ b/src/content/chapter0_basics/lesson02_modules/code.gleam @@ -0,0 +1,10 @@ +import gleam/io +import gleam/string as text + +pub fn main() { + // Use a function from the `gleam/io` module + io.println("Hello, Mike!") + + // Use a function from the `gleam/string` module + io.println(text.reverse("Hello, Joe!")) +} diff --git a/src/content/chapter0_basics/lesson02_modules/en.html b/src/content/chapter0_basics/lesson02_modules/en.html new file mode 100644 index 0000000..ebfd8bc --- /dev/null +++ b/src/content/chapter0_basics/lesson02_modules/en.html @@ -0,0 +1,26 @@ +

+ Gleam code is organized into units called modules. A module is a + bunch of definitions (of types, functions, etc.) that seem to belong together. + For example, the + + gleam/io + + module contains a variety of functions for printing, like + println. +

+

+ All gleam code is in some module or other, whose name comes from the + name of the file it's in. For example, gleam/io is in a file + called io.gleam in a directory called gleam. +

+

+ For code in one module to access code in another module, we import it using + the import keyword, and the name used to refer to it is the last + part of the module name. For example, to import the + gleam/io module is referred to as io once imported. +

+

+ The as keyword can be used to refer to a module by a different + name. See how the gleam/string module is be referred to as + text here. +

diff --git a/src/content/chapter0_basics/lesson02_unqualified_imports/en.html b/src/content/chapter0_basics/lesson02_unqualified_imports/en.html deleted file mode 100644 index 8fda45e..0000000 --- a/src/content/chapter0_basics/lesson02_unqualified_imports/en.html +++ /dev/null @@ -1,15 +0,0 @@ -

- Normally functions from other modules are used in a qualified fashion, with - the module qualifier before function name. For example, - io.println("Hello!"). -

-

- It is also possible to specify a list of functions to import from a module in - an unqualified fashion, such as the println function in the code - editor. Because it has been imported like this it can be referred to as just - println. -

-

- Generally it is best to use qualified imports, as this makes it clear where - the function is defined, making the code easier to read. -

diff --git a/src/content/chapter0_basics/lesson02_unqualified_imports/code.gleam b/src/content/chapter0_basics/lesson03_unqualified_imports/code.gleam similarity index 100% rename from src/content/chapter0_basics/lesson02_unqualified_imports/code.gleam rename to src/content/chapter0_basics/lesson03_unqualified_imports/code.gleam diff --git a/src/content/chapter0_basics/lesson03_unqualified_imports/en.html b/src/content/chapter0_basics/lesson03_unqualified_imports/en.html new file mode 100644 index 0000000..ca83f2f --- /dev/null +++ b/src/content/chapter0_basics/lesson03_unqualified_imports/en.html @@ -0,0 +1,15 @@ +

+ Normally functions from other modules are used in a + qualified fashion, meaning the name used to refer the module goes + before function name with a dot between them. For example, + io.println("Hello!"). +

+

+ It is also possible to specify a list of functions to import from a module in + an unqualified fashion, meaning the function name can be used without + the module qualifier (the name and the dot) before it. +

+

+ Generally it is best to use qualified imports, as this makes it clear where + the function is defined, making the code easier to read. +

diff --git a/src/content/chapter0_basics/lesson03_type_checking/code.gleam b/src/content/chapter0_basics/lesson04_type_checking/code.gleam similarity index 100% rename from src/content/chapter0_basics/lesson03_type_checking/code.gleam rename to src/content/chapter0_basics/lesson04_type_checking/code.gleam diff --git a/src/content/chapter0_basics/lesson03_type_checking/en.html b/src/content/chapter0_basics/lesson04_type_checking/en.html similarity index 100% rename from src/content/chapter0_basics/lesson03_type_checking/en.html rename to src/content/chapter0_basics/lesson04_type_checking/en.html diff --git a/src/content/chapter0_basics/lesson04_ints/code.gleam b/src/content/chapter0_basics/lesson05_ints/code.gleam similarity index 100% rename from src/content/chapter0_basics/lesson04_ints/code.gleam rename to src/content/chapter0_basics/lesson05_ints/code.gleam diff --git a/src/content/chapter0_basics/lesson04_ints/en.html b/src/content/chapter0_basics/lesson05_ints/en.html similarity index 100% rename from src/content/chapter0_basics/lesson04_ints/en.html rename to src/content/chapter0_basics/lesson05_ints/en.html diff --git a/src/content/chapter0_basics/lesson05_floats/code.gleam b/src/content/chapter0_basics/lesson06_floats/code.gleam similarity index 100% rename from src/content/chapter0_basics/lesson05_floats/code.gleam rename to src/content/chapter0_basics/lesson06_floats/code.gleam diff --git a/src/content/chapter0_basics/lesson05_floats/en.html b/src/content/chapter0_basics/lesson06_floats/en.html similarity index 100% rename from src/content/chapter0_basics/lesson05_floats/en.html rename to src/content/chapter0_basics/lesson06_floats/en.html diff --git a/src/content/chapter0_basics/lesson06_number_formats/code.gleam b/src/content/chapter0_basics/lesson07_number_formats/code.gleam similarity index 100% rename from src/content/chapter0_basics/lesson06_number_formats/code.gleam rename to src/content/chapter0_basics/lesson07_number_formats/code.gleam diff --git a/src/content/chapter0_basics/lesson06_number_formats/en.html b/src/content/chapter0_basics/lesson07_number_formats/en.html similarity index 100% rename from src/content/chapter0_basics/lesson06_number_formats/en.html rename to src/content/chapter0_basics/lesson07_number_formats/en.html diff --git a/src/content/chapter0_basics/lesson07_equality/code.gleam b/src/content/chapter0_basics/lesson08_equality/code.gleam similarity index 100% rename from src/content/chapter0_basics/lesson07_equality/code.gleam rename to src/content/chapter0_basics/lesson08_equality/code.gleam diff --git a/src/content/chapter0_basics/lesson07_equality/en.html b/src/content/chapter0_basics/lesson08_equality/en.html similarity index 100% rename from src/content/chapter0_basics/lesson07_equality/en.html rename to src/content/chapter0_basics/lesson08_equality/en.html diff --git a/src/content/chapter0_basics/lesson08_strings/code.gleam b/src/content/chapter0_basics/lesson09_strings/code.gleam similarity index 100% rename from src/content/chapter0_basics/lesson08_strings/code.gleam rename to src/content/chapter0_basics/lesson09_strings/code.gleam diff --git a/src/content/chapter0_basics/lesson08_strings/en.html b/src/content/chapter0_basics/lesson09_strings/en.html similarity index 100% rename from src/content/chapter0_basics/lesson08_strings/en.html rename to src/content/chapter0_basics/lesson09_strings/en.html diff --git a/src/content/chapter0_basics/lesson09_bools/code.gleam b/src/content/chapter0_basics/lesson10_bools/code.gleam similarity index 100% rename from src/content/chapter0_basics/lesson09_bools/code.gleam rename to src/content/chapter0_basics/lesson10_bools/code.gleam diff --git a/src/content/chapter0_basics/lesson09_bools/en.html b/src/content/chapter0_basics/lesson10_bools/en.html similarity index 100% rename from src/content/chapter0_basics/lesson09_bools/en.html rename to src/content/chapter0_basics/lesson10_bools/en.html diff --git a/src/content/chapter0_basics/lesson10_assignments/code.gleam b/src/content/chapter0_basics/lesson11_assignments/code.gleam similarity index 100% rename from src/content/chapter0_basics/lesson10_assignments/code.gleam rename to src/content/chapter0_basics/lesson11_assignments/code.gleam diff --git a/src/content/chapter0_basics/lesson10_assignments/en.html b/src/content/chapter0_basics/lesson11_assignments/en.html similarity index 100% rename from src/content/chapter0_basics/lesson10_assignments/en.html rename to src/content/chapter0_basics/lesson11_assignments/en.html diff --git a/src/content/chapter0_basics/lesson11_discard_patterns/code.gleam b/src/content/chapter0_basics/lesson12_discard_patterns/code.gleam similarity index 100% rename from src/content/chapter0_basics/lesson11_discard_patterns/code.gleam rename to src/content/chapter0_basics/lesson12_discard_patterns/code.gleam diff --git a/src/content/chapter0_basics/lesson11_discard_patterns/en.html b/src/content/chapter0_basics/lesson12_discard_patterns/en.html similarity index 100% rename from src/content/chapter0_basics/lesson11_discard_patterns/en.html rename to src/content/chapter0_basics/lesson12_discard_patterns/en.html diff --git a/src/content/chapter0_basics/lesson12_type_annotations/code.gleam b/src/content/chapter0_basics/lesson13_type_annotations/code.gleam similarity index 100% rename from src/content/chapter0_basics/lesson12_type_annotations/code.gleam rename to src/content/chapter0_basics/lesson13_type_annotations/code.gleam diff --git a/src/content/chapter0_basics/lesson12_type_annotations/en.html b/src/content/chapter0_basics/lesson13_type_annotations/en.html similarity index 100% rename from src/content/chapter0_basics/lesson12_type_annotations/en.html rename to src/content/chapter0_basics/lesson13_type_annotations/en.html diff --git a/src/content/chapter0_basics/lesson13_type_aliases/code.gleam b/src/content/chapter0_basics/lesson14_type_aliases/code.gleam similarity index 100% rename from src/content/chapter0_basics/lesson13_type_aliases/code.gleam rename to src/content/chapter0_basics/lesson14_type_aliases/code.gleam diff --git a/src/content/chapter0_basics/lesson13_type_aliases/en.html b/src/content/chapter0_basics/lesson14_type_aliases/en.html similarity index 100% rename from src/content/chapter0_basics/lesson13_type_aliases/en.html rename to src/content/chapter0_basics/lesson14_type_aliases/en.html diff --git a/src/content/chapter0_basics/lesson14_blocks/code.gleam b/src/content/chapter0_basics/lesson15_blocks/code.gleam similarity index 100% rename from src/content/chapter0_basics/lesson14_blocks/code.gleam rename to src/content/chapter0_basics/lesson15_blocks/code.gleam diff --git a/src/content/chapter0_basics/lesson14_blocks/en.html b/src/content/chapter0_basics/lesson15_blocks/en.html similarity index 100% rename from src/content/chapter0_basics/lesson14_blocks/en.html rename to src/content/chapter0_basics/lesson15_blocks/en.html diff --git a/src/content/chapter0_basics/lesson15_lists/code.gleam b/src/content/chapter0_basics/lesson16_lists/code.gleam similarity index 100% rename from src/content/chapter0_basics/lesson15_lists/code.gleam rename to src/content/chapter0_basics/lesson16_lists/code.gleam diff --git a/src/content/chapter0_basics/lesson15_lists/en.html b/src/content/chapter0_basics/lesson16_lists/en.html similarity index 100% rename from src/content/chapter0_basics/lesson15_lists/en.html rename to src/content/chapter0_basics/lesson16_lists/en.html diff --git a/src/content/chapter0_basics/lesson16_constants/code.gleam b/src/content/chapter0_basics/lesson17_constants/code.gleam similarity index 100% rename from src/content/chapter0_basics/lesson16_constants/code.gleam rename to src/content/chapter0_basics/lesson17_constants/code.gleam diff --git a/src/content/chapter0_basics/lesson16_constants/en.html b/src/content/chapter0_basics/lesson17_constants/en.html similarity index 100% rename from src/content/chapter0_basics/lesson16_constants/en.html rename to src/content/chapter0_basics/lesson17_constants/en.html diff --git a/src/tour.gleam b/src/tour.gleam index e755b67..7b7272b 100644 --- a/src/tour.gleam +++ b/src/tour.gleam @@ -764,7 +764,6 @@ fn everything_page_html(chapters: List(Chapter)) -> Html { /// Renders the /everything page to a string pub fn everything_page_render(chapters: List(Chapter)) -> String { - // TODO: use proper values for location and such render_page(PageConfig( path: path_everything, title: "Everything!", diff --git a/static/css/code/syntax-highlight.css b/static/css/code/syntax-highlight.css index f44cfe4..d742aab 100644 --- a/static/css/code/syntax-highlight.css +++ b/static/css/code/syntax-highlight.css @@ -7,10 +7,10 @@ defaults to light theme. */ :root { - --code-background: var(--code-background-light); + --code-background: var(--code-background-light); --code-token-base: var(--code-token-base-light); --code-token-punctuation: var(--code-token-punctuation-light); - --code-token-operator: var(--code-token-operator-light); + --code-token-operator: var(--code-token-operator-light); --code-token-keyword: var(--code-token-keyword-light); --code-token-boolean: var(--code-token-boolean-light); --code-token-number: var(--code-token-number-light); @@ -20,14 +20,14 @@ defaults to light theme. --code-token-attribute: var(--code-token-attribute-light); --code-token-string: var(--code-token-string-light); --code-token-function: var(--code-token-function-light); - --code-token-comment: var(--code-token-comment-light); + --code-token-comment: var(--code-token-comment-light); } html.theme-light { - --code-background: var(--code-background-light); + --code-background: var(--code-background-light); --code-token-base: var(--code-token-base-light); --code-token-punctuation: var(--code-token-punctuation-light); - --code-token-operator: var(--code-token-operator-light); + --code-token-operator: var(--code-token-operator-light); --code-token-keyword: var(--code-token-keyword-light); --code-token-boolean: var(--code-token-boolean-light); --code-token-number: var(--code-token-number-light); @@ -37,14 +37,14 @@ html.theme-light { --code-token-attribute: var(--code-token-attribute-light); --code-token-string: var(--code-token-string-light); --code-token-function: var(--code-token-function-light); - --code-token-comment: var(--code-token-comment-light); + --code-token-comment: var(--code-token-comment-light); } html.theme-dark { - --code-background: var(--code-background-dark); + --code-background: var(--code-background-dark); --code-token-base: var(--code-token-base-dark); --code-token-punctuation: var(--code-token-punctuation-dark); - --code-token-operator: var(--code-token-operator-dark); + --code-token-operator: var(--code-token-operator-dark); --code-token-keyword: var(--code-token-keyword-dark); --code-token-boolean: var(--code-token-boolean-dark); --code-token-number: var(--code-token-number-dark); @@ -54,7 +54,7 @@ html.theme-dark { --code-token-attribute: var(--code-token-attribute-dark); --code-token-string: var(--code-token-string-dark); --code-token-function: var(--code-token-function-dark); - --code-token-comment: var(--code-token-comment-dark); + --code-token-comment: var(--code-token-comment-dark); } /* @@ -69,7 +69,8 @@ pre.hljs { .hljs { color: var(--color-token-base); } -.hljs-punctuation { /* and operators */ +.hljs-punctuation { + /* and operators */ color: var(--code-token-punctuation); } .hljs-variable, @@ -114,10 +115,7 @@ pre.hljs { } .hljs-comment { color: var(--code-token-comment); - font-style: italic -} -.hljs-module { - font-weight: bold; + font-style: italic; } /* .hljs-symbol, @@ -134,13 +132,13 @@ pre.hljs { color: var(--code-token-function); } */ .hljs-emphasis { - font-style: italic + font-style: italic; } .hljs-strong { - font-weight: bold + font-weight: bold; } .hljs-link { - text-decoration: underline + text-decoration: underline; } /* @@ -151,7 +149,9 @@ CodeFlask mappings .codeflask .codeflask__textarea { color: var(--code-background); /* Prevents rendering artifacts in dark mode */ - caret-color: var(--code-token-base); /* Makes the text input cursor visible in dark mode */ + caret-color: var( + --code-token-base + ); /* Makes the text input cursor visible in dark mode */ } .codeflask { @@ -199,12 +199,14 @@ CodeFlask mappings .hljs, .codeflask .codeflask__textarea { - transition: background 150ms linear 0s, color 150ms linear 0s; + transition: + background 150ms linear 0s, + color 150ms linear 0s; } .hljs, .hljs *, -.codeflask .codeflask__textarea -.codeflask .codeflask__textarea * { +.codeflask .codeflask__textarea .codeflask .codeflask__textarea * { transition: color 150ms linear 0s; -} \ No newline at end of file +} +