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
  1. Spin up the server

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

cd my-static-app
arc sandbox
  1. 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 (.arc)
✓ Create Created new project files in src/http
✓ Create Done!
  1. 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
  1. Add a start script to package.json
    "start": "arc sandbox"
  1. Start the server

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

npm start
  1. 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 (.arc)
✓ Create Created new project files in src/http
✓ Create Done!
  1. Go to your new my-deno-app directory:
cd my-deno-app
  1. Start the server:
arc sandbox
  1. 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
  1. 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
  1. To create a default package.json file using npm, run the following command:
npm init --yes
  1. To install testing tools tape and tap-sec, along with @architect/sandbox as development dependencies, run the following command:
npm i tape tap-spec @architect/sandbox -D
  1. To add tests to your app, open your package.json file in a text editor and replace the test script line with:
    "test": "tape test/index-test.js | tap-spec"
  1. To add the test scaffolding, create a test folder 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)
end = await sandbox.start()
t.ok(true, 'start the sandbox')
})

// your tests will go here

test('end', async t=> {
t.plan(1)
end()
t.ok(true, 'shut down sandbox')
})
  1. Run the tests using npm:
npm t
  1. Add a test to see that http://localhost:3333 returns an HTTP statusCode 200 using tiny-json-http