Hello world

Begin.com supports building static web applications alongside the popular backend JavaScript runtimes Node and Deno. You can even use both Node and Deno in the same app.

Exercise 1: Static website

1. Create a project with Architect

To create a directory for a basic Architect static website, open a terminal window and run the following command:

arc init --static ./my-static-app

2. Spin up the server

Change directories to my-static-app and start the server:

cd my-static-app
arc sandbox

3. Preview the site in your browser

Copy http://localhost:3333 from the terminal output into a web browser to preview your static website.

You should now see Hello world from public/index.html.

To stop the server, hold down the control + C keys in terminal.

---

Exercise 2: HTTP function using Node

1. Initialize with node

To create an HTTP function with Node, open a terminal window and run the following command:

arc init --runtime node ./my-node-app

You should see the terminal output:

⚬ Create Bootstrapping new Architect project
  | Project name .. my-node-app
  | Creating in ... /my-node-app
✓ Create Created Architect project manifest (app.arc)
✓ Create Created new project files in src/http
✓ Create Done!

2. Create a package.json file

Change directories to the new my-node-app directory and run the following commands. The --yes flag will automatically populate package.json with information from the directory.

cd my-node-app
npm init --yes

5. Add a start script to package.json

    "start": "arc sandbox"

6. Start the server

To start the server using npm, run the following command:

npm start

7. Preview in browser

Visit http://localhost:3333 in your web browser to preview your Node application.

---

Exercise 3: HTTP function using Deno

1. To create an HTTP function with Deno, open a terminal window and run the following command:

arc init --runtime deno ./my-deno-app

You should see output like this, as with your Node app:

⚬ Create Bootstrapping new Architect project
  | Project name .. my-deno-app
  | Creating in ... /my-deno-app
✓ Create Created Architect project manifest (app.arc)
✓ Create Created new project files in src/http
✓ Create Done!

2. Go to your new my-deno-app directory:

cd my-deno-app

3. Start the server:

arc sandbox

4. Visit http://localhost:3333 in your web browser to preview your Deno application.

---

Exercise 4: set up testing

1. To create another new app with arc init, run the following command:

arc init --node ./my-app

2. Go to your project directory:

cd my-app

You should now have a source tree that looks like this:

my-app
  └── src
      └── http
          └── get-index
              └── index.js

3. To create a default package.json file using npm, run the following command:

npm init --yes

4. To install testing tools tape and tap-spec, along with @architect/sandbox as development dependencies, run the following command:

npm i tape tap-spec @architect/sandbox -D

5. To add tests to your app, open your package.json file in a text editor and replace the test script line with:

    "start": "arc sandbox", // start script
    "test": "tape test/index-test.js | tap-spec" // test script

6. To add the test scaffolding, create a test folder in the root of your project with index-test.js file in it, and add the following to your test/index-test.js file inside your project directory:

// example sandbox start/stop
let sandbox = require('@architect/sandbox')
let test = require('tape')
let end

test('sandbox.start', async t=> {
  t.plan(1)
  await sandbox.start()
  t.ok(true, 'start the sandbox')
})

// your tests will go here

test('end', async t=> {
  t.plan(1)
  await sandbox.end()
  t.ok(true, 'shut down sandbox')
})

7. Run the tests using npm:

npm t

8. Add a test to see that http://localhost:3333 returns an HTTP statusCode 200 using tiny-json-http