diff --git a/documentation/blog/2016-11-26-frameworks-without-the-framework.md b/documentation/blog/2016-11-26-frameworks-without-the-framework.md
new file mode 100644
index 0000000000..b29525dec3
--- /dev/null
+++ b/documentation/blog/2016-11-26-frameworks-without-the-framework.md
@@ -0,0 +1,55 @@
+---
+title: "Frameworks without the framework: why didn't we think of this sooner?"
+description: You can't write serious applications in vanilla JavaScript without hitting a complexity wall. But a compiler can do it for you.
+author: Rich Harris
+authorURL: https://twitter.com/Rich_Harris
+---
+
+> Wait, this new framework has a *runtime*? Ugh. Thanks, I'll pass.
+> **– front end developers in 2018**
+
+We're shipping too much code to our users. Like a lot of front end developers, I've been in denial about that fact, thinking that it was fine to serve 100kb of JavaScript on page load – just use [one less .jpg!](https://twitter.com/miketaylr/status/227056824275333120) – and that what *really* mattered was performance once your app was already interactive.
+
+But I was wrong. 100kb of .js isn't equivalent to 100kb of .jpg. It's not just the network time that'll kill your app's startup performance, but the time spent parsing and evaluating your script, during which time the browser becomes completely unresponsive. On mobile, those milliseconds rack up very quickly.
+
+If you're not convinced that this is a problem, follow [Alex Russell](https://twitter.com/slightlylate) on Twitter. Alex [hasn't been making many friends in the framework community lately](https://twitter.com/slightlylate/status/728355959022587905), but he's not wrong. But the proposed alternative to using frameworks like Angular, React and Ember – [Polymer](https://www.polymer-project.org/1.0/) – hasn't yet gained traction in the front end world, and it's certainly not for a lack of marketing.
+
+Perhaps we need to rethink the whole thing.
+
+
+## What problem do frameworks *really* solve?
+
+The common view is that frameworks make it easier to manage the complexity of your code: the framework abstracts away all the fussy implementation details with techniques like virtual DOM diffing. But that's not really true. At best, frameworks *move the complexity around*, away from code that you had to write and into code you didn't.
+
+Instead, the reason that ideas like React are so wildly and deservedly successful is that they make it easier to manage the complexity of your *concepts*. Frameworks are primarily a tool for structuring your thoughts, not your code.
+
+Given that, what if the framework *didn't actually run in the browser*? What if, instead, it converted your application into pure vanilla JavaScript, just like Babel converts ES2016+ to ES5? You'd pay no upfront cost of shipping a hefty runtime, and your app would get seriously fast, because there'd be no layers of abstraction between your app and the browser.
+
+
+## Introducing Svelte
+
+Svelte is a new framework that does exactly that. You write your components using HTML, CSS and JavaScript (plus a few extra bits you can [learn in under 5 minutes](https://v2.svelte.dev/guide)), and during your build process Svelte compiles them into tiny standalone JavaScript modules. By statically analysing the component template, we can make sure that the browser does as little work as possible.
+
+The [Svelte implementation of TodoMVC](https://svelte-todomvc.surge.sh/) weighs 3.6kb zipped. For comparison, React plus ReactDOM *without any app code* weighs about 45kb zipped. It takes about 10x as long for the browser just to evaluate React as it does for Svelte to be up and running with an interactive TodoMVC.
+
+And once your app *is* up and running, according to [js-framework-benchmark](https://github.com/krausest/js-framework-benchmark) **Svelte is fast as heck**. It's faster than React. It's faster than Vue. It's faster than Angular, or Ember, or Ractive, or Preact, or Riot, or Mithril. It's competitive with Inferno, which is probably the fastest UI framework in the world, for now, because [Dominic Gannaway](https://twitter.com/trueadm) is a wizard. (Svelte is slower at removing elements. We're [working on it](https://github.com/sveltejs/svelte/issues/26).)
+
+It's basically as fast as vanilla JS, which makes sense because it *is* vanilla JS – just vanilla JS that you didn't have to write.
+
+
+## But that's not the important thing
+
+Well, it *is* important – performance matters a great deal. What's really exciting about this approach, though, is that we can finally solve some of the thorniest problems in web development.
+
+Consider interoperability. Want to `npm install cool-calendar-widget` and use it in your app? Previously, you could only do that if you were already using (a correct version of) the framework that the widget was designed for – if `cool-calendar-widget` was built in React and you're using Angular then, well, hard cheese. But if the widget author used Svelte, apps that use it can be built using whatever technology you like. (On the TODO list: a way to convert Svelte components into web components.)
+
+Or [code splitting](https://twitter.com/samccone/status/797528710085652480). It's a great idea (only load the code the user needs for the initial view, then get the rest later), but there's a problem – even if you only initially serve one React component instead of 100, *you still have to serve React itself*. With Svelte, code splitting can be much more effective, because the framework is embedded in the component, and the component is tiny.
+
+Finally, something I've wrestled with a great deal as an open source maintainer: your users always want *their* features prioritised, and underestimate the cost of those features to people who don't need them. A framework author must always balance the long-term health of the project with the desire to meet their users' needs. That's incredibly difficult, because it's hard to anticipate – much less articulate – the consequences of incremental bloat, and it takes serious soft skills to tell people (who may have been enthusiastically evangelising your tool up to that point) that their feature isn't important enough. But with an approach like Svelte's, many features can be added with absolutely no cost to people who don't use them, because the code that implements those features just doesn't get generated by the compiler if it's unnecessary.
+
+
+## We're just getting started
+
+Svelte is very new. There's a lot of work still left to do – creating build tool integrations, adding a server-side renderer, hot reloading, transitions, more documentation and examples, starter kits, and so on.
+
+But you can already build rich components with it, which is why we've gone straight to a stable 1.0.0 release. [Read the guide](https://v2.svelte.dev/guide), [try it out in the REPL](/repl), and head over to [GitHub](https://github.com/sveltejs/svelte) to help kickstart the next era of front end development.
diff --git a/documentation/blog/2017-08-07-the-easiest-way-to-get-started.md b/documentation/blog/2017-08-07-the-easiest-way-to-get-started.md
new file mode 100644
index 0000000000..3a25f15b12
--- /dev/null
+++ b/documentation/blog/2017-08-07-the-easiest-way-to-get-started.md
@@ -0,0 +1,65 @@
+---
+title: The easiest way to get started with Svelte
+description: This'll only take a minute.
+author: Rich Harris
+authorURL: https://twitter.com/Rich_Harris
+---
+
+Svelte is a [new kind of framework](/blog/frameworks-without-the-framework). Rather than putting a `
diff --git a/documentation/blog/2019-04-15-setting-up-your-editor.md b/documentation/blog/2019-04-15-setting-up-your-editor.md
new file mode 100644
index 0000000000..fb8287d0cb
--- /dev/null
+++ b/documentation/blog/2019-04-15-setting-up-your-editor.md
@@ -0,0 +1,65 @@
+---
+title: Setting up your editor
+description: Instructions for configuring linting and syntax highlighting
+author: Rich Harris
+authorURL: https://twitter.com/Rich_Harris
+draft: true
+---
+
+*__Coming soon__*
+
+This post will walk you through setting up your editor so that recognises Svelte files:
+
+* eslint-plugin-svelte3
+* svelte-vscode
+* associating .svelte files with HTML in VSCode, Sublime, etc.
+
+## Atom
+
+To treat `*.svelte` files as HTML, open *__Edit → Config...__* and add the following lines to your `core` section:
+
+```cson
+"*":
+ core:
+ …
+ customFileTypes:
+ "text.html.basic": [
+ "svelte"
+ ]
+```
+
+## Vim/Neovim
+
+You can use the [coc-svelte extension](https://github.com/coc-extensions/coc-svelte) which utilises the official language-server.
+
+As an alternative you can treat all `*.svelte` files as HTML. Add the following line to your `init.vim`:
+
+```
+au! BufNewFile,BufRead *.svelte set ft=html
+```
+
+To temporarily turn on HTML syntax highlighting for the current buffer, use:
+
+```
+:set ft=html
+```
+
+To set the filetype for a single file, use a [modeline](https://vim.fandom.com/wiki/Modeline_magic):
+
+```
+
+```
+
+## Visual Studio Code
+
+We recommend using the official [Svelte for VS Code extension](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode).
+
+## JetBrains WebStorm
+
+The [Svelte Framework Integration](https://plugins.jetbrains.com/plugin/12375-svelte/) can be used to add support for Svelte to WebStorm, or other Jetbrains IDEs. Consult the [WebStorm plugin installation guide](https://www.jetbrains.com/help/webstorm/managing-plugins.html) on the JetBrains website for more details.
+
+## Sublime Text 3
+
+Open any `.svelte` file.
+
+Go to *__View → Syntax → Open all with current extension as... → HTML__*.
diff --git a/documentation/blog/2019-04-16-svelte-for-new-developers.md b/documentation/blog/2019-04-16-svelte-for-new-developers.md
new file mode 100644
index 0000000000..76308da547
--- /dev/null
+++ b/documentation/blog/2019-04-16-svelte-for-new-developers.md
@@ -0,0 +1,107 @@
+---
+title: Svelte for new developers
+description: Never used Node.js or the command line? No problem
+author: Rich Harris
+authorURL: https://twitter.com/Rich_Harris
+---
+
+This short guide is designed to help you — someone who has looked at the [tutorial](/tutorial) and wants to start creating Svelte apps, but doesn't have a ton of experience using JavaScript build tooling — get up and running.
+
+If there are things that don't make sense, or that we're glossing over, feel free to [raise an issue](https://github.com/sveltejs/svelte/issues) or [suggest edits to this page](https://github.com/sveltejs/svelte/blob/master/site/content/blog/2019-04-16-svelte-for-new-developers.md) that will help us help more people.
+
+If you get stuck at any point following this guide, the best place to ask for help is in the [chatroom](https://svelte.dev/chat).
+
+
+## First things first
+
+You'll be using the *command line*, also known as the terminal. On Windows, you can access it by running **Command Prompt** from the Start menu; on a Mac, hit `Cmd` and `Space` together to bring up **Spotlight**, then start typing `Terminal.app`. On most Linux systems, `Ctrl-Alt-T` brings up the command line.
+
+The command line is a way to interact with your computer (or another computer! but that's a topic for another time) with more power and control than the GUI (graphical user interface) that most people use day-to-day.
+
+Once on the command line, you can navigate the filesystem using `ls` (`dir` on Windows) to list the contents of your current directory, and `cd` to change the current directory. For example, if you had a `Development` directory of your projects inside your home directory, you would type
+
+```bash
+cd Development
+```
+
+to go to it. From there, you could create a new project directory with the `mkdir` command:
+
+```bash
+mkdir svelte-projects
+cd svelte-projects
+```
+
+A full introduction to the command line is out of the scope of this guide, but here are a few more useful commands:
+
+* `cd ..` — navigates to the parent of the current directory
+* `cat my-file.txt` — on Mac/Linux (`type my-file.txt` on Windows), lists the contents of `my-file.txt`
+* `open .` (or `start .` on Windows) — opens the current directory in Finder or File Explorer
+
+
+## Installing Node.js
+
+[Node](https://nodejs.org/en/) is a way to run JavaScript on the command line. It's used by many tools, including Svelte. If you don't yet have it installed, the easiest way is to download the latest version straight from the [website](https://nodejs.org/en/).
+
+Once installed, you'll have access to three new commands:
+
+* `node my-file.js` — runs the JavaScript in `my-file.js`
+* `npm [subcommand]` — [npm](https://www.npmjs.com/) is a way to install 'packages' that your application depends on, such as the [svelte](https://www.npmjs.com/package/svelte) package
+* `npx [subcommand]` — a convenient way to run programs available on npm without permanently installing them
+
+
+## Installing a text editor
+
+To write code, you need a good editor. The most popular choice is [Visual Studio Code](https://code.visualstudio.com/) or VSCode, and justifiably so — it's well-designed and fully-featured, and has a wealth of extensions ([including one for Svelte](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode), which provides syntax highlighting and diagnostic messages when you're writing components).
+
+
+## Creating a project
+
+We're going to follow the instructions in part two of [The easiest way to get started with Svelte](/blog/the-easiest-way-to-get-started).
+
+First, we'll use npx to run [degit](https://github.com/Rich-Harris/degit), a program for cloning project templates from [GitHub](https://github.com) and other code storage websites. You don't have to use a project template, but it means you have to do a lot less setup work. You will need to have [Git](https://git-scm.com/) installed in order to use degit. (Eventually you'll probably have to learn [Git](https://git-scm.com/) itself, which most programmers use to manage their projects.)
+
+On the command line, navigate to where you want to create a new project, then type the following lines (you can paste the whole lot, but you'll develop better muscle memory if you get into the habit of writing each line out one at a time then running it):
+
+```bash
+npx degit sveltejs/template my-svelte-project
+cd my-svelte-project
+npm install
+```
+
+This creates a new directory, `my-svelte-project`, adds files from the [sveltejs/template](https://github.com/sveltejs/template) code repository, and installs a number of packages from npm. Open the directory in your text editor and take a look around. The app's 'source code' lives in the `src` directory, while the files your app can load are in `public`.
+
+In the `package.json` file, there is a section called `"scripts"`. These scripts define shortcuts for working with your application — `dev`, `build` and `start`. To launch your app in development mode, type the following:
+
+```bash
+npm run dev
+```
+
+Running the `dev` script starts a program called [Rollup](https://rollupjs.org/guide/en/). Rollup's job is to take your application's source files (so far, just `src/main.js` and `src/App.svelte`), pass them to other programs (including Svelte, in our case) and convert them into the code that will actually run when you open the application in a browser.
+
+Speaking of which, open a browser and navigate to http://localhost:5000. This is your application running on a local *web server* (hence 'localhost') on port 5000.
+
+Try changing `src/App.svelte` and saving it. The application will reload with your changes.
+
+
+## Building your app
+
+In the last step, we were running the app in 'development mode'. In dev mode, Svelte adds extra code that helps with debugging, and Rollup skips the final step where your app's JavaScript is compressed using [Terser](https://terser.org/).
+
+When you share your app with the world, you want to build it in 'production mode', so that it's as small and efficient as possible for end users. To do that, use the `build` command:
+
+```bash
+npm run build
+```
+
+Your `public` directory now contains a compressed `bundle.js` file containing your app's JavaScript. You can run it like so:
+
+```bash
+npm run start
+```
+
+This will run the app on http://localhost:5000.
+
+
+## Next steps
+
+To share your app with the world you'll need to *deploy* it. There are many ways to do so — some are listed in the `README.md` file inside your project.
diff --git a/documentation/blog/2019-04-20-write-less-code.md b/documentation/blog/2019-04-20-write-less-code.md
new file mode 100644
index 0000000000..d56c5312e8
--- /dev/null
+++ b/documentation/blog/2019-04-20-write-less-code.md
@@ -0,0 +1,164 @@
+---
+title: Write less code
+description: The most important metric you're not paying attention to
+author: Rich Harris
+authorURL: https://twitter.com/Rich_Harris
+---
+
+All code is buggy. It stands to reason, therefore, that the more code you have to write the buggier your apps will be.
+
+Writing more code also takes more time, leaving less time for other things like optimisation, nice-to-have features, or being outdoors instead of hunched over a laptop.
+
+In fact it's widely acknowledged that [project development time](https://blog.codinghorror.com/diseconomies-of-scale-and-lines-of-code/) and [bug count](https://www.mayerdan.com/ruby/2012/11/11/bugs-per-line-of-code-ratio) grow *quadratically*, not linearly, with the size of a codebase. That tracks with our intuitions: a ten-line pull request will get a level of scrutiny rarely applied to a 100-line one. And once a given module becomes too big to fit on a single screen, the cognitive effort required to understand it increases significantly. We compensate by refactoring and adding comments — activities that almost always result in *more* code. It's a vicious cycle.
+
+Yet while we obsess — rightly! — over performance numbers, bundle size and anything else we can measure, we rarely pay attention to the amount of code we're writing.
+
+
+## Readability is important
+
+I'm certainly not claiming that we should use clever tricks to scrunch our code into the most compact form possible at the expense of readability. Nor am I claiming that reducing *lines* of code is necessarily a worthwhile goal, since it encourages turning readable code like this...
+
+```js
+for (let i = 0; i <= 100; i += 1) {
+ if (i % 2 === 0) {
+ console.log(`${i} is even`);
+ }
+}
+```
+
+...into something much harder to parse:
+
+```js
+for (let i = 0; i <= 100; i += 1) if (i % 2 === 0) console.log(`${i} is even`);
+```
+
+Instead, I'm claiming that we should favour languages and patterns that allow us to naturally write less code.
+
+
+## Yes, I'm talking about Svelte
+
+Reducing the amount of code you have to write is an explicit goal of Svelte. To illustrate, let's look at a very simple component implemented in React, Vue and Svelte. First, the Svelte version:
+
+
+
+
+
+How would we build this in React? It would probably look something like this:
+
+```js
+import React, { useState } from 'react';
+
+export default () => {
+ const [a, setA] = useState(1);
+ const [b, setB] = useState(2);
+
+ function handleChangeA(event) {
+ setA(+event.target.value);
+ }
+
+ function handleChangeB(event) {
+ setB(+event.target.value);
+ }
+
+ return (
+
+
+
+
+
{a} + {b} = {a + b}
+
+ );
+};
+```
+
+Here's an equivalent component in Vue:
+
+```html
+
+
+
+
+
+
{{a}} + {{b}} = {{a + b}}
+
+
+
+
+```
+
+
+
+In other words, it takes 442 characters in React, and 263 characters in Vue, to achieve something that takes 145 characters in Svelte. The React version is literally three times larger!
+
+It's unusual for the difference to be *quite* so obvious — in my experience, a React component is typically around 40% larger than its Svelte equivalent. Let's look at the features of Svelte's design that enable you to express ideas more concisely:
+
+
+### Top-level elements
+
+In Svelte, a component can have as many top-level elements as you like. In React and Vue, a component must have a single top-level element — in React's case, trying to return two top-level elements from a component function would result in syntactically invalid code. (You can use a fragment — `<>` — instead of a `
`, but it's the same basic idea, and still results in an extra level of indentation).
+
+In Vue, your markup must be wrapped in a `` element, which I'd argue is redundant.
+
+
+### Bindings
+
+In React, we have to respond to input events ourselves:
+
+```js
+function handleChangeA(event) {
+ setA(+event.target.value);
+}
+```
+
+This isn't just boring plumbing that takes up extra space on the screen, it's also extra surface area for bugs. Conceptually, the value of the input is bound to the value of `a` and vice versa, but that relationship isn't cleanly expressed — instead we have two tightly-coupled but physically separate chunks of code (the event handler and the `value={a}` prop). Not only that, but we have to remember to coerce the string value with the `+` operator, otherwise `2 + 2` will equal `22` instead of `4`.
+
+Like Svelte, Vue does have a way of expressing the binding — the `v-model` attribute, though again we have to be careful to use `v-model.number` even though it's a numeric input.
+
+
+### State
+
+In Svelte, you update local component state with an assignment operator:
+
+```js
+let count = 0;
+
+function increment() {
+ count += 1;
+}
+```
+
+In React, we use the `useState` hook:
+
+```js
+const [count, setCount] = useState(0);
+
+function increment() {
+ setCount(count + 1);
+}
+```
+
+This is much *noisier* — it expresses the exact same concept but with over 60% more characters. As you're reading the code, you have to do that much more work to understand the author's intent.
+
+In Vue, meanwhile, we have a default export with a `data` function that returns an object literal with properties corresponding to our local state. Things like helper functions and child components can't simply be imported and used in the template, but must instead be 'registered' by attaching them to the correct part of the default export.
+
+
+## Death to boilerplate
+
+These are just some of the ways that Svelte helps you build user interfaces with a minimum of fuss. There are plenty of others — for example, [reactive declarations](tutorial/reactive-declarations) essentially do the work of React's `useMemo`, `useCallback` and `useEffect` without the boilerplate (or indeed the garbage collection overhead of creating inline functions and arrays on each state change).
+
+How? By choosing a different set of constraints. Because [Svelte is a compiler](blog/frameworks-without-the-framework), we're not bound to the peculiarities of JavaScript: we can *design* a component authoring experience, rather than having to fit it around the semantics of the language. Paradoxically, this results in *more* idiomatic code — for example using variables naturally rather than via proxies or hooks — while delivering significantly more performant apps.
diff --git a/documentation/blog/2019-04-22-svelte-3-rethinking-reactivity.md b/documentation/blog/2019-04-22-svelte-3-rethinking-reactivity.md
new file mode 100644
index 0000000000..89d71caf32
--- /dev/null
+++ b/documentation/blog/2019-04-22-svelte-3-rethinking-reactivity.md
@@ -0,0 +1,97 @@
+---
+title: "Svelte 3: Rethinking reactivity"
+description: It's finally here
+author: Rich Harris
+authorURL: https://twitter.com/Rich_Harris
+---
+
+After several months of being just days away, we are over the moon to announce the stable release of Svelte 3. This is a huge release representing hundreds of hours of work by many people in the Svelte community, including invaluable feedback from beta testers who have helped shape the design every step of the way.
+
+We think you're going to love it.
+
+
+## What is Svelte?
+
+Svelte is a component framework — like React or Vue — but with an important difference. Traditional frameworks allow you to write *declarative* state-driven code, but there's a penalty: the browser must do extra work to convert those declarative structures into DOM operations, using techniques like [virtual DOM diffing](blog/virtual-dom-is-pure-overhead) that eat into your frame budget and tax the garbage collector.
+
+Instead, Svelte runs at *build time*, converting your components into highly efficient *imperative* code that surgically updates the DOM. As a result, you're able to write ambitious applications with excellent performance characteristics.
+
+The first version of Svelte was all about [testing a hypothesis](blog/frameworks-without-the-framework) — that a purpose-built compiler could generate rock-solid code that delivered a great user experience. The second was a small upgrade that tidied things up a bit.
+
+Version 3 is a significant overhaul. Our focus for the last five or six months has been on delivering an outstanding *developer* experience. It's now possible to write components with [significantly less boilerplate](blog/write-less-code) than you'll find elsewhere. Try the brand new [tutorial](tutorial) and see what we mean — if you're familiar with other frameworks we think you'll be pleasantly surprised.
+
+To make that possible we first needed to rethink the concept at the heart of modern UI frameworks: reactivity.
+
+
+
+
+## Moving reactivity into the language
+
+In old Svelte, you would tell the computer that some state had changed by calling the `this.set` method:
+
+```js
+const { count } = this.get();
+this.set({
+ count: count + 1
+});
+```
+
+That would cause the component to *react*. Speaking of which, `this.set` is almost identical to the `this.setState` method used in classical (pre-hooks) React:
+
+```js
+const { count } = this.state;
+this.setState({
+ count: count + 1
+});
+```
+
+There are some important technical differences (as I explain in the video above, React is not reactive) but conceptually it's the same thing.
+
+
+
+That all changed with the advent of [hooks](https://reactjs.org/docs/hooks-intro.html), which handle state in a very different fashion. Many frameworks started experimenting with their own implementations of hooks, but we quickly concluded it wasn't a direction we wanted to go in. Hooks have some intriguing properties, but they also involve some unnatural code and create unnecessary work for the garbage collector. For a framework that's used in [embedded devices](https://mobile.twitter.com/sveltejs/status/1088500539640418304) as well as animation-heavy interactives, that's no good.
+
+So we took a step back and asked ourselves what kind of API would work for us... and realised that the best API is no API at all. We can just *use the language*. Updating some `count` value — and all the things that depend on it — should be as simple as this:
+
+```js
+count += 1;
+```
+
+Since we're a compiler, we can do that by instrumenting assignments behind the scenes:
+
+```js
+count += 1; $$invalidate('count', count);
+```
+
+Importantly, we can do all this without the overhead and complexity of using proxies or accessors. It's just a variable.
+
+
+## New look
+
+Your components aren't the only thing that's getting a facelift. Svelte itself has a completely new look and feel, thanks to the amazing design work of [Achim Vedam](https://vedam.de/) who created our new logo and website, which has moved from [svelte.technology](https://svelte.technology) to [svelte.dev](https://svelte.dev).
+
+We've also changed our tagline, from 'The magical disappearing UI framework' to 'Cybernetically enhanced web apps'. Svelte has many aspects — outstanding performance, small bundles, accessibility, built-in style encapsulation, declarative transitions, ease of use, the fact that it's a compiler, etc — that focusing on any one of them feels like an injustice to the others. 'Cybernetically enhanced' is designed to instead evoke Svelte's overarching philosophy that our tools should work as intelligent extensions of ourselves — hopefully with a retro, William Gibson-esque twist.
+
+
+## Upgrading from version 2
+
+If you're an existing Svelte 2 user, I'm afraid there is going to be some manual upgrading involved. In the coming days we'll release a migration guide and an updated version of [svelte-upgrade](https://github.com/sveltejs/svelte-upgrade) which will do the best it can to automate the process, but this *is* a significant change and not everything can be handled automatically.
+
+We don't take this lightly: hopefully once you've experienced Svelte 3 you'll understand why we felt it was necessary to break with the past.
+
+
+## Still to come
+
+As grueling as this release has been, we're nowhere near finished. We have a ton of ideas for generating smarter, more compact code, and a long feature wish-list. [Sapper](https://sapper.svelte.dev), our Next.js-style app framework, is still in the middle of being updated to use Svelte 3. The [Svelte Native](https://svelte-native.technology/) community project, which allows you to write Android and iOS apps in Svelte, is making solid progress but deserves more complete support from core. We don't yet have the bounty of editor extensions, syntax highlighters, component kits, devtools and so on that other frameworks have, and we should fix that. We *really* want to add first-class TypeScript support.
+
+But in the meantime we think Svelte 3 is the best way to build web apps yet. Take an hour to go through the [tutorial](tutorial) and we hope to convince you of the same. Either way, we'd love to see you in our [Discord chatroom](chat) and on [GitHub](https://github.com/sveltejs/svelte) — everyone is welcome, especially you.
\ No newline at end of file
diff --git a/documentation/blog/2020-07-17-svelte-and-typescript.md b/documentation/blog/2020-07-17-svelte-and-typescript.md
new file mode 100644
index 0000000000..bb5f389aa2
--- /dev/null
+++ b/documentation/blog/2020-07-17-svelte-and-typescript.md
@@ -0,0 +1,141 @@
+---
+title: Svelte <3 TypeScript
+description: Typernetically enhanced web apps
+author: Orta Therox
+authorURL: https://twitter.com/orta
+---
+
+It's been by far the most requested feature for a while, and it's finally here: Svelte officially supports TypeScript.
+
+We think it'll give you a much nicer development experience — one that also scales beautifully to larger Svelte code bases — regardless of whether you use TypeScript or JavaScript.
+
+
+
+ Image of TypeScript + Svelte in VS Code (theme is Kary Pro.)
+
+
+
+## Try it now
+
+You can start a new Svelte TypeScript project using the [normal template](https://github.com/sveltejs/template) and by running `node scripts/setupTypeScript.js` before you do anything else:
+
+```bash
+npx degit sveltejs/template svelte-typescript-app
+cd svelte-typescript-app
+node scripts/setupTypeScript.js
+```
+
+If you're a VS Code user, make sure you're using the (new) [official extension](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode), which replaces the popular extension by James Birtles.
+Later in this blog post, we'll detail the individual steps involved in using TypeScript in an existing Svelte project.
+
+## What does it mean to support TypeScript in Svelte?
+
+TypeScript support in Svelte has been possible for a long time, but you had to mix a lot of disparate tools together and each project ran independently. Today, nearly all of these tools live under the Svelte organization and are maintained by a set of people who take responsibility over the whole pipeline and have common goals.
+
+A week before COVID was declared a pandemic, [I pitched a consolidation](https://github.com/sveltejs/svelte/issues/4518) of the best Svelte tools and ideas from similar dev-ecosystems and provided a set of steps to get first class TypeScript support. Since then, many people have pitched in and written the code to get us there.
+
+When we say that Svelte now supports TypeScript, we mean a few different things:
+
+* You can use TypeScript inside your `
+```
+This will make sure that you can invoke dispatch only with the specified event names and its types. The Svelte for VS Code extension was also updated to deal with this new feature. It will provide strong typings for these events as well as autocompletion and hover information.
+
+**New from Sapper!**
+Sapper 0.28.9 just came out. The highlights from it include much better support for CSP nonces, asset preload support for exported pages, and error details are now available in the `$page` store on error pages.
+
+In addition, Sapper's CSS handling has been rewritten over the course of recent releases in order to fix existing CSS handling bugs, refactor the CSS handling to occur entirely within a Rollup plugin, and remove the need internally to register CSS in the routing system. Congrats and thank you to the folks working on Sapper for all their solid work!
+
+
+## Impactful bug fixes
+- CSS compilation will no longer remove rules for the `open` attribute on `` elements ([Example](https://svelte.dev/repl/ab4c0c177d1f4fab92f46eb8539cea9a?version=3.26.0), **3.26.0**)
+- `prettier-plugin-svelte` will do a better job now at dealing with whitespaces, especially around inline elements. It will also preserve formatting inside `
` tags and will no longer format languages which are not supported by Prettier, like SASS, Pug or Stylus.
+
+
+## Coming up
+- [Svelte Summit](https://sveltesummit.com/), Svelte's second global online conference, is taking place on October 18! Sign up for free to get reminders and talk updates!
+
+For all the features and bugfixes see the CHANGELOG for [Svelte](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md) and [Sapper](https://github.com/sveltejs/sapper/blob/master/CHANGELOG.md).
+
+
+---
+
+## Svelte Showcase
+- [This CustomMenu example](https://svelte.dev/repl/3a33725c3adb4f57b46b597f9dade0c1?version=3.25.0) demos how to replace the OS right-click menu
+- [Github Tetris](https://svelte.dev/repl/cc1eaa7c66964fedb5e70e3ecbbaa0e1?version=3.25.1) lets you play a Tetris-like game in a git commit history
+- [Who are my representatives?](https://whoaremyrepresentatives.us/) is a website built with Svelte to help US residents get more info on their congressional representatives
+- [Pick Palette](https://github.com/bluwy/pick-palette) is a color palette manager made with Svelte!
+
+#### In-depth learning:
+- [Svelte 3 Up and Running](https://www.amazon.com/dp/B08D6T6BKS/ref=cm_sw_r_tw_dp_x_OQMtFb3GPQCB2) is a new book about building production-ready static web apps with Svelte 3
+- [Sapper Tutorial (Crash Course)](https://www.youtube.com/playlist?list=PL4cUxeGkcC9gdr4Qhx83gBBcID-KMe-PQ) walks through the ins-and-outs of Sapper, the Svelte-powered application framework
+- [Svelte Society Day France](https://france.sveltesociety.dev/) happened September 27th featuring a wide variety of topics all in French! You can find the full recording [here](https://www.youtube.com/watch?v=aS1TQ155JK4).
+
+#### Plug-and-play components:
+- [svelte-zoom](https://github.com/vaheqelyan/svelte-zoom) brings "nearly native" pan-and-zoom to images on desktop and mobile
+- [svelte-materialify](https://github.com/TheComputerM/svelte-materialify) is a Material component library for Svelte with over 50 components
+- [svelte-undoable](https://github.com/macfja/svelte-undoable) makes it easy to introduce undo and redo functionality using `bind:`
+- [This Tilt component](https://svelte.dev/repl/7b23ad9d2693424482cd411b0378b55b?version=3.24.1) implements a common UX pattern where the hovered element tilts to follow the mouse
+
+#### Lots of examples of how use JS tech came out this month:
+ - [Sapper with PostCSS and Tailwind](https://codechips.me/sapper-with-postcss-and-tailwind/)
+ - [PrismJS (Code block syntax highlighting)](https://github.com/phptuts/Svelte-PrismJS)
+ - [Filepond (Drag-and-drop file upload)](https://github.com/pqina/svelte-filepond)
+ - [Ionic (UI Components)](https://github.com/Tommertom/svelte-ionic-app)
+ - [Pell (WYSIWYG Editor)](https://github.com/Demonicious/svelte-pell/)
+ - [Leaflet (Mapping)](https://github.com/anoram/leaflet-svelte)
+
+**Reminder**: There's a [Svelte integrations repo](https://github.com/sveltejs/integrations) that demonstrates ways to incorporate Svelte into your stack (and vice versa). If you've got questions on how to use a particular piece of tech with Svelte, you may find your answer there... and if you've gotten something to work with Svelte, consider contributing!
+
+For more amazing Svelte projects, check out the [Svelte Society](https://sveltesociety.dev/), [Reddit](https://www.reddit.com/r/sveltejs/) and [Discord](https://discord.com/invite/yy75DKs)… and be sure to post your own!
+
+## See you next month!
+
+By the way, Svelte now has an [OpenCollective](https://opencollective.com/svelte)! All contributions and all expenses are published in our transparent public ledger. Learn who is donating, how much, where that money is going, submit expenses, get reimbursed and more!
diff --git a/documentation/blog/2020-11-01-whats-new-in-svelte-november-2020.md b/documentation/blog/2020-11-01-whats-new-in-svelte-november-2020.md
new file mode 100644
index 0000000000..99de2dd332
--- /dev/null
+++ b/documentation/blog/2020-11-01-whats-new-in-svelte-november-2020.md
@@ -0,0 +1,46 @@
+---
+title: "What's new in Svelte: November 2020"
+description: Slot forwarding fixes, SvelteKit for faster local development, and more from Svelte Summit
+author: Daniel Sandoval
+authorURL: https://desandoval.net
+---
+
+Welcome back to the "What's new in Svelte" series! This month, we're covering new features & bug fixes, last month's Svelte Summit and some stand-out sites and libraries...
+
+## New features & impactful bug fixes
+
+1. Destructuring Promises now works as expected by using the `{#await}` syntax
+ (**3.29.3**, [Example](https://svelte.dev/repl/3fd4e2cecfa14d629961478f1dac2445?version=3.29.3))
+2. Slot forwarding (released in 3.29.0) should no longer hang during compilation (**3.29.3**, [Example](https://svelte.dev/repl/29959e70103f4868a6525c0734934936?version=3.29.3))
+3. Better typings for the `get` function in `svelte/store` and on lifecycle hooks (**3.29.1**)
+
+**What's going on in Sapper?**
+
+Sapper got some new types in its `preload` function, which will make typing easier if you are using TypeScript. See the [Sapper docs](https://sapper.svelte.dev/docs#Typing_the_function) on how to use them. There also were fixes to `preload` links in exported sites. Route layouts got a few fixes too - including ensuring CSS is applied to nested route layouts. You can also better organize your files now that extensions with multiple dots are supported. (**0.28.10**)
+
+
+For all the features and bugfixes see the CHANGELOGs for [Svelte](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md) and [Sapper](https://github.com/sveltejs/sapper/blob/master/CHANGELOG.md).
+
+
+## [Svelte Summit](https://sveltesummit.com/) was Svelte-tacular!
+- Rich Harris demoed the possible future of Svelte development in a talk titled "Futuristic Web Development". The not-yet-public project is called SvelteKit (name may change) and will bring a first-class developer experience and more flexibility for build outputs. If you want to get the full sneak-peek, [check out the video](https://www.youtube.com/watch?v=qSfdtmcZ4d0).
+- 17 speakers made the best of the conference's virtual format... From floating heads to seamless demos, Svelte developers from every skill level will find something of interest in this year's [YouTube playlist](https://www.youtube.com/playlist?list=PL8bMgX1kyZThM1sbYCoWdTcpiYysJsSeu)
+
+---
+
+## Community Showcase
+- [Svelte Lab](https://sveltelab.app/) showcases a variety of components, visualizations and interactions that can be achieved in Svelte. You can click into any component to see its source or edit it, using the site's built-in REPL
+- [svelte-electron-boilerplate](https://github.com/hjalmar/svelte-electron-boilerplate) is a fast way to get up and running with a Svelte app built in the desktop javascript framework, Electron
+- [React Hooks in Svelte](https://github.com/joshnuss/react-hooks-in-svelte) showcases examples of common React Hooks ported to Svelte.
+- [gurlic](https://gurlic.com/) is a social network and internet experiment that is super snappy thanks to Svelte
+- [Interference 2020](https://interference2020.org/) visualizes reported foreign interference in the 2020 U.S. elections. You can learn more about how it was built in [YYY's talk at Svelte Summit]()
+- [jitsi-svelte](https://github.com/relm-us/jitsi-svelte) lets you easily create your own custom Jitsi client by providing out-of-the-box components built with Svelte
+- [Ellx](https://ellx.io/) is part spreadsheet, part notebook and part IDE. It's super smooth thanks to Svelte 😎
+- [This New Zealand news site](https://www.nzherald.co.nz/nz/election-2020-latest-results-party-vote-electorate-vote-and-full-data/5CFVO4ENKNQDE3SICRRNPU5GZM/) breaks down the results of the 2020 Parliamentary elections using Svelte
+- [Budibase](https://github.com/Budibase/budibase) is a no-code app builder, powered by Svelte
+- [Svelt-yjs](https://github.com/relm-us/svelt-yjs) combines the collaborative, local-first technology of Yjs with the power of Svelte to enable multiple users across the internet to stay in sync.
+- [tabler-icons-svelte](https://github.com/benflap/tabler-icons-svelte) is a Svelte wrapper for over 850 free MIT-licensed high-quality SVG icons for you to use in your web projects.
+
+## See you next month!
+
+Got an idea for something to add to the Showcase? Want to get involved more with Svelte? We're always looking for maintainers, contributors and fanatics... Check out the [Svelte Society](https://sveltesociety.dev/), [Reddit](https://www.reddit.com/r/sveltejs/) and [Discord](https://discord.com/invite/yy75DKs) to get involved!
diff --git a/documentation/blog/2020-11-05-whats-the-deal-with-sveltekit.md b/documentation/blog/2020-11-05-whats-the-deal-with-sveltekit.md
new file mode 100644
index 0000000000..f780cd0226
--- /dev/null
+++ b/documentation/blog/2020-11-05-whats-the-deal-with-sveltekit.md
@@ -0,0 +1,103 @@
+---
+title: What's the deal with SvelteKit?
+description: We're rethinking how to build Svelte apps. Here's what you need to know
+author: Rich Harris
+authorURL: https://twitter.com/rich_harris
+---
+
+
+
+If you attended [Svelte Summit](https://sveltesummit.com/) last month you may have seen my talk, Futuristic Web Development, in which I finally tackled one of the most frequently asked questions about Svelte: when will Sapper reach version 1.0?
+
+The answer: never.
+
+This was slightly tongue-in-cheek — as the talk explains, it's really more of a rewrite of Sapper coupled with a rebrand — but it raised a lot of new questions from the community, and it's time we offered a bit more clarity on what you can expect from Sapper's successor, SvelteKit.
+
+
+
+
+
+
+
+'Futuristic Web Development' from Svelte Summit
+
+
`, denotes a regular HTML element. A capitalised tag, such as `` or ``, indicates a *component*.
+
+```sv
+
+
+
+
+
+```
+
+
+### Attributes and props
+
+---
+
+By default, attributes work exactly like their HTML counterparts.
+
+```sv
+
+
+
+```
+
+---
+
+As in HTML, values may be unquoted.
+
+```sv
+
+```
+
+---
+
+Attribute values can contain JavaScript expressions.
+
+```sv
+page {p}
+```
+
+---
+
+Or they can *be* JavaScript expressions.
+
+```sv
+
+```
+
+---
+
+Boolean attributes are included on the element if their value is [truthy](https://developer.mozilla.org/en-US/docs/Glossary/Truthy) and excluded if it's [falsy](https://developer.mozilla.org/en-US/docs/Glossary/Falsy).
+
+All other attributes are included unless their value is [nullish](https://developer.mozilla.org/en-US/docs/Glossary/Nullish) (`null` or `undefined`).
+
+```html
+
+
This div has no title attribute
+```
+
+---
+
+An expression might include characters that would cause syntax highlighting to fail in regular HTML, so quoting the value is permitted. The quotes do not affect how the value is parsed:
+
+```sv
+
+```
+
+---
+
+When the attribute name and value match (`name={name}`), they can be replaced with `{name}`.
+
+```sv
+
+
+
+```
+
+---
+
+By convention, values passed to components are referred to as *properties* or *props* rather than *attributes*, which are a feature of the DOM.
+
+As with elements, `name={name}` can be replaced with the `{name}` shorthand.
+
+```sv
+
+```
+
+---
+
+*Spread attributes* allow many attributes or properties to be passed to an element or component at once.
+
+An element or component can have multiple spread attributes, interspersed with regular ones.
+
+```sv
+
+```
+
+---
+
+*`$$props`* references all props that are passed to a component, including ones that are not declared with `export`. It is not generally recommended, as it is difficult for Svelte to optimise. But it can be useful in rare cases – for example, when you don't know at compile time what props might be passed to a component.
+
+```sv
+
+```
+
+---
+
+*`$$restProps`* contains only the props which are *not* declared with `export`. It can be used to pass down other unknown attributes to an element in a component. It shares the same optimisation problems as *`$$props`*, and is likewise not recommended.
+
+```html
+
+```
+
+
+> The `value` attribute of an `input` element or its children `option` elements must not be set with spread attributes when using `bind:group` or `bind:checked`. Svelte needs to be able to see the element's `value` directly in the markup in these cases so that it can link it to the bound variable.
+
+---
+
+### Text expressions
+
+```sv
+{expression}
+```
+
+---
+
+Text can also contain JavaScript expressions:
+
+> If you're using a regular expression (`RegExp`) [literal notation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp#literal_notation_and_constructor), you'll need to wrap it in parentheses.
+
+```sv
+
Hello {name}!
+
{a} + {b} = {a + b}.
+
+
{(/^[A-Za-z ]+$/).test(value) ? x : y}
+```
+
+### Comments
+
+---
+
+You can use HTML comments inside components.
+
+```sv
+
+
Hello world
+```
+
+---
+
+Comments beginning with `svelte-ignore` disable warnings for the next block of markup. Usually these are accessibility warnings; make sure that you're disabling them for a good reason.
+
+```sv
+
+
+```
+
+
+### {#if ...}
+
+```sv
+{#if expression}...{/if}
+```
+```sv
+{#if expression}...{:else if expression}...{/if}
+```
+```sv
+{#if expression}...{:else}...{/if}
+```
+
+---
+
+Content that is conditionally rendered can be wrapped in an if block.
+
+```sv
+{#if answer === 42}
+
what was the question?
+{/if}
+```
+
+---
+
+Additional conditions can be added with `{:else if expression}`, optionally ending in an `{:else}` clause.
+
+```sv
+{#if porridge.temperature > 100}
+
too hot!
+{:else if 80 > porridge.temperature}
+
too cold!
+{:else}
+
just right!
+{/if}
+```
+
+
+### {#each ...}
+
+```sv
+{#each expression as name}...{/each}
+```
+```sv
+{#each expression as name, index}...{/each}
+```
+```sv
+{#each expression as name (key)}...{/each}
+```
+```sv
+{#each expression as name, index (key)}...{/each}
+```
+```sv
+{#each expression as name}...{:else}...{/each}
+```
+
+---
+
+Iterating over lists of values can be done with an each block.
+
+```sv
+
Shopping list
+
+ {#each items as item}
+
{item.name} x {item.qty}
+ {/each}
+
+```
+
+You can use each blocks to iterate over any array or array-like value — that is, any object with a `length` property.
+
+---
+
+An each block can also specify an *index*, equivalent to the second argument in an `array.map(...)` callback:
+
+```sv
+{#each items as item, i}
+
{i + 1}: {item.name} x {item.qty}
+{/each}
+```
+
+---
+
+If a *key* expression is provided — which must uniquely identify each list item — Svelte will use it to diff the list when data changes, rather than adding or removing items at the end. The key can be any object, but strings and numbers are recommended since they allow identity to persist when the objects themselves change.
+
+```sv
+{#each items as item (item.id)}
+
{item.name} x {item.qty}
+{/each}
+
+
+{#each items as item, i (item.id)}
+
{i + 1}: {item.name} x {item.qty}
+{/each}
+```
+
+---
+
+You can freely use destructuring and rest patterns in each blocks.
+
+```sv
+{#each items as { id, name, qty }, i (id)}
+
{i + 1}: {name} x {qty}
+{/each}
+
+{#each objects as { id, ...rest }}
+
{id}
+{/each}
+
+{#each items as [id, ...rest]}
+
{id}
+{/each}
+```
+
+---
+
+An each block can also have an `{:else}` clause, which is rendered if the list is empty.
+
+```sv
+{#each todos as todo}
+
{todo.text}
+{:else}
+
No tasks today!
+{/each}
+```
+
+
+### {#await ...}
+
+```sv
+{#await expression}...{:then name}...{:catch name}...{/await}
+```
+```sv
+{#await expression}...{:then name}...{/await}
+```
+```sv
+{#await expression then name}...{/await}
+```
+```sv
+{#await expression catch name}...{/await}
+```
+
+---
+
+Await blocks allow you to branch on the three possible states of a Promise — pending, fulfilled or rejected.
+
+```sv
+{#await promise}
+
+
waiting for the promise to resolve...
+{:then value}
+
+
The value is {value}
+{:catch error}
+
+
Something went wrong: {error.message}
+{/await}
+```
+
+---
+
+The `catch` block can be omitted if you don't need to render anything when the promise rejects (or no error is possible).
+
+```sv
+{#await promise}
+
+
waiting for the promise to resolve...
+{:then value}
+
+
The value is {value}
+{/await}
+```
+
+---
+
+If you don't care about the pending state, you can also omit the initial block.
+
+```sv
+{#await promise then value}
+
The value is {value}
+{/await}
+```
+
+---
+
+Similarly, if you only want to show the error state, you can omit the `then` block.
+
+```sv
+{#await promise catch error}
+
The error is {error}
+{/await}
+```
+
+### {#key ...}
+
+```sv
+{#key expression}...{/key}
+```
+
+Key blocks destroy and recreate their contents when the value of an expression changes.
+
+---
+
+This is useful if you want an element to play its transition whenever a value changes.
+
+```sv
+{#key value}
+
{value}
+{/key}
+```
+
+---
+
+When used around components, this will cause them to be reinstantiated and reinitialised.
+
+```sv
+{#key value}
+
+{/key}
+```
+
+### {@html ...}
+
+```sv
+{@html expression}
+```
+
+---
+
+In a text expression, characters like `<` and `>` are escaped; however, with HTML expressions, they're not.
+
+The expression should be valid standalone HTML — `{@html "
"}content{@html "
"}` will *not* work, because `
` is not valid HTML. It also will *not* compile Svelte code.
+
+> Svelte does not sanitize expressions before injecting HTML. If the data comes from an untrusted source, you must sanitize it, or you are exposing your users to an XSS vulnerability.
+
+```sv
+
+
{post.title}
+ {@html post.content}
+
+```
+
+
+### {@debug ...}
+
+```sv
+{@debug}
+```
+```sv
+{@debug var1, var2, ..., varN}
+```
+
+---
+
+The `{@debug ...}` tag offers an alternative to `console.log(...)`. It logs the values of specific variables whenever they change, and pauses code execution if you have devtools open.
+
+```sv
+
+
+{@debug user}
+
+
Hello {user.firstname}!
+```
+
+---
+
+`{@debug ...}` accepts a comma-separated list of variable names (not arbitrary expressions).
+
+```sv
+
+{@debug user}
+{@debug user1, user2, user3}
+
+
+{@debug user.firstname}
+{@debug myArray[0]}
+{@debug !isReady}
+{@debug typeof user === 'object'}
+```
+
+The `{@debug}` tag without any arguments will insert a `debugger` statement that gets triggered when *any* state changes, as opposed to the specified variables.
+
+
+
+### Element directives
+
+As well as attributes, elements can have *directives*, which control the element's behaviour in some way.
+
+
+#### [on:*eventname*](on_element_event)
+
+```sv
+on:eventname={handler}
+```
+```sv
+on:eventname|modifiers={handler}
+```
+
+---
+
+Use the `on:` directive to listen to DOM events.
+
+```sv
+
+
+
+```
+
+---
+
+Handlers can be declared inline with no performance penalty. As with attributes, directive values may be quoted for the sake of syntax highlighters.
+
+```sv
+
+```
+
+---
+
+Add *modifiers* to DOM events with the `|` character.
+
+```sv
+
+```
+
+The following modifiers are available:
+
+* `preventDefault` — calls `event.preventDefault()` before running the handler
+* `stopPropagation` — calls `event.stopPropagation()`, preventing the event reaching the next element
+* `passive` — improves scrolling performance on touch/wheel events (Svelte will add it automatically where it's safe to do so)
+* `nonpassive` — explicitly set `passive: false`
+* `capture` — fires the handler during the *capture* phase instead of the *bubbling* phase
+* `once` — remove the handler after the first time it runs
+* `self` — only trigger handler if `event.target` is the element itself
+* `trusted` — only trigger handler if `event.isTrusted` is `true`. I.e. if the event is triggered by a user action.
+
+Modifiers can be chained together, e.g. `on:click|once|capture={...}`.
+
+---
+
+If the `on:` directive is used without a value, the component will *forward* the event, meaning that a consumer of the component can listen for it.
+
+```sv
+
+```
+
+---
+
+It's possible to have multiple event listeners for the same event:
+
+```sv
+
+
+
+```
+
+#### [bind:*property*](bind_element_property)
+
+```sv
+bind:property={variable}
+```
+
+---
+
+Data ordinarily flows down, from parent to child. The `bind:` directive allows data to flow the other way, from child to parent. Most bindings are specific to particular elements.
+
+The simplest bindings reflect the value of a property, such as `input.value`.
+
+```sv
+
+
+
+
+```
+
+---
+
+If the name matches the value, you can use a shorthand.
+
+```sv
+
+
+
+```
+
+---
+
+Numeric input values are coerced; even though `input.value` is a string as far as the DOM is concerned, Svelte will treat it as a number. If the input is empty or invalid (in the case of `type="number"`), the value is `undefined`.
+
+```sv
+
+
+```
+
+---
+
+On `` elements with `type="file"`, you can use `bind:files` to get the [`FileList` of selected files](https://developer.mozilla.org/en-US/docs/Web/API/FileList). It is readonly.
+
+```sv
+
+
+```
+
+
+##### Binding `
+