create-harper 0.0.1 → 0.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/constants/defaultTargetDir.js +1 -0
- package/lib/constants/frameworks.js +75 -0
- package/lib/constants/helpMessage.js +23 -0
- package/lib/constants/renameFiles.js +6 -0
- package/lib/constants/templates.js +6 -0
- package/lib/fs/applyAndWriteTemplateFile.js +9 -0
- package/lib/fs/copy.js +11 -0
- package/lib/fs/copyDir.js +12 -0
- package/lib/fs/crawlTemplateDir.js +18 -0
- package/lib/fs/editFile.js +6 -0
- package/lib/fs/emptyDir.js +14 -0
- package/lib/fs/formatTargetDir.js +3 -0
- package/lib/fs/isEmpty.js +6 -0
- package/lib/install.js +17 -0
- package/lib/pkg/getFullCustomCommand.js +47 -0
- package/lib/pkg/getInstallCommand.js +6 -0
- package/lib/pkg/getRunCommand.js +12 -0
- package/lib/pkg/isValidPackageName.js +5 -0
- package/lib/pkg/pkgFromUserAgent.js +9 -0
- package/lib/pkg/toValidPackageName.js +8 -0
- package/lib/run.js +14 -0
- package/lib/start.js +15 -0
- package/package.json +10 -2
- package/template-barebones/README.md +7 -0
- package/template-barebones/config.yaml +7 -0
- package/template-barebones/package.json +14 -0
- package/template-barebones/schema.graphql +1 -0
- package/template-react/README.md +45 -0
- package/template-react/_github/workflow/deploy.yaml +40 -0
- package/template-react/config.yaml +23 -0
- package/template-react/deploy-template/config.yaml +2 -0
- package/template-react/deploy-template/fastify/static.js +14 -0
- package/template-react/deploy-template/package.json +5 -0
- package/template-react/index.html +13 -0
- package/template-react/package.json +24 -0
- package/template-react/public/react.svg +14 -0
- package/template-react/public/typescript.svg +16 -0
- package/template-react/public/vite.svg +42 -0
- package/template-react/resources.js +27 -0
- package/template-react/schema.graphql +5 -0
- package/template-react/src/App.jsx +34 -0
- package/template-react/src/main.jsx +13 -0
- package/template-react/src/style.css +96 -0
- package/template-react/src/vite-env.d.ts +9 -0
- package/template-react/vite.config.js +22 -0
- package/template-react-ts/README.md +45 -0
- package/template-react-ts/_github/workflow/deploy.yaml +40 -0
- package/template-react-ts/config.yaml +23 -0
- package/template-react-ts/deploy-template/config.yaml +2 -0
- package/template-react-ts/deploy-template/fastify/static.js +14 -0
- package/template-react-ts/deploy-template/package.json +5 -0
- package/template-react-ts/index.html +13 -0
- package/template-react-ts/package.json +28 -0
- package/template-react-ts/public/react.svg +14 -0
- package/template-react-ts/public/typescript.svg +16 -0
- package/template-react-ts/public/vite.svg +42 -0
- package/template-react-ts/resources.ts +52 -0
- package/template-react-ts/schema.graphql +5 -0
- package/template-react-ts/src/App.tsx +34 -0
- package/template-react-ts/src/main.tsx +13 -0
- package/template-react-ts/src/style.css +96 -0
- package/template-react-ts/src/vite-env.d.ts +9 -0
- package/template-react-ts/tsconfig.json +34 -0
- package/template-react-ts/vite.config.ts +22 -0
- package/template-shared/_aiignore +1 -0
- package/template-shared/_env.example +3 -0
- package/template-shared/_gitignore +147 -0
- package/template-shared/graphql.config.yml +3 -0
- package/template-studio/README.md +34 -0
- package/template-studio/config.yaml +24 -0
- package/template-studio/package.json +14 -0
- package/template-studio/resources.js +27 -0
- package/template-studio/schema.graphql +7 -0
- package/template-studio/web/index.html +28 -0
- package/template-studio/web/index.js +18 -0
- package/template-studio/web/styles.css +57 -0
- package/template-studio-ts/README.md +34 -0
- package/template-studio-ts/config.yaml +24 -0
- package/template-studio-ts/package.json +14 -0
- package/template-studio-ts/resources.ts +52 -0
- package/template-studio-ts/schema.graphql +7 -0
- package/template-studio-ts/tsconfig.json +10 -0
- package/template-studio-ts/web/index.html +28 -0
- package/template-studio-ts/web/index.js +18 -0
- package/template-studio-ts/web/styles.css +57 -0
- package/template-vanilla/README.md +57 -0
- package/template-vanilla/config.yaml +24 -0
- package/template-vanilla/package.json +14 -0
- package/template-vanilla/resources.js +27 -0
- package/template-vanilla/schema.graphql +7 -0
- package/template-vanilla/web/index.html +28 -0
- package/template-vanilla/web/index.js +18 -0
- package/template-vanilla/web/styles.css +57 -0
- package/template-vanilla-ts/README.md +57 -0
- package/template-vanilla-ts/config.yaml +24 -0
- package/template-vanilla-ts/package.json +14 -0
- package/template-vanilla-ts/resources.ts +52 -0
- package/template-vanilla-ts/schema.graphql +7 -0
- package/template-vanilla-ts/tsconfig.json +10 -0
- package/template-vanilla-ts/web/index.html +28 -0
- package/template-vanilla-ts/web/index.js +18 -0
- package/template-vanilla-ts/web/styles.css +57 -0
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8" />
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
|
+
<title>Harper Application Template</title>
|
|
7
|
+
<link rel="stylesheet" href="styles.css" />
|
|
8
|
+
</head>
|
|
9
|
+
<body>
|
|
10
|
+
<main>
|
|
11
|
+
<h1>Harper Application Template</h1>
|
|
12
|
+
<p>
|
|
13
|
+
This is an example of serving static assets using the built-in
|
|
14
|
+
<a
|
|
15
|
+
href="https://docs.harperdb.io/docs/reference/components/built-in-extensions#static"
|
|
16
|
+
>static component</a>. <br />
|
|
17
|
+
You can use this component to serve web applications!
|
|
18
|
+
</p>
|
|
19
|
+
<div>
|
|
20
|
+
<p class="count" id="count">0</p>
|
|
21
|
+
<button class="decrement" id="decrement">-</button>
|
|
22
|
+
<button class="increment" id="increment">+</button>
|
|
23
|
+
</div>
|
|
24
|
+
</main>
|
|
25
|
+
|
|
26
|
+
<script src="index.js"></script>
|
|
27
|
+
</body>
|
|
28
|
+
</html>
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
let count = 0;
|
|
2
|
+
const counterDisplay = document.getElementById('count');
|
|
3
|
+
const decrementButton = document.getElementById('decrement');
|
|
4
|
+
const incrementButton = document.getElementById('increment');
|
|
5
|
+
|
|
6
|
+
function updateDisplay() {
|
|
7
|
+
counterDisplay.textContent = count;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
decrementButton.addEventListener('click', () => {
|
|
11
|
+
count--;
|
|
12
|
+
updateDisplay();
|
|
13
|
+
});
|
|
14
|
+
|
|
15
|
+
incrementButton.addEventListener('click', () => {
|
|
16
|
+
count++;
|
|
17
|
+
updateDisplay();
|
|
18
|
+
});
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
body {
|
|
2
|
+
font-family: Arial, sans-serif;
|
|
3
|
+
display: flex;
|
|
4
|
+
justify-content: center;
|
|
5
|
+
align-items: center;
|
|
6
|
+
height: 100vh;
|
|
7
|
+
margin: 0;
|
|
8
|
+
background-color: #f5f5f5;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
main {
|
|
12
|
+
text-align: center;
|
|
13
|
+
background-color: white;
|
|
14
|
+
padding: 2rem;
|
|
15
|
+
border-radius: 8px;
|
|
16
|
+
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.count {
|
|
20
|
+
font-size: 4rem;
|
|
21
|
+
margin: 1rem 0;
|
|
22
|
+
color: #333;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
.counter-controls {
|
|
26
|
+
display: flex;
|
|
27
|
+
justify-content: center;
|
|
28
|
+
gap: 1rem;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
button {
|
|
32
|
+
font-size: 1.5rem;
|
|
33
|
+
width: 3rem;
|
|
34
|
+
height: 3rem;
|
|
35
|
+
border: none;
|
|
36
|
+
border-radius: 50%;
|
|
37
|
+
cursor: pointer;
|
|
38
|
+
transition: background-color 0.2s;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
.decrement {
|
|
42
|
+
background-color: #ff6b6b;
|
|
43
|
+
color: white;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
.decrement:hover {
|
|
47
|
+
background-color: #ff5252;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.increment {
|
|
51
|
+
background-color: #4ecdc4;
|
|
52
|
+
color: white;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
.increment:hover {
|
|
56
|
+
background-color: #39b2a9;
|
|
57
|
+
}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
# <<projectName>>
|
|
2
|
+
|
|
3
|
+
## Installation
|
|
4
|
+
|
|
5
|
+
To get started, make sure you have [installed Harper](https://docs.harperdb.io/docs/deployments/install-harper), which can be done quickly:
|
|
6
|
+
|
|
7
|
+
```sh
|
|
8
|
+
npm install -g harperdb
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Development
|
|
12
|
+
|
|
13
|
+
Then you can start your app:
|
|
14
|
+
|
|
15
|
+
```sh
|
|
16
|
+
npm run dev
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
Test your application works by querying the `/Greeting` endpoint:
|
|
20
|
+
|
|
21
|
+
```sh
|
|
22
|
+
curl http://localhost:9926/Greeting
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
You should see the following:
|
|
26
|
+
|
|
27
|
+
```json
|
|
28
|
+
{ "greeting": "Hello, world!" }
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
Navigate to [http://localhost:9926](http://localhost:9926) in a browser and view the functional web application.
|
|
32
|
+
|
|
33
|
+
For more information about getting started with HarperDB and building applications, see our [getting started guide](https://docs.harperdb.io/docs).
|
|
34
|
+
|
|
35
|
+
For more information on Harper Components, see the [Components documentation](https://docs.harperdb.io/docs/reference/components).
|
|
36
|
+
|
|
37
|
+
Take a look at the [default configuration](./config.yaml), which specifies how files are handled in your application.
|
|
38
|
+
|
|
39
|
+
The [schema.graphql](./schema.graphql) is the table schema definition. This is the main starting point for defining your database schema, specifying which tables you want and what attributes/fields they should have.
|
|
40
|
+
|
|
41
|
+
The [resources.js](./resources.js) provides a template for defining JavaScript resource classes, for customized application logic in your endpoints.
|
|
42
|
+
|
|
43
|
+
## Deployment
|
|
44
|
+
|
|
45
|
+
When you are ready, head to [https://fabric.harper.fast/](https://fabric.harper.fast/), log in to your account, and create a cluster.
|
|
46
|
+
|
|
47
|
+
Set up your .env file with your secure cluster credentials. Don't commit this file to source control!
|
|
48
|
+
|
|
49
|
+
```sh
|
|
50
|
+
npm run login
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
Then you can deploy your app to your cluster:
|
|
54
|
+
|
|
55
|
+
```sh
|
|
56
|
+
npm run deploy
|
|
57
|
+
```
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
# yaml-language-server: $schema=./node_modules/harperdb/config-app.schema.json
|
|
2
|
+
|
|
3
|
+
# This is the configuration file for the application.
|
|
4
|
+
# It specifies built-in Harper components that will load the specified feature and files.
|
|
5
|
+
# For more information, see https://docs.harperdb.io/docs/reference/components/built-in-extensions
|
|
6
|
+
|
|
7
|
+
# Load Environment Variables from the specified file
|
|
8
|
+
# loadEnv:
|
|
9
|
+
# files: '.env'
|
|
10
|
+
|
|
11
|
+
# This provides the HTTP REST interface for all exported resources
|
|
12
|
+
rest: true
|
|
13
|
+
|
|
14
|
+
# These reads GraphQL schemas to define the schema of database/tables/attributes.
|
|
15
|
+
graphqlSchema:
|
|
16
|
+
files: 'schema.graphql'
|
|
17
|
+
|
|
18
|
+
# Loads JavaScript modules such that their exports are exported as resources
|
|
19
|
+
jsResource:
|
|
20
|
+
files: 'resources.js'
|
|
21
|
+
|
|
22
|
+
# Serve the static files from the web directory as a web application
|
|
23
|
+
static:
|
|
24
|
+
files: 'web/*'
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "<<packageName>>",
|
|
3
|
+
"version": "1.0.0",
|
|
4
|
+
"description": "Your new Harper app",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"scripts": {
|
|
7
|
+
"start": "harperdb run .",
|
|
8
|
+
"dev": "harperdb dev .",
|
|
9
|
+
"deploy": "npx -y dotenv-cli -- harperdb deploy . restart=rolling replicated=true"
|
|
10
|
+
},
|
|
11
|
+
"devDependencies": {
|
|
12
|
+
"harperdb": "^4.7.15"
|
|
13
|
+
}
|
|
14
|
+
}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { Resource } from 'harperdb';
|
|
2
|
+
|
|
3
|
+
/** Here we can define any JavaScript-based resources and extensions to tables
|
|
4
|
+
import {tables} from 'harperdb';
|
|
5
|
+
|
|
6
|
+
export class MyCustomResource extends tables.TableName {
|
|
7
|
+
// we can define our own custom POST handler
|
|
8
|
+
post(content) {
|
|
9
|
+
// do something with the incoming content;
|
|
10
|
+
return super.post(content);
|
|
11
|
+
}
|
|
12
|
+
// or custom GET handler
|
|
13
|
+
get() {
|
|
14
|
+
// we can modify this resource before returning
|
|
15
|
+
return super.get();
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
*/
|
|
19
|
+
// we can also define a custom resource without a specific table
|
|
20
|
+
export class Greeting extends Resource {
|
|
21
|
+
// a "Hello, world!" handler
|
|
22
|
+
static loadAsInstance = false; // use the updated/newer Resource API
|
|
23
|
+
|
|
24
|
+
get() {
|
|
25
|
+
return { greeting: 'Hello, world!' };
|
|
26
|
+
}
|
|
27
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
## Here we can define any tables in our database. This example shows how we define a type as a table using
|
|
2
|
+
## the type name as the table name and specifying it is an "export" available in the REST and other external protocols.
|
|
3
|
+
type TableName @table @export {
|
|
4
|
+
id: ID @primaryKey # Here we define primary key (must be one)
|
|
5
|
+
name: String # we can define any other attributes here
|
|
6
|
+
tag: String @indexed # we can specify any attributes that should be indexed
|
|
7
|
+
}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8" />
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
|
+
<title>Harper Application Template</title>
|
|
7
|
+
<link rel="stylesheet" href="styles.css" />
|
|
8
|
+
</head>
|
|
9
|
+
<body>
|
|
10
|
+
<main>
|
|
11
|
+
<h1>Harper Application Template</h1>
|
|
12
|
+
<p>
|
|
13
|
+
This is an example of serving static assets using the built-in
|
|
14
|
+
<a
|
|
15
|
+
href="https://docs.harperdb.io/docs/reference/components/built-in-extensions#static"
|
|
16
|
+
>static component</a>. <br />
|
|
17
|
+
You can use this component to serve web applications!
|
|
18
|
+
</p>
|
|
19
|
+
<div>
|
|
20
|
+
<p class="count" id="count">0</p>
|
|
21
|
+
<button class="decrement" id="decrement">-</button>
|
|
22
|
+
<button class="increment" id="increment">+</button>
|
|
23
|
+
</div>
|
|
24
|
+
</main>
|
|
25
|
+
|
|
26
|
+
<script src="index.js"></script>
|
|
27
|
+
</body>
|
|
28
|
+
</html>
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
let count = 0;
|
|
2
|
+
const counterDisplay = document.getElementById('count');
|
|
3
|
+
const decrementButton = document.getElementById('decrement');
|
|
4
|
+
const incrementButton = document.getElementById('increment');
|
|
5
|
+
|
|
6
|
+
function updateDisplay() {
|
|
7
|
+
counterDisplay.textContent = count;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
decrementButton.addEventListener('click', () => {
|
|
11
|
+
count--;
|
|
12
|
+
updateDisplay();
|
|
13
|
+
});
|
|
14
|
+
|
|
15
|
+
incrementButton.addEventListener('click', () => {
|
|
16
|
+
count++;
|
|
17
|
+
updateDisplay();
|
|
18
|
+
});
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
body {
|
|
2
|
+
font-family: Arial, sans-serif;
|
|
3
|
+
display: flex;
|
|
4
|
+
justify-content: center;
|
|
5
|
+
align-items: center;
|
|
6
|
+
height: 100vh;
|
|
7
|
+
margin: 0;
|
|
8
|
+
background-color: #f5f5f5;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
main {
|
|
12
|
+
text-align: center;
|
|
13
|
+
background-color: white;
|
|
14
|
+
padding: 2rem;
|
|
15
|
+
border-radius: 8px;
|
|
16
|
+
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.count {
|
|
20
|
+
font-size: 4rem;
|
|
21
|
+
margin: 1rem 0;
|
|
22
|
+
color: #333;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
.counter-controls {
|
|
26
|
+
display: flex;
|
|
27
|
+
justify-content: center;
|
|
28
|
+
gap: 1rem;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
button {
|
|
32
|
+
font-size: 1.5rem;
|
|
33
|
+
width: 3rem;
|
|
34
|
+
height: 3rem;
|
|
35
|
+
border: none;
|
|
36
|
+
border-radius: 50%;
|
|
37
|
+
cursor: pointer;
|
|
38
|
+
transition: background-color 0.2s;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
.decrement {
|
|
42
|
+
background-color: #ff6b6b;
|
|
43
|
+
color: white;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
.decrement:hover {
|
|
47
|
+
background-color: #ff5252;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.increment {
|
|
51
|
+
background-color: #4ecdc4;
|
|
52
|
+
color: white;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
.increment:hover {
|
|
56
|
+
background-color: #39b2a9;
|
|
57
|
+
}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
# <<projectName>>
|
|
2
|
+
|
|
3
|
+
## Installation
|
|
4
|
+
|
|
5
|
+
To get started, make sure you have [installed Harper](https://docs.harperdb.io/docs/deployments/install-harper), which can be done quickly:
|
|
6
|
+
|
|
7
|
+
```sh
|
|
8
|
+
npm install -g harperdb
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Development
|
|
12
|
+
|
|
13
|
+
Then you can start your app:
|
|
14
|
+
|
|
15
|
+
```sh
|
|
16
|
+
npm run dev
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
Test your application works by querying the `/Greeting` endpoint:
|
|
20
|
+
|
|
21
|
+
```sh
|
|
22
|
+
curl http://localhost:9926/Greeting
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
You should see the following:
|
|
26
|
+
|
|
27
|
+
```json
|
|
28
|
+
{ "greeting": "Hello, world!" }
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
Navigate to [http://localhost:9926](http://localhost:9926) in a browser and view the functional web application.
|
|
32
|
+
|
|
33
|
+
For more information about getting started with HarperDB and building applications, see our [getting started guide](https://docs.harperdb.io/docs).
|
|
34
|
+
|
|
35
|
+
For more information on Harper Components, see the [Components documentation](https://docs.harperdb.io/docs/reference/components).
|
|
36
|
+
|
|
37
|
+
Take a look at the [default configuration](./config.yaml), which specifies how files are handled in your application.
|
|
38
|
+
|
|
39
|
+
The [schema.graphql](./schema.graphql) is the table schema definition. This is the main starting point for defining your database schema, specifying which tables you want and what attributes/fields they should have.
|
|
40
|
+
|
|
41
|
+
The [resources.js](resources.ts) provides a template for defining JavaScript resource classes, for customized application logic in your endpoints.
|
|
42
|
+
|
|
43
|
+
## Deployment
|
|
44
|
+
|
|
45
|
+
When you are ready, head to [https://fabric.harper.fast/](https://fabric.harper.fast/), log in to your account, and create a cluster.
|
|
46
|
+
|
|
47
|
+
Set up your .env file with your secure cluster credentials. Don't commit this file to source control!
|
|
48
|
+
|
|
49
|
+
```sh
|
|
50
|
+
npm run login
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
Then you can deploy your app to your cluster:
|
|
54
|
+
|
|
55
|
+
```sh
|
|
56
|
+
npm run deploy
|
|
57
|
+
```
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
# yaml-language-server: $schema=./node_modules/harperdb/config-app.schema.json
|
|
2
|
+
|
|
3
|
+
# This is the configuration file for the application.
|
|
4
|
+
# It specifies built-in Harper components that will load the specified feature and files.
|
|
5
|
+
# For more information, see https://docs.harperdb.io/docs/reference/components/built-in-extensions
|
|
6
|
+
|
|
7
|
+
# Load Environment Variables from the specified file
|
|
8
|
+
# loadEnv:
|
|
9
|
+
# files: '.env'
|
|
10
|
+
|
|
11
|
+
# This provides the HTTP REST interface for all exported resources
|
|
12
|
+
rest: true
|
|
13
|
+
|
|
14
|
+
# These reads GraphQL schemas to define the schema of database/tables/attributes.
|
|
15
|
+
graphqlSchema:
|
|
16
|
+
files: 'schema.graphql'
|
|
17
|
+
|
|
18
|
+
# Loads JavaScript modules such that their exports are exported as resources
|
|
19
|
+
jsResource:
|
|
20
|
+
files: 'resources.ts'
|
|
21
|
+
|
|
22
|
+
# Serve the static files from the web directory as a web application
|
|
23
|
+
static:
|
|
24
|
+
files: 'web/*'
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "<<packageName>>",
|
|
3
|
+
"version": "1.0.0",
|
|
4
|
+
"description": "Your new Harper app",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"scripts": {
|
|
7
|
+
"start": "harperdb run .",
|
|
8
|
+
"dev": "harperdb dev .",
|
|
9
|
+
"deploy": "npx -y dotenv-cli -- harperdb deploy . restart=rolling replicated=true"
|
|
10
|
+
},
|
|
11
|
+
"devDependencies": {
|
|
12
|
+
"harperdb": "^4.7.15"
|
|
13
|
+
}
|
|
14
|
+
}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { type RecordObject, type RequestTargetOrId, Resource } from 'harperdb';
|
|
2
|
+
|
|
3
|
+
/** Here we can define any JavaScript-based resources and extensions to tables
|
|
4
|
+
import { tables, type RequestTarget } from 'harperdb';
|
|
5
|
+
|
|
6
|
+
interface TableNameRecord {
|
|
7
|
+
id: string;
|
|
8
|
+
name: string;
|
|
9
|
+
tag: string;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
export class TableName extends tables.TableName<TableNameRecord> {
|
|
13
|
+
// we can define our own custom POST handler
|
|
14
|
+
async post(target: RequestTargetOrId, newRecord: Omit<TableNameRecord, 'id'>) {
|
|
15
|
+
// do something with the incoming content;
|
|
16
|
+
return super.post(target, newRecord);
|
|
17
|
+
}
|
|
18
|
+
// or custom GET handler
|
|
19
|
+
async get(target: RequestTarget): Promise<TableNameRecord> {
|
|
20
|
+
// we can modify this resource before returning
|
|
21
|
+
return super.get(target);
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
*/
|
|
25
|
+
|
|
26
|
+
interface GreetingRecord {
|
|
27
|
+
greeting: string;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
export class Greeting extends Resource<GreetingRecord> {
|
|
31
|
+
static loadAsInstance = false;
|
|
32
|
+
|
|
33
|
+
async post(target: RequestTargetOrId, newRecord: Partial<GreetingRecord & RecordObject>): Promise<GreetingRecord> {
|
|
34
|
+
return { greeting: 'Greetings, post!' };
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
async get(target?: RequestTargetOrId): Promise<GreetingRecord> {
|
|
38
|
+
return { greeting: 'Greetings, get!' };
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
async put(target: RequestTargetOrId, record: GreetingRecord & RecordObject): Promise<GreetingRecord> {
|
|
42
|
+
return { greeting: 'Greetings, put!' };
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
async patch(target: RequestTargetOrId, record: Partial<GreetingRecord & RecordObject>): Promise<GreetingRecord> {
|
|
46
|
+
return { greeting: 'Greetings, patch!' };
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
async delete(target: RequestTargetOrId): Promise<boolean> {
|
|
50
|
+
return true;
|
|
51
|
+
}
|
|
52
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
## Here we can define any tables in our database. This example shows how we define a type as a table using
|
|
2
|
+
## the type name as the table name and specifying it is an "export" available in the REST and other external protocols.
|
|
3
|
+
type TableName @table @export {
|
|
4
|
+
id: ID @primaryKey # Here we define primary key (must be one)
|
|
5
|
+
name: String # we can define any other attributes here
|
|
6
|
+
tag: String @indexed # we can specify any attributes that should be indexed
|
|
7
|
+
}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8" />
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
|
+
<title>Harper Application Template</title>
|
|
7
|
+
<link rel="stylesheet" href="styles.css" />
|
|
8
|
+
</head>
|
|
9
|
+
<body>
|
|
10
|
+
<main>
|
|
11
|
+
<h1>Harper Application Template</h1>
|
|
12
|
+
<p>
|
|
13
|
+
This is an example of serving static assets using the built-in
|
|
14
|
+
<a
|
|
15
|
+
href="https://docs.harperdb.io/docs/reference/components/built-in-extensions#static"
|
|
16
|
+
>static component</a>. <br />
|
|
17
|
+
You can use this component to serve web applications!
|
|
18
|
+
</p>
|
|
19
|
+
<div>
|
|
20
|
+
<p class="count" id="count">0</p>
|
|
21
|
+
<button class="decrement" id="decrement">-</button>
|
|
22
|
+
<button class="increment" id="increment">+</button>
|
|
23
|
+
</div>
|
|
24
|
+
</main>
|
|
25
|
+
|
|
26
|
+
<script src="index.js"></script>
|
|
27
|
+
</body>
|
|
28
|
+
</html>
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
let count = 0;
|
|
2
|
+
const counterDisplay = document.getElementById('count');
|
|
3
|
+
const decrementButton = document.getElementById('decrement');
|
|
4
|
+
const incrementButton = document.getElementById('increment');
|
|
5
|
+
|
|
6
|
+
function updateDisplay() {
|
|
7
|
+
counterDisplay.textContent = count;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
decrementButton.addEventListener('click', () => {
|
|
11
|
+
count--;
|
|
12
|
+
updateDisplay();
|
|
13
|
+
});
|
|
14
|
+
|
|
15
|
+
incrementButton.addEventListener('click', () => {
|
|
16
|
+
count++;
|
|
17
|
+
updateDisplay();
|
|
18
|
+
});
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
body {
|
|
2
|
+
font-family: Arial, sans-serif;
|
|
3
|
+
display: flex;
|
|
4
|
+
justify-content: center;
|
|
5
|
+
align-items: center;
|
|
6
|
+
height: 100vh;
|
|
7
|
+
margin: 0;
|
|
8
|
+
background-color: #f5f5f5;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
main {
|
|
12
|
+
text-align: center;
|
|
13
|
+
background-color: white;
|
|
14
|
+
padding: 2rem;
|
|
15
|
+
border-radius: 8px;
|
|
16
|
+
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.count {
|
|
20
|
+
font-size: 4rem;
|
|
21
|
+
margin: 1rem 0;
|
|
22
|
+
color: #333;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
.counter-controls {
|
|
26
|
+
display: flex;
|
|
27
|
+
justify-content: center;
|
|
28
|
+
gap: 1rem;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
button {
|
|
32
|
+
font-size: 1.5rem;
|
|
33
|
+
width: 3rem;
|
|
34
|
+
height: 3rem;
|
|
35
|
+
border: none;
|
|
36
|
+
border-radius: 50%;
|
|
37
|
+
cursor: pointer;
|
|
38
|
+
transition: background-color 0.2s;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
.decrement {
|
|
42
|
+
background-color: #ff6b6b;
|
|
43
|
+
color: white;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
.decrement:hover {
|
|
47
|
+
background-color: #ff5252;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.increment {
|
|
51
|
+
background-color: #4ecdc4;
|
|
52
|
+
color: white;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
.increment:hover {
|
|
56
|
+
background-color: #39b2a9;
|
|
57
|
+
}
|