Comunidad de diseño web y desarrollo en internet online

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:

De preferencia recomiendo utilizar Sublime Text como nuestro entorno para desarrollar.


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í:

Código :

@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;
}



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

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

¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.

Publica tu comentario

El autor de este artículo ha cerrado los comentarios. Si tienes preguntas o comentarios, puedes hacerlos en el foro

Entra al foro y participa en la discusión

o puedes...

¿Estás registrado en Cristalab y quieres
publicar tu URL y avatar?

¿No estás registrado aún pero quieres hacerlo antes de publicar tu comentario?

Registrate