Skip to content

Instantly share code, notes, and snippets.

@StachuDotNet
Created December 29, 2022 17:18
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save StachuDotNet/bfcfa30903d4784bfe1f6450e93f4d97 to your computer and use it in GitHub Desktop.
Save StachuDotNet/bfcfa30903d4784bfe1f6450e93f4d97 to your computer and use it in GitHub Desktop.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>reveal.js</title>
<link rel="stylesheet" href="dist/reset.css">
<link rel="stylesheet" href="dist/reveal.css">
<link rel="stylesheet" href="dist/theme/black.css">
<!-- Theme used for syntax highlighted code -->
<link rel="stylesheet" href="plugin/highlight/monokai.css">
<!-- https://revealjs.com/backgrounds/ -->
<style>
ul {
font-size: smaller
}
</style>
</head>
<body>
<div class="reveal">
<div class="slides">
<section>
<h2>Darklang,<br> for F# Developers</h2>
<hr>
<p>for F# Advent 2022</p>
<h4>Stachu Korick</h4>
<!--
I've been working on this software tool named Dark/Darklang for a ~year.
It's been really fun and interesting and I'd like to braindump for a bit about it.
This is my submission to F# Advent 2022.
-->
</section>
<!-- Outline of the whole talk/video -->
<section>
<section>
<h3>Goal</h3>
<p>Review all of the interesting F# parts of Dark's codebase</p>
</section>
<section>
<h3>The Outline</h3>
<ul>
<li>My history with Dark, <br> and why it interests me as an F# dev</li>
<li>A tour of Dark's parts</li>
<li>The sum is greater than its parts</li>
<li>How Dark works
<ul>
<li><strong>F# backend</strong></li>
</ul>
</li>
<li>I've been working on Dark for a year</li>
</ul>
</section>
</section>
<!-- My history with Dark, and why it interests me as an F# dev -->
<section>
<section>
<h3>My history with Dark</h3>
<ul>
<li>Saw some buzz ~4yrs back</li>
<li>Saw 2 posts: F#, source-available</li>
<li>Studied the code</li>
<li>Saw job posting, applied, ported HttpClients (OCaml->F#), got job</li>
<li>1 year of employment</li>
</ul>
</section>
<section>
<h4>Quick disclaimer</h4>
<ul>
<li>this video is not meant to just promote Dark</li>
<li>I might be wrong about some things</li>
<li>My desires for Dark might not align with its future</li>
</ul>
</section>
<section>
<h3>
Why I got into Dark
<br>
<small>as an F# dev</small>
</h3>
<ul>
<li>Its langauge shares a lot of qualities with F#</li>
<li>It's source-available</li>
<li>It's written (partially) in F#</li>
<li>
Removes so many headaches
<ul>
<li>dev environment is 0-hassle</li>
<li>waiting for CI, or to build/compile</li>
<li>DevOps BS</li>
<li>external source control</li>
</ul>
</li>
<li>Lots of misc. benefits from being holistic</li>
</ul>
</section>
<section>
<h4>one year in,</h4>
<h3>
It's been really satisfying work</h3>
<ul>
<li>nice codebase</li>
<li>async work; basically no scheduled meetings</li>
<li>building something I believe in and want to use</li>
<li>
lots of interesting problems
<ul>
<li>totally new domain to me</li>
<li>interpreter work</li>
<li>non-forms client-side stuff</li>
<li>makes me think about the full stack of web dev</li>
<li>non-technical</li>
<li>future: performance, compilers, scaling & dist. systems, etc.</li>
</ul>
</li>
</ul>
</section>
</section>
<!-- The Different Parts of Dark -->
<section>
<!-- Different Parts - Core - Overview -->
<section>
<h2>The different parts of Dark</h2>
<!-- <p>(These components, independent of each other, are just the way I like things)</p> -->
<ul style="font-size: smaller">
<li>core: language, interpreter, stdlib</li>
<li>core: editor</li>
<li>core: "Production" (hosting, infra, runtime)</li>
<li>handler: REPLs/Scripts</li>
<li>handler: HTTP Endpoints</li>
<li>handler: Workers</li>
<li>handler: CRONs</li>
<!-- <li><s>handler: Refactors</s></li>
<li><s>handler: Tests</s></li>
<li><s>handler: Data Migrations</s> </li> -->
<li>data: Dark Code</li>
<li>data: Data Stores</li>
<li>data: Usage: traces, logs, analytics</li>
<li>data: Secrets</li>
<li>data: Files, Static Assets</li>
<li>ecosystem: community, collaboration tools, docs, packages</li>
</ul>
</section>
<!-- Different Parts - Core - Language -->
<section>
<h3>Core: the Dark Language</h3>
<h4>the definition, interpreter, standard library</h4>
<ul>
<li>
all the normal stuff you'd expect
<!--
<p>types, data, if expressions, standard library</p>
<ul>
<li>bool, int, float, char, string, list, Option, Result, Map/Dict. </li>
<li>patterns: if, match, ...</li>
<li>user functions:</li>
<li>? user types: records, DUs</li>
</ul>
-->
</li>
<li>composable data types and expressive language</li>
<li>discourages local mutation</li>
<li>structural equality</li>
<li>typed</li>
</ul>
</section>
<!-- Different Parts - Core - Editor -->
<section>
<h3>Core: the Editor</h3>
<ul>
<li>
no download - lives in your browser
<!--
though desktop app is available
super accessible; use it from raspberry pi
-->
</li>
<li>it's fast</li>
<li>immediate updates</li>
<li>in-editor refactor recommendations</li>
</ul>
</section>
<!-- Different Parts - Core - Hosting/Infra/Runtime -->
<section>
<h3>Core: "Production"</h3>
<p>the runtime, hosting, connections, scaling</p>
<!-- <p>the **infrastructure**, **runtime**, and **hosting**</p> -->
</section>
<!-- Different Parts - Handlers -->
<section>
<h3>Handler: REPLs/Scripts</h3>
<p>encode core business workflows and write one-off scripts</p>
</section>
<section>
<h3>Handler: HTTP Endpoints</h3>
<p>public endpoints in the internet, so you can build backends</p>
<!-- custom domains, routing, middleware -->
</section>
<section>
<h3>Handler: CRONs</h3>
<p>for scheduled background jobs</p>
<!-- send daily email via Mailinator-->
</section>
<section>
<h3>Handler: Workers</h3>
<p>for async event-processing</p>
</section>
<section>
<h3>Data: Dark Code</h3>
</section>
<section>
<h3>Data: Data Stores</h3>
<p>normal data accessible directly by your code</p>
</section>
<section>
<h3>Data: Secrets</h3>
<p>for storing API keys</p>
</section>
<section>
<h3>Data: Usage</h3>
<p>telemetry, logs, analytics, error reports, trace data, http and worker 404s</p>
</section>
<section>
<h3>Data: Static Assets, Files</h3>
</section>
<!-- Different Parts - Ecosystem -->
<section>
<h3>Ecosystem</h3>
<ul>
<li>Collaboration tools: Presence</li>
<li>Docs, Blog, YouTube</li>
<li>Social: Discord, Mastodon, Twitch, Twitter</li>
<li>
Packages, and their management
<!-- for sharing code templates or libraries, refactorings, DB access, httpclient bindings,
editor themes, etc. -->
<!-- about the 'commercial marketplace bit:
I think that's incredibly important for us.
I think that's a major sector of where Dark (the company) can make its income." text="across your personal canvases, across your private organization, or as a package usable by other Dark developers,
either as open source or in a commercial marketplace -->
</li>
</ul>
</section>
</section>
<!-- There's power in these all being in one package -->
<section>
<section>
<h2>Connecting these parts turns out to be really powerful</h2>
</section>
<section>
<h3>You can create HTTP handlers <em>fast</em></h3>
<h4>trace+editor+handler</h4>
<ul>
<li>Create a request to an invalid endpoint</li>
<li>Create HTTP handler from 404</li>
<li>Fill in code (handle the request; return a response)</li>
<li>Try it</li>
</ul>
</section>
<section>
<h3>Pick up where you left off</h3>
<p>code hosting + editor</p>
<p>leave code in editor on PC1 and pick up at same spot (incl. cursor position and such) somewhere
else</p>
</section>
<section>
<h3>New language features are immediately available</h3>
<p>lang + hosting + editor + code</p>
</section>
<section>
<h3>No more waiting for something to "build"</h3>
<ul>
<li>for builds</li>
<li>for CI</li>
<li>for deployments</li>
</ul>
<p>editor+code+prod</p>
</section>
<section>
<h3>Tons of tiny benefits between code+editor</h3>
</section>
<section>
<h3>Usage data is built-in</h3>
<p>Easier debugging</p>
</section>
</section>
<!-- How Dark Works - Overview -->
<section>
<section>
<h3>Dark's tech</h3>
<ul>
<li>Dark's source code <a href="https://github.com/darklang/dark">is available</a><br> and
taking
contributions</li>
<li>The current backend is in F#</li>
<li>Increasingly, the backend will be written in Dark</li>
<li>The frontend is written in ReScript</li>
<li>We host on GCP</li>
<li>There are a bunch of tools we use to deal with hosting/infra/etc.</p>
</ul>
</section>
<section>
<h3>How Dark Works</h3>
<p>(draw here)</p>
</section>
</section>
<!-- Tour of Dark's F# Backend -->
<!-- No real slides here -->
<section>
<section>
<h3>Tour of Dark's F# Backend</h3>
<p>Goal: visit almost every file in the <code>backend</code> directory of the <code>dark</code>
monorepo</p>
<ul>
<li><code>git clone</code> the repo</li>
<li><code>cd</code> to the repo</li>
<li><code>tree backend/ | sed -e 's/[├──└│]/ /g' > tree_backend.txt</code></li>
<li>tidy up, paste into Dynalist - <a href="https://dynalist.io/d/FnQDuJCybi5WjgJ2TExWXIdH"></a>
results</li>
<li>Group and sort - <a href="https://dynalist.io/d/i2AghQO615f7XknEykWs0WzI">results</a></li>
</ul>
</section>
<section>
<h3>F# Artifacts</h3>
<ul>
<li>(Core: language, eval, stdlib, packages, program/canvas)</li>
<li>BwdServer</li>
<li>ApiServer</li>
<li>Wasm/Analysis</li>
<li>CronChecker, QueueWorker</li>
</ul>
</section>
</section>
<!-- Contributing to Dark -->
<section>
<h2>Contributing to Darklang</h2>
<ul>
<li>Check out the app (app, blog, docs, app)</li>
<li>Join socials: Discord, Mastodon, Twitch, YouTube, (Twitter?)</li>
<li>Use Dark!</li>
<li>Check out contributor docs</li>
</ul>
</section>
<!-- Been working on Dark for a ~year -->
<section>
<section>
<h3>I've been working on Dark for 1 year</h3>
<ul>
<li>General reflections</li>
<li>Work done</li>
<li>TODOs</li>
</ul>
</section>
<section>
<h3>General feelings</h3>
</section>
<section>
<h3>Work done</h3>
<ul>
<li>F# Port: HttpClient</li>
<li>Improve testing</li>
<li>Wasm/Analysis</li>
<li>StdLib</li>
<li>Editor/Fluid</li>
<li>Serialization</li>
<li>bunch of internal stuff</li>
<li>other things I've stumbled into</li>
</ul>
</section>
<section>
<h3>In-progress work</h3>
<ul>
<li>Tuples</li>
<li>thinner/better HttpClient and Http Handlers</li>
<li>deprecate static assets</li>
<li>Queues: prevent Queue hogging</li>
<li>Crons: better time control</li>
</ul>
</section>
<section>
<h3>TODOs - General desires for Dark</h3>
<ul>
<li>Use it as a backend dev, and to manage my life</li>
<li>Improved product. Continue removing BS.</li>
<li>More users, contributors</li>
</ul>
</section>
<section>
<h3>Product improvements at top of mind</h3>
<ul>
<li>Improved Editor (types, data, fns)</li>
<li>Tests</li>
<li>Migrations</li>
<li>
Refactors
<ul>
<li>expose the Dark language's AST to users</li>
<li>create a new toplevel for refactors</li>
</ul>
</li>
<li>Packages</li>
<li>Websockets</li>
</ul>
</section>
</section>
<!-- Bye -->
<section>
<h3>Bye</h3>
<ul>
<li>Try out Dark!</li>
<li>Follow me - stachu.net, stachudotnet, hello at stachu dot net</li>
<li>Thank you, Sergey!</li>
</ul>
</section>
</div>
</div>
<script src="dist/reveal.js"></script>
<script src="plugin/notes/notes.js"></script>
<script src="plugin/markdown/markdown.js"></script>
<script src="plugin/highlight/highlight.js"></script>
<script>
// More info about initialization & config:
// - https://revealjs.com/initialization/
// - https://revealjs.com/config/
Reveal.initialize({
hash: true,
// Learn about plugins: https://revealjs.com/plugins/
plugins: [RevealMarkdown, RevealHighlight, RevealNotes]
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment