CurrentUser en Django

Que es un CurrentUser y para que diablos me puede servir??

Cuando tenemos una aplicación en Django donde manejamos sesiones la mayor parte de las veces ocupamos saber que usuario es el que se encuentra loggeado para realizar alguna acción con la base de datos, ese es el CurrentUser (Usuario Actual)

Como solucionarlo sin hacer nuestras propias funciones ?(No reinvanetar la rueda)

Muy facil con esta libreria

django-cuser

Como instalar ?

$ pip install django-cuser

No se nos olvide agregarlo a nuestras aplicaciones en settings.py

Como lo uso?

1.- Si quiero que se guarde automaticamente el usuario loggeado a un modelo:

from django.db import models
from cuser.fields import CurrentUserField
# Create your models here.

class Categoria(models.Model):
    descripcion=models.CharField(max_length=50)
    usuario = CurrentUserField()
    def __unicode__(self):
        return self.descripcion

2.-Si quiero obtener el usuario para hacer una consulta

from cuser.middleware import CuserMiddleware
from django.views.generic import ListView
from .models import Categoria

class Categorias(ListView):
 template_name = "categorias.html"
 model = Categoria
 context_object_name = "categorias"

 def get_queryset(self):
  user = CuserMiddleware.get_user()
  queryset=super(Categorias,self).get_queryset().filter(usuario=user).order_by('id')
  return queryset

Mi experiencia con Webpack

Que es ?

Básicamente Webpack es un empaquetador de Javascript.

Que podemos hacer con el ?

De todos nuestros archivos Javascript crea uno solo, esto es útil para desplegar en producción.

Puede configurarse como servidor de desarrollo en tiempo real, esto nos sirve para cada cambio que hagamos lo refleje el servidor.

Podemos empaquetar también archivos sass y less.

Y otras cosas que aun no he necesitado.

Para que lo puedo usar ?

Personalmente lo utilice para trabajar React.js pero puede combinarse bien con Angular o algún otro framework de Javascript.

Como instalarlo ?

$ npm install -g webpack

Después de instalarlo debemos crear un archivo de configuración, les comparto el mio:

module.exports = {
 resolve: {
    extensions: ['', '.js', '.jsx']
 },
 entry: './app.js', //cual es la entrada de nuestra aplicacion
 output: {
   path: 'build',
   filename: 'index.js',
   //publicPath: '/build/'
 },
 devServer: { // opciones para el servidor de desarrollo
   inline: true, // para que se recargue automáticamente cuando cambie un archivo
   contentBase: "build",
   port: 3333, // puerto donde funcionará el servidor
   historyApiFallback: true,
 },
 module: {
   loaders: [
     {
       test: /\.js$/, //probamos por la extensión .js
       exclude: /node_modules/, //no queremos procesar los archivos en node_modules
       loader: 'babel', //utilizamos babel
       query: { //cargamos los presets que instalamos
         presets: ['es2015', 'react']
       }
     }
   ]
 }
};

Para poder usar el servidor de desarrollo hay que agregar unas lineas a nuestro archivo packages.json

Instalación:

$ npm install --save-dev webpack-dev-server

Configuración:

{
  "name": "react_base",
  "version": "1.0.0",
  "description": "webpack server",
  "main": "index.js",
  "scripts": {
    "start": "node ./node_modules/webpack-dev-server/bin/webpack-dev-server.js"
  },
  "author": "mikko",
  "license": "ISC",
  "dependencies": {
    "react": "^15.3.2",
    "react-dom": "^15.3.2",
    "react-router": "^3.0.0"
  },
  "devDependencies": {
    "babel-core": "^6.18.0",
    "babel-loader": "^6.2.5",
    "babel-preset-es2015": "^6.18.0",
    "babel-preset-react": "^6.16.0",
    "express": "^4.14.0",
    "webpack": "^1.13.2",
    "webpack-dev-server": "^1.16.2"
  }
}

Como arrancar el servidor de desarrollo?

$ npm start

Como general el empaquetado?

$ webpack --watch

