Add files via upload

jessiemongeon1 · web-flow · commit a62ad913f46e · 2025-02-14T14:11:18.000-08:00
diff --git a/motoko/hello_world/frontend/index.html b/motoko/hello_world/frontend/index.html
@@ -0,0 +1,45 @@
+<!doctype html>
+<html>
+  <head>
+    <title>Hello World</title>
+    <style>
+      body {
+        padding: 10px 60px;
+        font-family: sans-serif;
+        font-size: 1.5rem;
+      }
+      #greeting {
+        margin: 10px auto;
+        padding: 10px 60px;
+        border: 1px solid #222;
+      }
+      #greeting:empty {
+        display: none;
+      }
+    </style>
+    <script type="module">
+      // Import the backend actor
+      import { backend } from 'declarations/backend';
+      // Add an event listener to the form
+      document.querySelector('form').addEventListener('submit', async (e) => {
+        e.preventDefault();
+        // Get the name from the input field
+        const name = document.getElementById('name').value.toString();
+        // Calling the method "greet" on the backend actor with the name
+        const greeting = await backend.greet(name);
+        // Display the greeting returned by the backend actor
+        document.getElementById('greeting').innerText = greeting;
+      });
+    </script>
+  </head>
+  <body>
+    <main>
+      <form>
+        <label for="name">Enter your name: &nbsp;</label>
+        <input id="name" alt="Name" type="text" />
+        <button type="submit">Click Me!</button>
+      </form>
+      <section id="greeting"></section>
+    </main>
+  </body>
+</html>
diff --git a/motoko/hello_world/frontend/package.json b/motoko/hello_world/frontend/package.json
@@ -0,0 +1,17 @@
+{
+  "name": "frontend",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "prebuild": "npm i --include=dev && dfx generate backend",
+    "build": "vite build",
+    "dev": "vite"
+  },
+  "dependencies": {
+    "@dfinity/agent": "2.2.0"
+  },
+  "devDependencies": {
+    "vite": "5.4.11",
+    "vite-plugin-environment": "1.1.3"
+  }
+}
diff --git a/motoko/hello_world/frontend/vite.config.js b/motoko/hello_world/frontend/vite.config.js
@@ -0,0 +1,36 @@
+import { defineConfig } from 'vite';
+import { fileURLToPath, URL } from 'url';
+import environment from 'vite-plugin-environment';
+
+export default defineConfig({
+  base: './',
+  plugins: [environment('all', { prefix: 'CANISTER_' }), environment('all', { prefix: 'DFX_' })],
+  envDir: '../',
+  define: {
+    'process.env': process.env
+  },
+  optimizeDeps: {
+    esbuildOptions: {
+      define: {
+        global: 'globalThis'
+      }
+    }
+  },
+  resolve: {
+    alias: [
+      {
+        find: 'declarations',
+        replacement: fileURLToPath(new URL('../src/declarations', import.meta.url))
+      }
+    ]
+  },
+  server: {
+    proxy: {
+      '/api': {
+        target: 'http://127.0.0.1:4943',
+        changeOrigin: true
+      }
+    },
+    host: '127.0.0.1'
+  }
+});
