feat: create official Netlify Remix template

[nickytonline]

Description

Updates the template. The updated template uses remix.init to offer installing Remix for Netlify Functions or for Netlify Edge Functions. The Netlify Functions template existed already within Remix, but when I was working on remix-run/remix#3104, we turned it into one template, extending the template via remix.init to choose between Netlify Functions and Netlify Edge Functions.

Ignore the deploy preview loading with a page not found. The template has changed and a deploy preview does not make sense at the moment. We'll need to rethink how we deploy the different templates as a deploy preview.

Related Tickets & Documents

• Related Issue Implement Remix server adapter and server runtime for Netlify remix-compute#17
• Closes Update template to reflect the official Netlify Edge Functions adapter and runtime #82

QA Instructions, Screenshots, Recordings

1. Ensure the Netlify CLI is installed and up to date.

2. Check out this branch, e.g. via the GitHub CLI, gh co 83

3. There are four test scenarios:

   • Create a Remix app using TypeScript for Netlify Functions
   • Create a Remix app using JavaScript for Netlify Functions
   • Create a Remix app using TypeScript for Netlify Edge Functions
   • Create a Remix app using JavaScript for Netlify Edge Functions

4. For each scenario, it always starts by running the following from the root folder in a shell.

npx create-remix --template ./

5. The CLI will prompt for a location for the project.

❯ npx create-remix --template ./
? Where would you like to create your app? (./my-remix-app)

Ensure that the location is outside of the Netlify Remix template folder, e.g. ../my-remix-app

6. The Remix CLI will prompt you to choose TypeScript or JavaScript. Choose accordingly for the given test scenarios mentioned above.

? TypeScript or JavaScript? (Use arrow keys)
❯ TypeScript 
  JavaScript

7. The Remix CLI will prompt you to install packages, press the ENTER to accept the default answer of Yes

? Do you want me to run `npm install`? (Y/n)

The npm packages will install.

8. Some files will be manipulated if JavaScript is selected. The Remix CLI will output something similar to this.

⠹ Creating your app…⠋ Migrating template to JavaScript…Processing 3 files... 
Spawning 3 workers...
Sending 1 files to free worker...
Sending 1 files to free worker...
Sending 1 files to free worker...
⠴ Migrating template to JavaScript… SKIP /Users/nicktaylor/dev/remix-tests/edgy-ts/globals.d.ts
⠦ Migrating template to JavaScript… OKK /Users/nicktaylor/dev/remix-tests/edgy-ts/remix.init/root.tsx
 OKK /Users/nicktaylor/dev/remix-tests/edgy-ts/remix.init/entry.server.tsx
All done. 
Results: 
0 errors
0 unmodified
1 skipped
2 ok
Time elapsed: 0.428seconds

9. The Remix CLI extended with our questions will prompt to create the app with Netlify Functions or Netlify Edge Functions.

💿 Running remix.init script
? Run your Remix site with: (Use arrow keys)
❯ Netlify Functions - Choose this for stable support for production sites 
  Netlify Edge Functions (beta) - Try this for improved performance on non-critical sites

Choose accordingly for the given test scenarios mentioned above.

10. Change to the directory of the project you just created, e.g. ../my-remix-app
11. Note that the newly created project should not contain a .github folder
12. The README.md for the project should be for the given deployment target. If you created a new Remix app using the Netlify Functions template, it should have this README. Otherwise, it should be this README.
13. The netlify.toml for the project should be for the given deployment target. If you created a new Remix app using the Netlify Functions template, it should have this netlify.toml. Otherwise, it should be this netlify.toml.
14. Run npm install
15. Run ntl build --offline
16. Run ntl serve
17. Navigate to https://localhost:8888 and the page loads.

Testing a deployment

If you want to test a deploy of your new Remix app created by the Remix template:

1. Ensure you're logged in to Netlify via the CLI

ntl login

3. Create a new site:

ntl init

4. Deploy the site:

ntl deploy --build 

or for production

ntl deploy --build --prod

For us to review and ship your PR efficiently, please perform the following steps:

• Open a bug/issue before writing your code 🧑‍💻. This ensures we
  can discuss the changes and get feedback from everyone that should be involved. If you`re fixing a typo or
  something that`s on fire 🔥 (e.g. incident related), you can skip this step.
• Read the contribution guidelines 📖. This ensures your code follows our style
  guide and passes our tests.
• Update or add tests (if any source code was changed or added) 🧪
• Update or add documentation (if features were changed or added) 📝
• Make sure the status checks below are successful ✅

A picture of a cute animal (not mandatory, but encouraged)

[netlify]

✅ Deploy Preview for remix-edge-on ready!

Name	Link
🔨 Latest commit	be32ac6
🔍 Latest deploy log	https://app.netlify.com/sites/remix-edge-on/deploys/63f910678bbe4600087ab1f8
😎 Deploy Preview	https://deploy-preview-83--remix-edge-on.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[nickytonline]

remix.init was ignoring *.toml files, so I renamed the template files.

[nickytonline]

I fixed the issues with the JS template generation @sarahetter @taty2010. There is one issue currently for the generation of the edge template for a JavaScript project. When the Remix CLI converts files to JS, it translates the ESM import isbot from "isbot" to this require, const isbot = require("isbot").default, when it should be const isbot = require("isbot"). I'm going to fix it for our template, and raise an issue in the Remix repository. I haven't looked at the code, but it looks like it thinks import something from "something" means default import automatically, e.g. const something = require("something").default.

[nickytonline]

This is a new section I added @stephmarie17. Could the wording be improved?

[stephmarie17]

Left a suggestion below!

[taty2010]

👏🏾 templates are working as expected on my end.

[sarahetter]

Templates work, code LGTM!