Que son los entornos vituales ( VirtualEnv ) y para que sirven con Django.

Aveces tenemos el problema que hacemos una aplicación en una determinada versión, por ejemplo Django 1.7 y actualizamos a una versión mas reciente. Por lo cual nuestras aplicaciones por lo general tienen problemas y algunas dejan de funcionar. Para evitar eso están los entornos virtutales o virtualenv, que lo que hace es darnos versiones independientes, tipo una maquina virtual pero para python.

Para usarlos primero que nada hay que instalar

Para python 2.7

# Debian, Ubuntu
# (esta opción instalará Python 3 y Python 2.7)
$ sudo apt-get install virtualenv python-virtualenv

 Tambien se puede instalar con pip

# Linux, OS X
$ sudo pip install virtualenv

Para crear un Proyecto (un nuevo entorno virtual)

# Linux, OS X
$ virtualenv mi_proyecto

Para Activarlo

 mi_proyecto
$ source bin/activate
(mi_proyecto)$

Para Desactivarlo

(mi_proyecto)$ deactivate
$

Ahora ya podemos instalar todo lo que necesitemos para nuestro proyecto sin necesidad de afectar proyectos anteriores o futuros.

Configurar Django con Nginx usando Uwsgi

¿ Que es Nginx ?
Es un servidor web y proxy muy ligero, una alternativa al Apache y con una facil configuracion, decidi utilizar Nginx para utilizarlo en un servidor casero con una muy pobre conexion a internet.

Paso 1:

$>sudo apt-get install python python-dev python-setuptools

Paso 2:
Instalamos un entorno virtual de python.

$>sudo easy-install pip

$>sudo pip install virtualenv

Paso3:
Instalamos el servidor Nginx

$>sudo apt-get install nginx

Paso 4:
Crear una carpeta para para hacer el entorno virtual de python

$>sudo mkdir /src/www

$>cd /src/www

$>virtualenv -system-site-packages applicacion

$>cd /src/www/aplicacion

$>source bin/activate

Paso 5:
Suponiendo que ya tenemos un proyecto con Django y Mysql instalamos uwsgi

$>pip install uwsgi

Paso 6:
Para verificar lo que tenemos instalado con pip

$>pip freeze

Paso 7:
Entramos a nuestro proyecto en Django y buscamos y editamos el archivo wsgi.py y le agregamos las siguiente lineas para realcionarlo con nuestro virtualenv.

import sys

from site import addsitedir

#ruta de el virtualenv

