Aspen, un framework para Python

Hoy les traigo ASPEN, un framework para Python que nos permitirá realizar aplicaciones completas en cuestión de minutos.

ASPEN es un Web Framework para Python que mapea los archivos directamente desde el filesystem. Los Simplates son el formato de archivo que Aspen utiliza para representar recursos HTTP. Ellos son el principal atractivo de Aspen. Los Simplates contienen un único archivo con una o más páginas.
Conoce más acerca de ASPEN.

También debemos Instalar Python 2.7.6 el cual encuentras en su Sitio web oficial

Descarga el instalador: virtualenv

Crea un proyecto:

Código :

$ virtualenv foo
$ cd foo
$ . bin/activate

Cómo instalar ASPEN

Instala ASPEN:

Código :

(foo)$ pip install aspen
blah
blah
blah

Crea la raíz de nuestro servidor:

Código :

(foo)$ mkdir www
(foo)$ cd www

Ejecuta nuestro servidor ASPEN:

Código :

(foo)$ aspen
Greetings, program! Welcome to port 8080.

Dentro de nuestro nuevo directorio ‘WWW’, comenzaremos ha crear un CHAT:

[nota:3f7c1e8beb]De preferencia recomiendo utilizar Sublime Text como nuestro entorno para desarrollar.[/nota:3f7c1e8beb]

Requerimientos:

  • JQuery: 1.6.1
  • Socket.io.js
  • reset-min.css

Descargarlos e incluirlos en ‘C:/foo/www’

Código :

<!--
Este código contiene extractos de: HTML, CSS y JavaScript lo llamaremos 'chat.html' ira dentro de 'www'
//-->
<head>
    <title>Chat!</title>
    <style>@import url("socket-toys.css");</style>
    <style>

        #messages {
            padding: 0 0 60px;
        }
        #messages P {
            padding: 0;
        }
        #input {
            position: fixed;
            bottom: 0;
            left: 0;
            padding: 20px;
            background: #B8E273;
        }
        #input INPUT {
        }

    </style>
</head>
<body>

    <p>Tu nombre de Usuario: <button></button>. con el cual seras reconocido en este chat.</p>

    <div id="input"><input /></div>
    <div id="messages"></div>
</body>
<script src="jquery-1.6.1.min.js"></script>
<script src="socket.io.js"></script>
<script>

    var App = {};

    App.send = function(e)
    {
        if (e.which !== 13) // return
            return;

        var data = {}
        data.username = App.username;
        data.message = $(this).val();
        if (data.message.length > 512)
        {
            alert("Messages are limited to 512 characters, sorry.");
        } else {
            App.postMessage(data);
            App.socket.json.send(data);
            $(this).val('');
        }
    };

    App.changeUsername = function()
    {
        var newUsername = prompt("Username?");
        if (newUsername !== null)
        {
            newUsername = newUsername.trim();
            if (newUsername !== "")
            {
                if (newUsername.length > 64)
                {
                    alert("Usernames are limited to 64 characters, sorry.");
                } else {
                    App.username = newUsername;
                    App.$username.text(App.esc(newUsername));
                }
            }
        }
    };

    App.recv = function(data)
    {
        if (data.username !== App.username)
            App.postMessage(data);
    };

    App.esc = function(s)
    {
        return $('<div>').text(s).html();
    };

    App.postMessage = function(data)
    {
        App.$messages.append( '<p>'
                            + '<b>'+App.esc(data.username)+'</b>: '
                            + App.esc(data.message)
                            + '</p>' 
                            );

        // http://stackoverflow.com/questions/1890995/
        $("html, body").animate({ scrollTop: $(document).height() }, "slow");
    };

    App.resize = function()
    {
        $('INPUT').width($(window).width() - 40);
    };

    App.main = function()
    {
        $('.chat').wrap('<b>');
        $(window).resize(App.resize);
        App.resize();

        App.$messages = $('#messages');
        App.$input = $('input');
        App.$input.keyup(App.send);
        App.$input.val('Enter messages here.');
        App.$input.focus();
        App.username = 'anon-' + Math.floor(Math.random()*101).toString();
        App.$username = $('button');
        App.$username.text(App.username);
        App.$username.click(App.changeUsername);

        App.socket = io.connect( 'http://localhost:8080/'
                               , { "resource": "chat.sock"
                                 , "transports": ["xhr-polling"]
                                  }
                                );
        App.socket.on('message', App.recv);
    };

    $(document).ready(App.main);
</script>

Después de esto crearemos otro archivo escrito en Python con extensión ".sock " y lo llamaremos ‘chat.sock’:

Código :

message = socket.recv()
channel.send_json(message)

Por último tenemos que crear ‘socket-toys.css’ el cual quedaría así:

[css:1:3f7c1e8beb]
@import url("reset-min.css");
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic);

BODY {
font: 300 12pt/14pt Lato, sans-serif;
padding: 20px;
}

H1 {
font-weight: 700;
font-size: 18pt;
line-height: 24pt;
}
H2 {
color: #666;
text-shadow: 0px 1px 2px #CCC;
margin: 1em 0 0.5em;
}
PRE {
border: 1px solid #999;
background: #eee;
padding: 5px;
font: normal 10px/12px Monaco, "Lucida Console", monospace;
overflow: auto;
}
P {
padding: 0 0 1em;
}
#general {
font-size: 10pt;
line-height: 12pt;
}
#nav {
padding: 0;
}
#nav B {
font-weight: 700;
background: #FFFE98;
}

[/css:1:3f7c1e8beb]

Iniciado el servidor ASPEN inicia tu archivo html en: ‘chat.html‘.

¡FELICIDADES! Ahora tienes tu primera aplicación en Python + ASPEN

Enviar comentario

via Cristalab http://ift.tt/1fBNJfI

Advertisements

Tags:

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: