Giter Club home page Giter Club logo

webziptask's Introduction

WebZipTask

This webtask provides a way to serve static and dynamic content using a wt-bundle. To be honest it is a bit of a necessary hack to that uses a zip archive to store the resources as a bundle then serve them up using express.

resources

I have provided a sample resources set of content that you should overwrite, it is there for the purpose of testing

$ tree resources
resources
├── index.html
└── js
    └── logic.js

deploy

The deploy script will bundle up the resources directory and make it a ZIP file that is loaded as a base64 encoded resource.js file. This makes it easy for the wt-bundle to package the collection as one entity.

$ ./deploy.sh 
  adding: index.html (deflated 39%)
  adding: js/ (stored 0%)
  adding: js/logic.js (deflated 15%)

> [email protected] bundle /Users/davide/git/github.com/eddo888/WebZipTask
> wt-bundle webtask.js -o ./build/bundle.js

Bundle successfully written to `./build/bundle.js`
Name:        WebZipTask
Removed webtask: WebZipTask
Webtask created

You can access your webtask at the following url:

https://wt-eddo888-tpg-com-au-0.run.webtask.io/WebZipTask

now you can curl the web task to get the resource

$ curl https://wt-eddo888-tpg-com-au-0.run.webtask.io/WebZipTask/index.html
<html>
  <head>
    <script src="js/logic.js" type="text/javascript"></script>
  <body>
    <p>Hello</p>
    <script type="text/javascript">
      hello('world');
    </script>
  </body>
</html>

logging

please see webtask.io for more info on webtasks and logging

$ wt logs
[22:48:47.660Z]  INFO wt: connected to streaming logs (container=wt-eddo888-tpg-com-au-0)
[22:48:52.557Z]  INFO wt: new webtask request 1487112532514.443614
[22:48:52.711Z]  INFO wt: url /index.html
[22:48:52.729Z]  INFO wt: finished webtask request 1487112532514.443614 with HTTP 200 in 174ms

secrets

Web tasks allow you to configure secrets using the wt create --secret option. I have packaged up .env capability that allows you to access configuration data in either webtask context or local server.js context.

.env

message=Hello

this gets uploaded to the webtask and is accessible through the config object

var config = require('./config');
console.log('message',config.message);

run locally

To run this locally using the server.js component, do the folowing;

$ npm install

$ npm start

> [email protected] start /Users/davide/git/github.com/eddo888/WebZipTask
> wt-bundle server.js -o ./build/bundle.js && node ./build/bundle.js

Bundle successfully written to `./build/bundle.js`
Server started on port 3000

now you can curl the result

$ curl localhost:3000/index.html
<html>
  <head>
    <script src="js/logic.js" type="text/javascript"></script>
  <body>
    <p>Hello</p>
    <script type="text/javascript">
      hello('world');
    </script>
  </body>
</html>

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.