addsitedir(‘/src/www/aplicacion/lib/python2.7/site-packages')

#ruta de mi aplicacion Django

sys.path = ['/home/username/projects/myapp/','/home/username/projects/myapp/myapp/'] + sys.path

Paso 8:
Podemos probar nuestro proyecto Django

uwsgi --http :8000  --wsgi-file /home/username/projects/myapp/myapp/wsgi.py

Paso 9:
Editamos el archivo de default de nginx

$>cd /etc/nginx/sites-available

Paso 10:
Modificamos las siguientes lineas

location /{

   include uwsgi_params;

   uwsgi_pass 127.0.0.1:8000;

}

location /media {

   alias /home/username/projects/myapp/myapp/media

}

location /static {

   alias /home/username/projects/myapp/myapp/static

}

Nota:El archivo contiene mas lineas esas las dejamos igual, solo hay que modificar location / y agregar media y static
Paso 11:
Correr nuestra app y reiniciar Nginx

$>uwsgi --socket:8000  --wsgi-file /home/username/projects/myapp/myapp/wsgi.py -d output.log

$>sudo service nginx restart

Instalar de una manera facil la ultima version de Node.js

Que es Node.js ?
Basicamente es javascript del lado del servidor

Para que me sirve ?
El principal problema que resuelve Node.js es poder usar aplicaciones en tiempo real, en otras palabras puedo hacer que mis aplicaciones tengan notificaciones en tiempo real o un chat o cualquier cosa que se nos ocurra.

Podemos crear aplicaciones completas y escalables tanto como combinarlo con otras aplicaciones de hechas en cualquier otro lenguaje.

Que necesito para este tutorial?
Cualquier distribución de linux basada en Debian (Debian, Cualquier Ubuntu, Mint, Elementary Os ) no quiere decir que no se pueda en Windows pero este blog es de linux

Pasos

$> sudo apt-get update
$> sudo apt-get install python-software-properties software-properties-common
$> sudo add-apt-repository ppa:chris-lea/node.js
$> sudo apt-get update
$> sudo apt-get install nodejs 

Con esto instalamos la ultima versión de Node.js y tambien se instala el npm un gestor de paquetes muy util que después utilizaremos.

Verificar veriones

$>node -v
v0.10.26
$>npm -v
1.4.3

Instalar plugin de Emmet en Sublime Text 3

Emmet es un plugin para muchos editores (Sublime, Brackets, Eclipse, Netbeans) que agiliza la manera de escribir código HTML en forma de abreviaciones.

<!doctype html>

<html lang="en">
<head>
    <title>Demo</title>
</head>
<body>
<!-- Esta es la sintaxis de Emmet, tan solo presionamos Tab para que funcione -->
ul>li*5>{Item $}

</body>
</html>

Resultado:

<!doctype html>
<html lang="en">
<head>
    <title>Demo</title>
</head>
<body>
  <ul>
   <li>Item 1</li>
   <li>Item 2</li>
   <li>Item 3</li>
   <li>Item 4</li>
   <li>Item 5</li>
  </ul>
</body>
</html>

Para instalarlo en Sublime Text 3 seguiremos estos pasos

1. Instalar el Package Controller

2. Ir a View > Show Console

3. Pegar la siguiente cadena y presionar enter:

import urllib.request,os,hashlib; h = '7183a2d3e96f11eeadd761d777e62404' + 'e330c659d4bb41d3bdf022e94cab3cd0'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

4. Reiniciar Sublime Text 3

5. Presionar Ctrl + Shif + P y tecleamos y seleccionamos Install Package

6. Nos desplegara otro menú y buscamos Emmet y presionamos enter para instalar

7. Nos despliega un archivo Package Control Messages lo cerramos y listo tenemos instalado Emmet

podemos encontrar un poco mas de la sintaxis aqui

Teclas rápidas en Sublime Text 3

Sublime Text es de los mejores editores para frontend (html, javascript, css, aunque también se puede utilizar con lenguajes de programación) que existen actualmente, su potencia radica en la ligereza, simplicidad e integración con plugins, lamentablemente no es gratuito pero se puede usar  ignorando el mensaje de compra, tiene un costo aproximando de $70 dlls.

Pero para sacarle el mayor provecho posible a este editor hay ciertas teclas rápidas que son de muchísima utilidad.

Nota: Ctrl es esquivalente a Cmd en OSX

Agregar sintaxis:

Ctrl + Shift + P

Esto nos permite agregar una sintaxis, vienen algunas por default pero al tiempo que vayamos agregando plugins esta lista crece, este comando también nos permite agregar paquetes, pero de esto hablare en otro tutorial.

Mover una linea:

Ctrl + Shift + (Flecha Arriba) ó (Flecha Abajo)

Si queremos mover una linea completa hacia arriba o hacia abajo.

Seleccionar y escribir el mismo texto:

Ctrl + Click

Si queremos poner el mismo texto en varias partes dejamos presionado Ctrl y hacemos click en los puntos donde queramos escribir lo mismo.

Multiples ventanas:

Alt + Shift + 1 ó 2 ó 3 ó 4 (dependiendo el numero de ventanas)

Esto es muy util para trabajar con el HTML y CSS en ventanas separadas.

Abrir y cerrar árbol de archivos

Ctrl + K  y después Ctrl + B

Se tienen que hacer los 2 comandos para abrir como para cerrar el árbol de archivos

SublimeText contiene muchas mas combinaciones de teclas pero estas son algunas de las que uso mas seguido espero y sirvan si estas por iniciar con este excelente editor.