chore: Port FreeSewing.dev to docusaurus

The replaces the NextJS site powering FreeSewing.dev with a Docusaurus
setup. It's part of my efforts to simplify FreeSewing's setup so we can
focus on our core value proposition.

sites/dev/docs/tutorials/pattern-design/part1/new-design/readme.mdx

@@ -0,0 +1,75 @@
+---
+title: Setting up the development environment
+order: 20
+---
+
+FreeSewing provides a development environment that visualizes your design for
+you. This tutorial is for the stand-alone development environment, not the
+monorepo development environment (which you may have set up if you followed a
+getting started tutorial).
+
+To set it up, I will open a terminal and enter the following command:
+
+```sh
+npx @freesewing/new-design
+```
+
+It will ask if it is ok to install the development environment in a new folder
+named `freesewing`. You can accept the default, or pick a different folder name
+if you prefer.
+
+It will also ask what package manager you would like to use. 
+Here too the default (`npm`) is fine., unless you are certain you have **yarn** installed.
+
+After answering these questions, files will be downloaded, dependencies installed,
+and it will also initialize a git repository for you (if you have git on your system).
+
+:::note
+
+This will take a few minutes because the development environment has a number
+of dependencies that need to be downloaded.
+
+:::
+
+When it's ready, you can enter the `freesewing` directory that was just created and run `npm run dev`:
+
+```sh
+cd freesewing
+npm run dev
+```
+
+Or if you want to use yarn as package manager:
+
+```sh
+cd freesewing
+yarn dev
+```
+
+Now open a browser and go to http://localhost:8000
+
+If all goes well, we'll should see this landing page:
+
+![The FreeSewing development environment](./nd.png)
+
+:::tip
+
+##### More detailed setup tutorials are available
+
+This pattern design tutorial contains only an abbreviated overview
+of the setup process.
+For more detailed instructions, please refer to one of our setup tutorials:
+
+- [Getting started on Linux](/tutorials/getting-started-linux)
+- [Getting started on Mac](/tutorials/getting-started-mac)
+- [Getting started on Windows](/tutorials/getting-started-windows)
+
+:::
+
+:::tip
+
+##### Need help?
+
+If you run into any issues, head over to [FreeSewing.org/support](https://next.freesewing.org/support)
+which lists the various ways in which you can get help.
+
+:::

sites/dev/docs/tutorials/pattern-design/part1/nodejs/readme.mdx

@@ -0,0 +1,41 @@
+---
+title: Installing NodeJS
+order: 10
+---
+
+FreeSewing is a JavaScript project, so you need JavaScript to work with it.
+You certainly already have JavaScript on your system. In your browser to be
+precise. You can switch this website theme from light to dark mode, and
+that would not work without JavaScript.
+
+As a **user** of FreeSewing, this is all you need. To develop with FreeSewing
+you are going to need to be able to run JavaScript *outside* the browser using
+a JavaScript *runtime*. Which just means a thing that can *run* JavaScript.
+
+We are going to be using [NodeJS](https://nodejs.org/) in this tutorial. It is
+the most established of the different JavaScript runtimes. But there's also 
+other runtimes like [Deno](https://deno.com/) or [Bun](https://bun.sh/). 
+
+## Install
+If you don't have NodeJS on your system, you can go to
+[NodeJS.org](https://nodejs.org/) and follow the install instructions.
+
+:::tip
+
+##### NodeJS versions
+
+You need Node.js 18 (lts/hydrogen) or higher to use FreeSewing
+
+If you're looking to use different versions, I can recommend using `nvm` which makes this very easy: https://github.com/nvm-sh/nvm
+
+:::
+
+## Test
+
+To test whether NodeJS is installed, and see it's version, you can run this command:
+
+```sh
+node -v
+```
+
+If you get the Node.js version number, that means NodeJs is installed. Yay!

sites/dev/docs/tutorials/pattern-design/part1/readme.mdx

@@ -0,0 +1,33 @@
+---
+title: "Part 1: Prerequisites"
+---
+
+In this first part, I will get your up and running with the FreeSewing
+development environment.
+
+If you are familiar with JavaScript and its ecosystem, you can probably skip
+this section. If not, I have good news and bad news (and then some more good
+news) for you.
+
+The good news is that JavaScript is an easy language to pick up. It is also a
+very popular and versatile language and the skills you learn here will serve 
+you well.
+
+The bad news is that the JavaScript ecosystem is vast, and unfortunately 
+somewhat fractured. Most of the problems people need help with are not so much
+in the code itself, but rather getting everything to work together.
+This is true not just for FreeSewing, but pretty much all modern JavaScript.
+
+But, no need to despair, FreeSewing provides a development environment that 
+will take care of all of this for you. So you can focus on designing patterns.
+
+If you have NodeJS on your system, getting that development environment up 
+and running takes only a single command:
+
+```sh
+npx @freesewing/new-design
+```
+
+If you don't have NodeJS on your system --- or if you're not sure what
+NodeJS is to begin with --- read on to learn how to install it.
+

sites/dev/docs/tutorials/pattern-design/part1/sde/readme.mdx

@@ -0,0 +1,47 @@
+---
+title: The FreeSewing development environment
+order: 30
+---
+
+If you have been to FreeSewing.org the FreeSewing development environment will look familiar.
+That's because under the hood, it re-uses the same building blocks.
+
+At the top of the page is the header with a row of icons that lay out what is available to you.
+
+![The icons in the header of the FreeSewing development environment](./header.png)
+
+From left to right you can see:
+
+- **Home** will take you to the home page / welcome page
+- **Design** will offer you a list of templates to start a design from (more on this below)
+- **Documentation** will show a page with links to our documentation
+- **Code** will show a page with links to our source code
+- **Support** will show a page with the various ways you can get help
+- **Theme** allows you to change the theme (in other works the color scheme)
+- **Language** allows you to change the language
+- **Sign In** allows you to sign in to your FreeSewing account so you can use
+  your (and our) measurements sets while designing
+
+## Design templates
+
+If you click the **Design** icon it will show this menu:
+
+![Design templates provided by the FreeSewing development environment](./templates.png)
+
+It allows you to choose a design template to start from. The following templates are included:
+
+- **From scratch**: Start with an (almost) empty design
+- **Tutorial**: Start with the end result of this very tutorial
+- **From Brian**: Start with a design that extends [Brian](https://freesewing.org/designs/brian)
+- **From Bent**: Start with a design that extends [Bent](https://freesewing.org/designs/bent)
+- **From Titan**: Start with a design that extends [Titan](https://freesewing.org/designs/titan)
+- **From Bella**: Start with a design that extends [Bella](https://freesewing.org/designs/bella)
+- **From Breanna**: Start with a design that extends [Breanna](https://freesewing.org/designs/breanna)
+
+For the following along this tutorial, you have two options:
+
+- Pick **Tutorial** if you prefer to read along, make small changes, and see how they affect the design.
+- Pick **From scratch** if you prefer to actively participate by recreating the design in this tutorial.
+
+I recommend the latter. You will learn (and remember) a lot more if you are actively engaging.
+

sites/dev/docs/tutorials/pattern-design/part1/structure/readme.mdx

@@ -0,0 +1,32 @@
+---
+title: Folder structure
+order: 40
+---
+
+Inside the `freesewing` folder -- which might have a different name if that is
+the choice you made -- you will find a bunch of files and folders.
+
+The one that matter is the `design` folder. In it, you will find the following
+subfolders:
+
+- `from-bella`
+- `from-bent`
+- `from-breanna`
+- `from-brian`
+- `from-scratch`
+- `from-titan`
+- `tutorial`
+
+Remember when you click the **Design** icon in the header it would bring up
+this menu:
+
+![Design templates provided by the FreeSewing development environment](./templates.png)
+
+As you might have guessed by now, each of these options is contained in its
+own subfolder under `designs`. 
+
+You can edit the files under `designs/[template]/src/` and the changes you make
+will be reflected in the development environment.
+
+Don't take my word for it though. Let's start doing exactly that 
+in [Part 2](/tutorials/pattern-design/part2).