Skip to content

Commit 69dee6f

Browse files
authored
copy remix example from vercel/vercel (#1027)
1 parent 1a1b2f0 commit 69dee6f

File tree

10 files changed

+202
-0
lines changed

10 files changed

+202
-0
lines changed
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
/** @type {import('eslint').Linter.Config} */
2+
module.exports = {
3+
extends: ["@remix-run/eslint-config", "@remix-run/eslint-config/node"],
4+
};
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
node_modules
2+
3+
/build
4+
.env
5+
.vercel
Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
# Remix
2+
3+
This directory is a brief example of a [Remix](https://remix.run/docs) site that can be deployed to Vercel with zero configuration.
4+
5+
To get started, run the Remix cli with this template
6+
7+
```sh
8+
npx create-remix@latest --template vercel/vercel/examples/remix
9+
```
10+
11+
## Deploy Your Own
12+
13+
[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/vercel/examples/tree/main/framework-boilerplates/remix&template=remix)
14+
15+
_Live Example: https://remix-run-template.vercel.app_
16+
17+
You can also deploy using the [Vercel CLI](https://vercel.com/docs/cli):
18+
19+
```sh
20+
npm i -g vercel
21+
vercel
22+
```
23+
24+
## Development
25+
26+
To run your Remix app locally, make sure your project's local dependencies are installed:
27+
28+
```sh
29+
npm install
30+
```
31+
32+
Afterwards, start the Remix development server like so:
33+
34+
```sh
35+
npm run dev
36+
```
37+
38+
Open up [http://localhost:5173](http://localhost:5173) and you should be ready to go!
Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
import {
2+
Links,
3+
Meta,
4+
Outlet,
5+
Scripts,
6+
ScrollRestoration,
7+
} from "@remix-run/react";
8+
import { Analytics } from "@vercel/analytics/react";
9+
10+
export function Layout({ children }: { children: React.ReactNode }) {
11+
return (
12+
<html lang="en">
13+
<head>
14+
<meta charSet="utf-8" />
15+
<meta name="viewport" content="width=device-width, initial-scale=1" />
16+
<Meta />
17+
<Links />
18+
</head>
19+
<body>
20+
{children}
21+
<ScrollRestoration />
22+
<Scripts />
23+
<Analytics />
24+
</body>
25+
</html>
26+
);
27+
}
28+
29+
export default function App() {
30+
return <Outlet />;
31+
}
Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
import type { MetaFunction } from "@vercel/remix";
2+
3+
export const meta: MetaFunction = () => {
4+
return [
5+
{ title: "New Remix App" },
6+
{ name: "description", content: "Welcome to Remix!" },
7+
];
8+
};
9+
10+
export default function Index() {
11+
return (
12+
<div style={{ fontFamily: "system-ui, sans-serif", lineHeight: "1.8" }}>
13+
<h1>Welcome to Remix</h1>
14+
<ul>
15+
<li>
16+
<a
17+
target="_blank"
18+
href="https://remix.run/tutorials/blog"
19+
rel="noreferrer"
20+
>
21+
15m Quickstart Blog Tutorial
22+
</a>
23+
</li>
24+
<li>
25+
<a
26+
target="_blank"
27+
href="https://remix.run/tutorials/jokes"
28+
rel="noreferrer"
29+
>
30+
Deep Dive Jokes App Tutorial
31+
</a>
32+
</li>
33+
<li>
34+
<a target="_blank" href="https://remix.run/docs" rel="noreferrer">
35+
Remix Docs
36+
</a>
37+
</li>
38+
</ul>
39+
</div>
40+
);
41+
}
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import type { MetaFunction } from "@vercel/remix";
2+
3+
export const config = { runtime: "edge" };
4+
5+
export const meta: MetaFunction = () => [{ title: "Remix@Edge | New Remix App" }];
6+
7+
export default function Edge() {
8+
return (
9+
<div style={{ fontFamily: "system-ui, sans-serif", lineHeight: "1.4" }}>
10+
<h1>Welcome to Remix@Edge</h1>
11+
</div>
12+
);
13+
}
Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
{
2+
"name": "my-remix-app",
3+
"private": true,
4+
"sideEffects": false,
5+
"type": "module",
6+
"scripts": {
7+
"build": "remix vite:build",
8+
"dev": "remix vite:dev",
9+
"typecheck": "tsc"
10+
},
11+
"dependencies": {
12+
"@remix-run/node": "2.10.0",
13+
"@remix-run/react": "2.10.0",
14+
"@remix-run/server-runtime": "2.10.0",
15+
"@vercel/analytics": "^1.2.2",
16+
"@vercel/remix": "2.10.0",
17+
"isbot": "^4",
18+
"react": "^18.2.0",
19+
"react-dom": "^18.2.0"
20+
},
21+
"devDependencies": {
22+
"@remix-run/dev": "2.10.0",
23+
"@remix-run/eslint-config": "2.10.0",
24+
"@types/react": "^18.2.20",
25+
"@types/react-dom": "^18.2.7",
26+
"eslint": "^8.38.0",
27+
"typescript": "^5.1.6",
28+
"vite": "^5.1.0",
29+
"vite-tsconfig-paths": "^4.2.1"
30+
},
31+
"engines": {
32+
"node": ">=18.0.0"
33+
}
34+
}
16.6 KB
Binary file not shown.
Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
{
2+
"include": ["**/*.ts", "**/*.tsx"],
3+
"compilerOptions": {
4+
"lib": ["DOM", "DOM.Iterable", "ES2022"],
5+
"types": ["@vercel/remix", "node", "vite/client"],
6+
"isolatedModules": true,
7+
"esModuleInterop": true,
8+
"jsx": "react-jsx",
9+
"module": "ESNext",
10+
"moduleResolution": "Bundler",
11+
"resolveJsonModule": true,
12+
"target": "ES2022",
13+
"strict": true,
14+
"allowJs": true,
15+
"skipLibCheck": true,
16+
"forceConsistentCasingInFileNames": true,
17+
"baseUrl": ".",
18+
"paths": {
19+
"~/*": ["./app/*"]
20+
},
21+
22+
// Vite takes care of building everything, not tsc.
23+
"noEmit": true
24+
}
25+
}
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import { vitePlugin as remix } from "@remix-run/dev";
2+
import { installGlobals } from "@remix-run/node";
3+
import { defineConfig } from "vite";
4+
import { vercelPreset } from "@vercel/remix/vite";
5+
import tsconfigPaths from "vite-tsconfig-paths";
6+
7+
installGlobals();
8+
9+
export default defineConfig({
10+
plugins: [remix({ presets: [vercelPreset()] }), tsconfigPaths()],
11+
});

0 commit comments

Comments
 (0)