Developing C/S Application Using JavaScript and CouchDB

Now I introduce how to use Javascript and CouchDB to develop traditional C/S application.

At first, we install couchdb and apache http server on computer. Because it uses cross-domain request, and the couchdb's http response header cannot be modified (I use couchbase and don't know where to modify http headers), I use apache http server to proxy couchdb.

Secondly, add the below code to httpd.conf.

<VirtualHost *:80>
    <Proxy http://localhost:5984>
        Order deny, allow
        Allow from all
    </Proxy> 
    RewriteEngine on
    RewriteCond %{REQUEST_METHOD} ^OPTIONS
    Header set Access-Control-Allow-Origin "*"
    Header set Access-Control-Allow-Headers Content-Type
    Header set Access-Control-Allow-Methods "GET, POST, PUT, OPTIONS, DELETE"
    Header set Access-Control-Max-Age 3600
    
    ProxyRequests off
    ProxyPreserveHost Off
    AllowEncodeSlashes On
    KeepAlive Off

    ProxyPass / http://localhost:5984 nocanon
    ProxyPassReverse / http://localhost:5984
</VirtualHost>

Now start your httpd, and visit http://localhost/_utils to create a database named "test".

And third, create a test.html and import jquery script and add the below code to create a document in couchdb.

<script>
$.ajax({
    url: 'http://localhost/test',
    type: 'POST',
    contentType: 'application/json',
    data: '{"firstname": "hello", "lastname": "world"}'
});
</script>

And all are done. Open your test.html via file protocol with browser, and then see the created document in couchdb. If all are ok, you could write any ui applications and run it to access couchdb database directly without deploying your application on any web server.

Enjoy it.

WireframeSketcher as UI DSL

Many software development team have some tools to draw wireframes to describe its upcoming application how to interact with human-users. But this way just provides UI developers roughly feelings about application designed by designers, and it doesn't improve development speed.

In this blog, I will introduce a UI prototype code generation tool.

If you don't know what the DSL is, please visit Domain-specific language.

At first, we should get Wireframe Sketcher Studio. There is an example to demonstrate using wireframe sketcher to generate extjs4 UI prototype.

And use the the wsc (Wireframe Sketcher Compiler) to compile .screen file to generate extjs4 source code. This project will be put on github.com soon.

And the generated page is this below:

 That's all. This project is under development. And will support Dojo, JQuery.